How do you test for keyboard usage in your websites and applications?

  1. , cancel bubble said:

    So I guess this is the way to comment on articles here, so here I go: “Then, there are tables for layout “ Why are tables bad for *accessibility*?  A lot of table-based layouts that you see nowadays are due to whatever back-end technology is being used, so what are you supposed to do when you can’t 100% control the front-end markup that’s generated?
  2. , Aaron Gustafson said:

    @cancel bubble: First of all, tables are not, in and of themselves, bad for accessibility. tables were created to provide a mechanism for organizing data; they were not made for laying out pages. tables for layout came about in the late ’90s as a means of laying out pages before we had CSS. With the advent of CSS, the need for table-based layouts went away and the practice is now, by and large, frowned upon. If you’d like more info on how tables are “seen” by assistive technology and how that may affect someone’s ability to access your page content, I suggest reading WebAIM’s article on accessible tables. As for your second question: What back-end tech are you using? CSS-based layouts have been around for the better part of a decade and most CMS software out there (which is what I assume you’re referring to when you say “back-end technology”) has been updated to support table-less layouts. If yours doesn’t I’d recommend upgrading or migrating to something that supports a more modern approach to markup.
  3. , cancel bubble said:

    From WebAIM: “to be honest, using tables for layout is not the worst thing that you could do in terms of accessibility.” From my experience, tables for layout from back-end CMS systems tend to be wrappers, they should degrade well (content linearization from the linked artice).  *Data* tables are another issue (not being able to have or add summary or scope attributes as an example), but I’m talking about tables for *layout*.  You end up with ridiculous markup like (2 nested tables which hold the “real” markup):   your “real” markup that you want/need    And I’m not including all the table attributes added server-side.  You end up with A LOT of extra markup. Then of course there are simple hyperlinks which end up contact us! Instead of contact us! Where id is your hook for doSomethingWonderful() and simple hyperlinks aren’t dependent on JavaScript. Also, in Enterprise-land, you can’t just upgrade or migrate to something else.  SharePoint (more than just a “CMS”) 2010 is still table-based layout.
  4. , frankw said:

    I agree, tables are not for layout. But in CMS software tables sometimes are the only way to layout the page. On my startpage Fotograf Osnabrück I used tables to organize the text below the diashow.
  5. , frankw said:

    I agree, tables are not for layout. But in CMS software tables sometimes are the only way to layout the page. On my startpage Fotograf Osnabrück I used tables to organize the text below the diashow.
  6. , Derek Featherstone said:

    cancel bubble said: You end up with A LOT of extra markup. Yes, precisely. And that markup, while not the worst thing for accessibility, does have an impact. Every empty table cell means another keystroke to get to real content. Every nested table is potential noise to a screen reader user when it’s tough enough already to get at content. Tables for layout definitely are not best practice and have an impact on the user experience regardless of the fact that many CMS tools use them. frankw said: But in CMS software tables sometimes are the only way to layout the page. On my startpage Fotograf Osnabrück I used tables to organize the text below the diashow. That table you’ve used is exactly the type of tables that don’t work well. If a user is to go through that table in a linear order, they’ll go through the top row first and then the second row. Your content is set so that the upper row has content that relates to it in the row below, but that association isn’t clear because it is in a table.
  7. , frankw said:

    Hopefully users find the right way to read the content of a table. But what about searchengines. How do they read the content of a table wich is mixed up by the quellcode - respective by the table structure?
  8. , cancel bubble said:

    Yes, precisely. And that markup, while not the worst thing for accessibility, does have an impact. Every empty table cell means another keystroke to get to real content.” Even empty tables that are wrappers (they hold no text content)?  I can’t seem to post html code here, but imagine 2 “empty” tables that hold nothing but the markup you really intend: {table} {tr}{td} ——{table} ——{tr}{td} ————{div}our “real” markup with “real” content{/div} ——{/td}{/tr} ——{/table} {/td}{/tr} {/table} The tables do tend to have lots of server generated attributes,  which I didn’t include, but they’re basically empty tables.
  9. , bobmarteal said:

    Thanks for bringing this up. Aside from focus how can you make your site more tab friendly. I went to JetBlue and Kayak and had pretty much the same issues. Then I came to log in on this site and couldn’t tab down to the email field i needed to fill out because i had forgotten my password. I also noted the only thing that you can tab to is the search box. I always try to go through my sites and tab through but it always seems like forms, usually the search boxes, are the only tabable (tm?) elements. Is there a browser setting or something to make the whole page tabable? Thanks.
  10. , Derek Featherstone said:

    bobmarteal: Is there a browser setting or something to make the whole page tabable? Are you using Safari? If so, you have a checkbox in the advanced preferences pane that says “Press Tab to highlight each item on a webpage. That’ll open up a whole new avenue for keyboard testing for you.
  11. , bobmarteal said:

    Ah, thanks! Is there anything similar in other browsers? Is it safe to say people needing assistive tech. generally use more “modern” browsers?
  12. , Derek Featherstone said:

    bobmarteal: Is there anything similar in other browsers? Is it safe to say people needing assistive tech. generally use more “modern” browsers? In most other browsers, you’ll have full keyboard access by default and be able to tab to all of the interface items (links, form fields, buttons etc) without changing a preference. Is it safe to say people needing assistive tech generally use more modern browsers? I wouldn’t put my money on it. While we’d like to believe that they should keep things up to date, there is sometimes a reluctance to upgrade because sometimes things just “break” so to speak. The recent launch of FireFox 4, for example, has resulted in some reports of things not working with assistive technology so some people are reverting back to their previous 3.6 builds or perhaps earlier. It is a very complex landscape–many of the folks we have done testing with in their homes/apartments have older technology simply because they have things working the way they want them and don’t want to risk something not working.  Not always the case, but it definitely does happen.
  13. , planet71 said:

    Speaking about usability - would be really great if you would set the .visited state for your links. :) I don’t know why, but most webdevelopers stopped using it, while it is really helpful. I hit my browsers Back’ button and I can clearly see, what I’ve already visited and what I haven’t. What do you think about it? I am very curious.
  14. , Aaron Gustafson said:

    would be really great if you would set the .visited state for your links. Thanks for the feedback, planet71. We did have some bare-bones :visited styles, but they were not differentiated enough to be apparent, so I have corrected that. As a general aside, there has been a lot of debate over the potential privacy issues :visited creates, so some browsers have been toying with dropping support or at least altering it considerably. A good place to start reading about this topic is this post on the Mozilla Security blog.