Accessibility Guideline |
Main Beneficiary |
Do not need to scroll to see navigation menu |
Visually impaired |
Link text does not go beyond viewport width |
Visually impaired |
Form fields are below (not beside) labels |
Visually impaired |
Images have an alternate text description |
Visually impaired |
UI elements (buttons, divs, etc) have descriptive labeling |
Visually impaired |
Prerecorded videos have captions |
Deaf |
Videos have either text transcript or audio description |
Visually impaired |
Live videos have captions |
Deaf |
Prerecorded videos have audio description |
Visually impaired |
Prerecorded audio content has sign language interpretation |
Deaf |
Videos have extended audio description that gives the narrator adequate time to describe what is happening in the video |
Visually impaired |
Videos have a full text transcript and audio description that is linked to from the original content |
Visually impaired |
Live Audio has text transcript (either real-time closed captioning or a prepared script that is linked to from the Audio content |
Deaf |
Uses more than one sensory characteristic for instructions |
Everyone |
User is notified of state changes |
Everyone |
On-screen way to manipulate volume control for audio content |
Mobile impairment |
On-page controls for changing text size |
Visually impaired |
Uses clear, sensible fonts |
Visually impaired |
Information conveyed by color must also be available by other means |
Visually impaired |
Text is a reasonable default size (14pt) |
Visually impaired |
Audio is not played automatically for more than 3 seconds, users are able to pause or prevent audio |
Deaf |
Normal-size (<18pt / 14pt bold) text: Contrast ratio of 4.5:1 |
Visually impaired |
Large text ( >18pt / 14pt bold): Contrast ratio of 3:1 |
Visually impaired |
Text can be resized to 200% |
Visually impaired |
Content resizes and reflows for the magnified viewport size |
Visually impaired |
Images of text are not used |
Visually impaired |
Contrast ratio between background and text is at least 7:1 |
Visually impaired |
Low or no background audio. Background audio can be turned off or must be 20 decibels lower (~4 times quieter) than foreground |
Deaf |
Users are offered a range of presentation options. Users can select from foreground and background colors |
Everyone |
Width is no more than 80 characters or glyphs (40 if CJK) |
Visually impaired |
Text is not justified (aligned to both the left and the right margins) |
Visually impaired |
Line spacing (leading) is at least space-and-a-half within paragraphs, and paragraph spacing is at least 1.5 times larger than the line spacing. |
Visually impaired |
Text can be resized without assistive technology up to 200 percent in a way that does not require the user to scroll horizontally to read a line of text on a full-screen window. |
Visually impaired |
Touch targets are 9mm high and 9 mm wide |
Visually impaired, mobile impairment |
Touch targets close to minimum size are surrounded by inactive space |
Visually impaired, mobile impairment |
Gestures can be replaced by focusing and activating elements |
Visually impaired, mobile impairment |
Two-finger gestures can be replaced with a single stylus or by focusing and activating elements |
Visually impaired, mobile impairment |
Events are triggered only when touchend event is fired |
Visually impaired, mobile impairment |
Device manipulation (shaking, tilting) can be replaced by touch / keyboard options |
Visually impaired, mobile impairment |
Does not require extensive thumb range of motion |
Visually impaired, mobile impairment |
Natural and comfortable left-handed use |
|
An external keyboard is able to be used to navigate the site |
Mobile impairment |
User is able to move focus between all elements using only the external keyboard |
Mobile impairment |
All functionality can be accessed through the external keyboard |
Mobile impairment |
Users are able to turn off, adjust, or extend the time limit for actions or displaying content |
Everyone |
Moving, blinking, scrolling content has an option to stop the motion |
Everyone |
Users are able to delay frequency of auto-updating content |
Everyone |
No time limits or time-controlled content |
Everyone |
Does not use an automatic refresh or redirect that interrupts users’ focus |
Everyone |
User data is maintained when the user is asked to reauthenticate (shopping cart content, form / survey answers, etc) |
Everyone |
Link does not violate general flash threshold |
Cognitive impairment |
Content does not flash more than 3 times in any 1 second period |
Cognitive impairment |
Discernable home button |
Everyone |
Screen has title that describes the purpose |
Everyone |
Elements are focused in an understandable and meaningful order |
Visually impaired |
Purpose of links / buttons can be determined from link / button text and context |
Everyone |
Screen has multiple ways to reach it (search function, sitemap, navigation menu) |
Everyone |
Headings and labels describe topic / purpose |
Visually impaired |
Focus/currently selected element is clearly visible |
Everyone |
App uses breadcrumbs to aid in navigation and displays where the user is within the app |
Everyone |
Link / button purpose can be determined from link / button text only |
|
Content is broken up by headings |
Everyone |
Screen reader is able to detect change in orientation |
Visually impaired |
Both landscape and portrait orientation are supported |
Everyone |
Important information can be viewed without scrolling |
Everyone |
Default language of screen can be programmatically determined |
Visually impaired |
Use of jargon / technical terms is minimal and is explained when it is used |
Everyone |
Abbreviations are explained / defined |
Everyone |
Content is at an 8th grade reading level |
Everyone |
Words that are difficult to pronounce have links to a pronunciation guide |
Everyone |
Context of focus does not change when an element is focused |
Visually impaired |
Forms do not automatically submit when all fields are filled |
Everyone |
Content at the top of the page is consistent across the app |
Everyone |
Elements that trigger changes (buttons, links, etc) are clearly indicated |
Visually impaired |
Items that perform the same action are contained in the same element |
Visually impaired |
Elements use conventional positioning (upper left for back, menus are left-aligned, etc) |
Everyone |
Elements are not changed until users request a change |
Everyone |
Identify and explain any errors that can be automatically detected |
Everyone |
Save correct information and allow user to correct the error and continue |
Everyone |
Labels or instructions are provided when content requires input |
Everyone |
Instructions for how to use gestures are readily available |
Everyone |
Error suggestion for formatted input shows the correct format |
Everyone |
Legal, financial, changes to user controlled data are checked for input errors and the user is asked to confirm or these changes are made reversible |
Everyone |
Onscreen indiactor for how to use gestures |
Everyone |
Context-sensitive help is given to users |
Everyone |
Content is ordered so that screen reader reads it in an order that makes sense |
Visually impaired |
The amount of text entry is reduced thorough the use of select menus, radio buttons, checkboxes, etc |
Mobile impairment |
Application complies with OS-level changes to font |
Visually impaired |
Application complies with OS-level changes to text color |
Visually impaired |
Information is exposed in a standard and expected way that screen reader can recognize and interact with |
Visually impaired |
All text elements are visible to screen reader |
Visually impaired |