Why WCAG 2.0 Encourages Use of Images to Replace Text

By Richard | Published: May 28, 2010

Web Content Accessibility Guidelines 2.0

At level AA of WCAG 2.0 it has become much easier than WCAG 1.0 to justify the use of images instead of text (at level AAA they are prohibited though).  The following is quoted from the WCAG 2.0 Quick Reference :

Images of Text:

1.4.5 If the technologies being used can achieve the visual presentation, text is used to convey information rather than images of text except for the following: (Level AA)Understanding Success Criterion 1.4.5

  • Customizable: The image of text can be visually customized to the user’s requirements;
  • Essential: A particular presentation of text is essential to the information being conveyed.

Note: Logotypes (text that is part of a logo or brand name) are considered essential.

It sounds like there are only a few exceptional circumstances where images of text are allowed, sensibly including logotypes. Actually, the guidelines do become very liberal here though and the word essential can mean almost anything you like, including circumstances where a font the developer wants to use isn’t available. Whilst that is good from a freedom of design expression point of view, it does mean that anything outside the dozen or so fonts that are generally available on most operating systems is allowed to be used by replacing text with an image of text. It could be justified because the developer doesn’t have permission to use the font other than within images (perhaps an antisocial behaviour order (ASBO in the UK) prevents them!). Then to top it all, a developer can use text within an image if they aren’t sure that browsers will antialias the font correctly.

Difficulties in Accessibility Testing

In terms of accessibility testing, the only time I can fail a page against this checkpoint is if I can be reasonably sure that an image contains text using a standard widely available system font (very difficult to prove objectively).

The checkpoint seems to have become so watered down (possibly as a result of the length og time it took for WCAG 2.0 to be agreed) that it doesn’t seem worth having it at all (not at level AA anyway).

Please Comment

  • Is this so important in the grand scheme of things?
  • Are images of text fine so long as there are text equivalents?
  • What do you think?

Please comment here and keep the conversation going.

Posted in Accessibility | Tagged | 6 Comments

Guerilla Web Accessibility

By Richard | Published: January 8, 2010

There is a vast amount of information and advice available about web accessibility, and it can be overwhelming so this is my take on the essentials that you need to know. This is only an introduction and not meant to be comprehensive.

What is Web Accessibility

In a nutshell it is a means of making websites available and usable by people across a range of disabilities including:

  • Visual impairment and blindness
  • Hearing impairment and deafness
  • Learning difficulties
  • Cognitive (process of thought) difficulties
  • Physical difficulties e.g. inability to use a mouse
  • Photosensitive epilepsy

At first sight some of these may appear insurmountable e.g. how does a blind person read a website? Some of them do conflict, for example the right colour combinations for someone with a form of colour blindness could make a website inaccessible to someone with a form of dyslexia. There are no perfect answers but the fact is that the web as a whole is woefully inaccessible and with not too much work could be vastly improved.

How Can a Website be Made Accessible

The first thing I would say is that as with most things in life, the earlier accessibility is considered in the design of a website, the easier it is to include. Accessibility can be successfully bolted on afterwards but this usually involves more work (and thus cost) and doesn’t necessarily lead to an ongoing culture of accessibility (e.g. for content managed sites, much of the accessibility is down to how individual authors and editors use the content management system).
The simplest and most effective things you can do to ensure that a website is as accessible as possible are:

  • Ensure that anything which isn’t text has a text equivalent (e.g. an image of a Company brochure page should be accompanied by text reflecting the contents of that image).
  • Any video or audio needs to have alternatives e.g. transcriptions, captions
  • Anything that you can do on the site with a mouse should also be achievable just using a keyboard
  • Don’t use small text or badly contrasting text/background combinations
  • Avoid anything that blinks or flashes rapidly
  • Keep the number of links on a page to a sensible amount (including navigation links)
  • Structure pages properly with headings, lists etc. (this also helps with Search Engine Optimisation)

Further Reading

As mentioned in the introduction there is a great deal of information available. I would recommend the official Web Content Accessibility Guidelines (WCAG 2.0) as a good starting point.

Please Comment

Please add your comments to this post, tell me things I have missed, ask me for more detail, give me your views.

Posted in Accessibility | 4 Comments

Can You Drive if You are Blind? What about Reading a Website?

By Richard | Published: December 17, 2009

You can drive if you are blind, although your ability to drive safely will vary depending on a number of factors including whether you have any assistance (and bearing in mind that dogs no longer need a licence in the UK). You can even do so legally if not on a public road (in the UK at least). Living in Birmingham, I recall an incident a few years back when a completely blind guy was caught speeding on a public road with a passenger shouting driving instructions to him. The funny part was that he was then banned from driving for some years and had to take an extended driving test.

The second question is more sensible, although it never ceases to amaze me that the majority of people assume that a blind person would have no means of reading a web page.

What if You Can’t See the Page?

Braille displays are available and used but the vast majority of blind web users read web pages by listening to them. Modern operating systems include voice synthesis software to allow text on a screen to be read out but this software is usually somewhat limited and isn’t particularly suitable for the content and structure of web pages. Screenreader software such as JAWS, Window-Eyes or NVDA are more commonly used as they provide a means of skimming through content and links and support more of the user interface components of the web (for example forms).

Web pages need to be well structured to allow effective reading by screenreader software. The most important things to consider are:

  1. Any text contained within an image is not accessible to the screenreader
  2. Too many links on a page can make navigation and orientation very difficult
  3. The visual appearance of text e.g. colour, font-size, bold, italic, position, is not accessible through screenreader software

Some Simple Tips

All is not lost though, some simple techniques can fix these issues:

  1. Text within an image can be described using the alt attribute (or longdesc if the description is more detailed than a short phrase or sentence). If the text is repeated elsewhere on the page then it doesn’t even need to be directly associated with the image. In the case of a more complex image (for example a graph), it may be more appropriate to use table markup to give the right semantic structure to the information.
  2. Too many links is too many links, but providing they are grouped logically, and have meaningful text, and have skip links at the beginning of groups to allow quick navigation, they can be much more accessible.
  3. Visual appearance should be separate from semantic structure. If a piece of text is meant to be a heading then it should be marked up with the appropriate level of HTML heading. If a particular word needs emphasising then the HTML emphasis or strong tags should be used. If the colour of some text is important (for example in the key to a graph), then the link between the colour and its meaning has to be conveyed in another way too (in this case perhaps through the graph data being within an HTML data table).

Trivia

Did you know that the Driver Vehicle Licensing Agency can supply a braille version of the driving licence application form. Good to know that public money is being spent wisely.

Posted in Accessibility | 3 Comments