lecture 6: handout

summary of key accessibility and usability techniques

These are all described in more detail in the virtual lecture, the online teaching materials and the other resource pages noted later in this handout. But, briefly, here are some ways you can help make your pages as accessible and usable as possible to almost any user of the WWW.

• write well-formed, valid code. Use a code validator to help you with this.
• use tags correctly. Don't fake a heading with a <p> tag, for instance: use heading tags. Also use structural tags properly: these also help with code validation, as well as making it more likely that search engines will find your page.
• use alt attributes on every image, but leave the value empty (alt=" ") if the image is purely decorative. Check how your pages look when images are not loaded (this is particularly easy in Opera - just click on the little "camera" to the bottom left of the tool bars).
• check that information is still being presented in a logical order when tables are linearised.
• in memory terms, keep pages and images as small as you can. If you must use a very large image, do not make it compulsory to load; give a warning first and/or use thumbnails.
• keep a consistent layout on all pages of your site. Don't force visitors to hunt around for important links.
• consider using shortcuts such as accesskeys and "skip navigation" links to help keyboard-only browsers.
• make sure the text between <a> tags is meaningful when read out of context (e.g., separate from the text which surrounds it). If this is difficult, use the title attribute.
• have a link back to the home page on every page of your site (and remember the convention is to assign this to the accesskey="1").
• don't disable the user's ability to resize text. Define all font sizes in relative rather than absolute terms.
• keep a good contrast between text and background at all times. Make sure links are clearly distinguishable from the text. Always avoid red/green combinations.
• don't underline text which is not a link.

some keyboard shortcuts

Trying keyboard-only browsing out for yourself is a useful experiment. It can help demonstrate some of the "hidden" accessibility problems of which you may otherwise remain unaware. It's also kinder on your wrists!

In Internet Explorer there are not that many shortcuts, but here are some useful ones:

• Use Tab to cycle around between "clickable" objects on the page - which on your own pages will, at this stage, just include links, but which may eventually come to include forms (and you may encounter these on other pages, of course). Once you have "focussed" on the correct link, press Return to access it. Shift+Tab takes you "backwards".
• Ctrl+N opens a new window.
• Alt+Backspace or Alt+Left Arrow activates the "Back" button. Alt+Right Arrow activates the "Next" button.
• Ctrl+F5 reloads the current page.
• Down Arrow, Up Arrow, Page Up, Page Down, Home and End work pretty much as they do in Word, allowing you to move up or down through a document in progressively larger "leaps".

Opera has literally dozens of keyboard shortcuts, some of them very powerful. In Opera press Ctrl+B for a complete list. Or, see http://www.opera.com/support/tutorials/nomouse/.

sources of help on accessibility and usability

This is an increasingly important issue in web design. New legislation makes it imperative that web designers find out how to make their pages accessible, and increased online competition forces them to think about usability as well. It is no longer an optional extra!

You might find some or all of the following pages useful:

• The University's own guidelines are at http://campusweb.leeds.ac.uk/guidelines/accessibility/index.htm. This is quite a good little page. I particularly recommend its own "resources" link.
• See Dive Into Accessibility at http://diveintoaccessibility.org/.
• An online accessiblity checker can be found at http://www.techdis.ac.uk/usablenet/.
• The usual reference for web usability is Jakob Neilsen but I do not rate his advice (or his web site) as highly as some. However he's a hard name to ignore totally, as proved by the number of references to him in other works on usability. A lot of links are available at http://www.usableweb.com/. Or, try http://www.usabilityfirst.com/ for a more "Nielsen-free" experience.