9 Ways to Make Your Site More Accessible
The obvious followup question to 9 Reasons Why Accessibility Matters is "How do I do that?" It's not really as difficult as it might seem. Answer these nine questions, and see how your site's accessibility can be improved.
- Can you navigate your site easily? Are links and navigation obvious and intuitive? Look at it as if you'd never seen it before, would you understand how to get around quickly? Are your links visible or invisible?
- Does your site use skip links? It should. This allows members of your audience to quickly jump over blocks of content to get to what they came for. This will benefit keyboard only navigation, various accessibility tools, and readers who use magnification or zoom a lot.
- How much contrast does your site have? Use something like the Colour Contrast Analyser to see how your site rates. Good contrast can open up your site to people with a wide range of vision issues who otherwise might not otherwise be able to access it.
- Is your site valid and standards compliant? A valid and standards compliant site will much more consistently displayed across browsers and accessibility tools. It's not a guarantee, but a good start. Try doing a site test to see where you stand with your site. I use tools like the ones on this list to do this sort of work.
- How does your site look without CSS? Does it still make sense? CSS is a very powerful tool, but it can be abused. Screen readers and even your RSS feeds are going to display your site without CSS. If you use CSS to change one type of content to look like another, for instance to make a paragraph look like a unordered list, it's going to still look like a paragraph in your RSS feed.
- Did you define your default language in the HTML element of your web page? This simple addition to you code let's people know what language to expect.
- Did you define ALT text for your images? ALT, or alternative text, atributes will describe your images to your audience members that aren't viewing your images. Maybe they're using a screen reader, or maybe they just are saving download time while on dial-up. Without ALT text, they might not even notice they missed an important image.
- Did you use headings to identify navigation lists? Using a H2-H6 heading before a navigation list will help with screen readers and with keyboard navigation. It helps break up the site into identifiable regions so that navigation is more intuitive. If you don't like the way these headings look, then change their appearance with CSS. This will allow you to keep the appearance you like, but keep the improved navigation too. Update: 52% of screen reader users navigate by headings whenever possible - WebAIM Screen Reader Survey .
- Does your H1 heading at least partially match your page title? A simple thing, but it can significantly improve a viewers ability to identify where the are on your site, and to navigate. It also should improve your search engine results.
These items won't guarantee a perfectly accessible site, but they'll move you nine steps in the right direction. If you're interested in discussing how to improve the accessibility of your site, or accessibility in general, leave me a comment. Getting me to discuss accessibility is never a problem. To paraphrase Shrek, it's getting me to shut up that's the trick. Update: Thank you to Aankhen for checking my work. Both of the errors you caught should now be corrected.


Comments
Doug, I knew that FAE checker is agree with the #8. But Chyntiasays (WCAG 1.0) and ATRC (WCAG 2.0 AA) checker do not complain about it.
Since you're using WordPress, may I ask you to add some kind of subscribe-to-comment plugin?
I've turned the subscribe to comments back on, sorry about that. Turned it off when I upgraded the last time. Conflicted with something. Seems OK now.
I've added the citation for number 8. While this isn't required by WCAG 2.0, I classify it under 2.4.6 Headings and Labels: Headings and labels describe topic or purpose. (Level AA). It is identified by the "accessibility issues" check in the Firefox accessibility toolbar.
Great list... I believe my blog complies with all these, but would double check! Thanks.
Post new comment