I’ve been noticing some common practices across sites which are reducing the general accessability of the webpages served. Below is a list I have been making that might be useful to you in making your pages more accessable.

On Using Forms

  • Required fields are often marked with a little star, or asterisk. JAWS (one of the most common screenreaders) reads the asterisks as the word ’star’. A lot of JAWS users will not grasp that this means ‘required field’.
    In addition, if you must use an asterisk, or other short character string to mark things, don’t wrap them in parentheses - screen readers will read out, eg “left paren star right paren”, which is difficult to interpret.
    An alternative idea to marking required fields is to divide fields in two, required and not required fields, and wrap them in separate fieldsets. Include a legend on one fieldset of ‘required’ and you’re done. The extra bonus here is that most screen readers will read the fieldset label before each field, so you automagically get a ‘required’ label on each field, without compromising the display. (Do make sure you put the legend on the right fieldset! ;))
  • When a form fails validation, ensure that the first part of the content indicates that there was an error. Ideally it will also specify which fields need correction. Detailled error messages on the error per field should, once again, occur *before* the field in markup order, as part of the label is ideal.
  • Some fields have extra information on what should be entered in them *after* the field. Its great to offer the extra information, but people who use a screen reader will generally read the info *after* they have entered that field, if it occurs after the field in the markup order. Derek Featherstone has a great tutorial on how to display information after the field for visual display while having it before the field in markup order - go read it!

Other Issues

Its important to have an attractive page, but some of the details can make or break the accessability of the page, meaning fewer people can use your page.
Justified text can be harder to read for some groups of people, such as those with dyslexia. Variable word spacing tends to exacerbate problems such as eye skipping between lines, so use left justification where possible to simplify this.

Whats your favourite accessibility bugbear?