Accessibility Heuristics
Published on October 7, 2008 (↻ August 6, 2023), filed under Development (RSS feed for all categories).
You can bolster your accessibility knowledge by internalizing heuristics and ground rules. Just having updated my German article on accessibility heuristics it looked useful to share these in English as well. These guidelines and rules are based on documentation provided by the W3C and IBM and come without comment; it’s still useful, indispensable even, to consult the source material.
W3C
WCAG 1.0 Quick Tips
The classic “quick tips” stem from the Web Content Accessibility Guidelines 1.0:
- Images and animations: Use the
alt
attribute to describe the function of each visual. - Image maps: Use the client-side
map
[element] and text for hotspots. - Multimedia: Provide captioning and transcripts of audio, and descriptions of video.
- Hypertext links: Use text that makes sense when read out of context. For example, avoid “click here.”
- Page organization: Use headings, lists, and consistent structure. Use CSS for layout and style where possible.
- Graphs and charts: Summarize or use the
longdesc
attribute. - Scripts, applets, and plug-ins: Provide alternative content in case active features are inaccessible or unsupported.
- Frames: Use the
noframes
element and meaningful titles. - Tables: Make line-by-line reading sensible. Summarize.
- Check your work: Validate. Use tools, checklist, and guidelines at www.w3.org/TR/WCAG.
(It’s great that QA is being called out!)
WCAG 2.0 Quick Tips
With WCAG 2.0 come new and improved tips:
- Perceivable:
- Provide text alternatives for non-text content.
- Provide captions and alternatives for audio and video content.
- Make content adaptable, and make it available to assistive technologies.
- Use sufficient contrast to make things easy to see and hear.
- Operable:
- Make all functionality keyboard accessible.
- Give users enough time to read and use content.
- Do not use content that causes seizures.
- Help users navigate and find content.
- Understandable:
- Make text readable and understandable.
- Make content appear and operate in predictable ways.
- Help users avoid and correct mistakes.
- Robust:
- Maximize compatibility with current and future technologies.
WCAG 3.0 Guidelines [Update (July 6, 2021)]
WCAG 3.0 is in progress and may offer tips similar to prior WCAG versions. Its general structure offers rough orientation:
- Provide text alternatives for non-text content.
- Use common clear words.
- Provide captions and associated metadata for audio content.
- Use sections, headings, and sub-headings to organize content.
- Provide sufficient contrast between foreground text and its background.
IBM
IBM once shared their own set of accessibility recommendations and heuristics that is now, along with more detailed information, offered by the ACM:
- Provide meaningful and relevant alternatives to non-text elements.
- Support consistent and correctly tagged navigation.
- Allow complete and efficient keyboard usage.
- Respect users’ browser settings.
- Ensure appropriate use of standard and proprietary controls.
- Do not rely on color alone to code and distinguish.
- Allow users control of potential distractions.
- Allow users to understand and control time restraints.
- Make certain the website is content compatible with assistive technologies.
About Me
I’m Jens (long: Jens Oliver Meiert), and I’m a frontend engineering leader and tech author/publisher. I’ve worked as a technical lead for companies like Google and as an engineering manager for companies like Miro, I’m a contributor to several web standards, and I write and review books for O’Reilly and Frontend Dogma.
I love trying things, not only in web development (and engineering management), but also in other areas like philosophy. Here on meiert.com I share some of my experiences and views. (Please be critical, interpret charitably, and give feedback.)
Comments (Closed)
-
On October 8, 2008, 6:27 CEST, Joe Clark said:
Use links that make sense in their context, not out of context.
-
On October 8, 2008, 8:55 CEST, Jens Oliver Meiert said:
Valid distinction. I quoted the guidelines.
-
On October 22, 2008, 11:24 CEST, Richard Morton said:
As WCAG 2.0 is still at the candidate recommendation stage, I must admit that my knowledge of it is lacking so it is definitely useful to see it summarised here. One thing I have found useful to help me remember the overall concept is POUR (Perceivable, Operable, Understandable, Robust), which I think is a really good way of explaining accessibility in a non-technical way.
Read More
Maybe of interest to you, too:
- Next: Code Responsibly
- Previous: Web Standards at Google
- More under Development
- More from 2008
- Most popular posts
Looking for a way to comment? Comments have been disabled, unfortunately.
Get a good look at web development? Try WebGlossary.info—and The Web Development Glossary 3K. With explanations and definitions for thousands of terms of web development, web design, and related fields, building on Wikipedia as well as MDN Web Docs. Available at Apple Books, Kobo, Google Play Books, and Leanpub.