FAQ
Listed below are frequently asked questions. If you have a question that is not answered here, please start a discussion.
Apply the .clipped class (or it's rules) to the element that you want to be visually hidden. The element will remain accessible to screen readers on desktop and mobile devices.
.clipped {border: 0 !important;clip: rect(1px 1px 1px 1px); /* IE6, IE7 */clip: rect(1px, 1px, 1px, 1px);height: 1px !important;overflow: hidden;padding: 0 !important;position: absolute !important;white-space: nowrap !important;width: 1px !important;}
For more information please read the excellent "When and How to Visually Hide Content" by Dennis Lembree.
No, it is fine to use this technique.
There is a more detailed answer on the Google Webmaster forum.
You must enable the following option in Safari's preferences:
Safari -> Preferences -> Advanced -> Accessibility -> "Press Tab to highlight each item on a webpage"
And here’s how to do the same for Firefox:
System Preferences -> Keyboard -> Keyboard Shortcuts -> Full Keyboard Access -> "All controls"
It is true that Mac keyboards do not have an INSERT key, and this is a known issue with MRD. The workaround is to install a hotkey application such as Karabiner.
Once installed, check the checkbox "Enable at only Remote Desktop Connection Client - Use F12 as insert".
Now you should be able to activate any JAWS commands that require the INSERT key (e.g. opening the Links List).
It's true that only a very small percentage of users browse the web without JavaScript. Sometimes this is by choice, and sometimes not (a strict company security policy may disable JavaScript for all employees, for example).
We are not going to go out of our way to cater for these individuals.
However, there are other unknown factors which can potentially place the user into a non-JS or partial-JS state, for example:
A script fails to load due to poor connectivity
A script executes much later or slower than expected
A script fails due to incompatible browser support
We don’t have any non-JavaScript users
No, all your users are non-JS while they’re downloading your JS Jake Archibald (@jaffathecake) May 28, 2012
The only realistical way of defending against the unknown is by building our pages in the Progressive Enhancement way; we make sure our most important content and functionality1 is always available to users in any browser, in any situation.
1 Of course, in certain situations, some functionality simply cannot be replicated without JavaScript - a single page app (SPA) which relies heavily on realtime, client-side events, might fall under this category.
Identifying page headings is the responsibility of the design team.
As a rough guideline, know that every logical, visual block of the page must have a heading.
Sometimes a heading will be hidden visually offscreen and available only to screenreaders. Again, defining these types of headings is the responsibility of the design team.
Both the SPACEBAR and ENTER key should activate a button.
Only the ENTER key should activate a link. Pressing the spacebar whilst keyboard focus is on a link should scroll the page down.
Use aria-label in cases where a text label is not visible on the screen. If there is visible text labeling the element, use aria-labelledby instead.
A radio group allow only one choice to be selected.
A checkbox group allows zero or more choices to be selected.
A select group allow one or more choices to be selected.