Quick fix accessibility
Posted in Accessibility on: Monday, June 9, 2008 by Paul Boag
Complying with accessibility guidelines can seem like a massive undertaking. However, addressing 5 simple problems can make a huge difference to your sites accessibility.
The Pareto principle (also known as the 80/20 rule) states that, for many events, 80% of the effects come from 20% of the causes. This is true for accessibility where a small number of issues cause the vast majority of problems. But what are these issues? That is a subjective question, but here are my top 5:
Poorly described images
By now you probably all know that images should have associated alt attributes, which describe them to visually impaired users and search engines. However, a related problem is the content of these alt attributes.
Many people have realized the benefit of alt attributes for search engine placement and so stuff them with keywords making them far too long.
All content images should have an alt attribute that clearly describes what is being shown in a concise manner.
Badly labelled links
It is not just images that are labelled badly. There are also problems with links. The text contained within a link should describe that link without context. This is because screen readers have the ability to read all links on a page as a single list. Users can then quickly navigate without listening to the entire page. However this is problematic because a link entitled ‘click here’ does not explain where it leads. A better link would read ‘click here for latest news’ or simply ‘latest news’. Where a longer description is required a title attribute can be added.
Descriptive links also help sighted users to quickly scan for the next page to visit.
No alternatives to media
It is not just images that need describing. When using video, audio or any form of media that requires a plugin (that some users may not have) it is necessary to provide an alternative version. This alternative should either be in the form of a transcript (in the case of audio) or captions (in the case of video or other media where visuals and audio are synced).
At first glance this seems a massive undertaking. However, there are a number of services like castingwords.com who provide transcription at a very reasonable rate. There are also tools like overstream.net, that help create captions.
Reliance on Javascript
Javascript is a programming language that can be used to achieve many of the interactions we see on websites. From popup windows to services like Google Maps, Javascript is amazingly flexible and heavily used.
Javascript is not inaccessible. In fact it was created by the W3C and sits alongside HTML (which provides the content) and CSS (which provides the design) as the language which provides behavior. The problem is not the technology but the implementation.
Not everybody has access to Javascript. Search engines in particular tend to ignore it. It is important that all content is accessible even when Javascript is turned off. The most common problem is using javascript to create navigation and other links. If Javascript is not available it is impossible to follow those links to the content beneath. Equally when Javascript is used to add content, this becomes inaccessible if Javascript is disabled.
The simple rule is to never rely solely on Javascript as a method of accessing content.
User controlled text
The final accessibility mistake I see regularly is text that cannot be resized. By default all major browsers allow users to set the size of text on a webpage. This is needed because website owners cannot predict users visual requirements. Most people with visual problems need to be able to increase font sizes. However, there are some visual impairments that require smaller text to fit within a limited field of view.
Although browsers provide this functionality by default, many web designers disable it. To be brutally honest there is no good reason for this beyond laziness. By fixing the font size the designer reduces the burden of testing but it provide no other tangible benefit. In short, ensure the fonts on your web site are scalable.
By addressing these five problems you will dramatically improve the accessibility of your website. None of these issues are particularly hard to overcome and the financial investment is minimal. However, by doing so you will increase the amount of traffic to your site and the number of visitors able to successfully navigate it.
3 Comments
Comments are for the discussion of this post. If you have other questions / comments then post them to the forum or send me an email
Great list Paul, and as you say these are not too hard to implement. One thing that I would like to see more of is clients asking for these things as part of their requirements, there is still a great lack of awareness.
In terms of images, it isn’t always clear cut whether an image is informational or decorative. For example a photograph on a web page could contain important information within it or it could just be a nice picture. If it is the latter would describing it add value to a visually impaired or blind person accessing the site through a screen reader? It might do in some contexts for example a photography gallery.
I don’t think that a title attribute would help for links as although screen reader software can be setup to access it, most users don’t so would miss that information. The other important point about links is that the text needs to be different for different target pages. Often on complex site testing I see multiple “help” links for example that are specific to different parts of the page, so visually it is obvious what the context is but read out in a list it becomes fairly useless.
Hope this adds to your discussion. I’ve only recently started listening to the Podcasts (which are great by the way, and much more engaging than some of the other web podcasts I have heard), and I am slowly going through them backwards which is an interesting experience.
Richard Morton
Hi! I’ve been listening to you podcast (which is great, btw) for quite a while now but forgot that you also have a blog!
Shouldn’t “add proper labels for form elements” be in your list? I’m not an accessibility expert (yet) but I’ve heard in an interview with a blind web user, that this is a major barrier for screen reader users, since almost every web site uses forms at some point.
Keep up with the good work!
Helpful post…
Regards,
SBL Legal Transcription services