top-ten-wcag-areas-for

advertisement
WCAG 2.0 top ten considerations: popular areas of focus for accessibility
1. Forms




Ensure that all input points have a corresponding label
Correct keyboard tab sequence through your form
Access keys (optional) for complex, long and laborious forms that are frequently used
Navigable and able to submit with keyboard alone
2. Document structure




Use the title tag to convey the relationship of the page to the rest of the site
Meaningful page titles
Heading tags that convey context and information
Use HTML mark-up to convey document structure and relationship
3. Navigation and links





Use consistent navigation on every page (predictability)
Use “skip to” links to bypass menu’s and other consistent header elements
Use anchor tags to navigate through large bodies of content
Use breadcrumb navigation to give site context
Meaningful link text that conveys information and purpose
4. Images and non-text elements




ALT tags for informative images (non-decorative)
For images of text, use links to longer descriptions or elaborate on that image in the content
(text only)
Decorative images should be presented using CSS and not embedded in the content
Ensure you have sufficient contrast ratio between background and foreground elements (4.5:1
for content, 3:1 for large text and headings)
5. Tables




Do NOT use tables to format your document or page
Tables are for tabular data only
Use THEAD, TFOOT, and TBODY tags to convey data relationship
Rely on CSS for formatting and avoid depreciated tags (such as the font tag)
1
WCAG 2.0 top ten considerations: popular areas of focus for accessibility
6. Mouse and keyboard issues



Test and ensure you can navigate with your keyboard alone (no required mouse clicks)
Do not rely upon the mouse for navigating or form interaction
Be cognizant of tedious clicking issues
7. Client-side to server-side handling





It is OK to use Javascript – JAWS provides some support for it. But does the user know when a
change occurs in the DOM?
Build base-level, server-side functionality first (when possible)
Add AJAX/Javascript functionality on top
Have a plan to degrade from client-to server-side functionality
Inform or direct the user to content changes within the page
8. Cues, instructions and error handling



Inform and instruct the user, especially with forms
Provide contextual helps and guide user input
Offer intuitive error messages
9. Display adaptation




Support for multiple browsers/user agents
Content should be format-neutral and formatted solely by stylesheets
Text issues: be cognizant of use of color, size, contrast and max width. Avoid full justification,
excessively wide bodies of content, and unreadable fonts/colors.
Allow user to override formatting (no embedded formatting)
10. Site and process context




Provide breadcrumb navigation when site is more than two levels deep
If multiple steps are involved in a process, indicate where they are in the process
Use title and heading tags to convey site context
Provide a sitemap
Please refer to the Web Content Accessibility Guidelines for actual specifications on compliance and how to
implement the above top ten issues: http://www.w3.org/TR/WCAG20/
Checklist provided by WebAIM: http://webaim.org/standards/wcag/checklist
2
Download