PDA

View Full Version : An introduction to Coding Practices for WAI Accessibility


JamieLewis
March 14 '05, 03:16 PM
Coding Practices For WAI Validity

As many of you may know WAI is the accessibility standerd laid down by the W3C. The guidlines are made up of three Priorities. If you want your site to be available to everyone then it is important you at least comply with prioriy one.

This tutorial will cover all three priorities and how to incoperate them into your site.

Basic Practices

In order to comply with Priority 1 the following guidlines mus be met. Most of these are common sense and you will find most sites only fall short on one or two points.

Always use the Alt attribute when using the IMG tags

Dont use Marquee or Blinking text

Make sure the document can still be read without a style sheet

Provide text links when using image maps
Dont use tables for layout - only use them to convey data ia table format

Title each frame to facilitate frame identification and navigation.

Ensure that pages are still usable if all appletes/scripts etc are turned off

If, after best efforts, you cannot create an accessible page, provide a link to an alternative page that uses W3C technologies, is accessible, has equivalent information (or functionality), and is updated as often as the inaccessible (original) page.

These are the basic guidlines your site should follow if you wish it to be accessible to the majoirty of uses.

Onto Priority Two

Priority two focusses on the interoperability of the web page(How well it can be transfered from one browser to another) The majoiry of the guidlines invovle good web programming practices. If you already code your sites the the XHTML 1.1 standered, you will find your site complies with most guidlines.

A few things to note are:

1)Labels must be used to designate form fields. I find thatmost people tend to code forms like this:

Name<input type="text" name="name" />

You must use labels like this:

<label for="name">Name:</label><input type="text" name="name" />

2)Ensure background and Foreground colors contrast - this is for obvious reasons.

Onto Priority Three

Priority three expands on priority two and again most of it is about proper use of mark up.

A few things to note are:

You must identify the natural language of the document
e.g <html xml:lang="english">

You must have a breaker between adjacent links. This one is the most difficult to grasp. All adjacent links must be broken up by an image or list seperators. Paragraph tags will not work.e.g
<li><a href="link">link</a></li><li><a href="link2">link</a></li>

Place holders must be used in otherwise empty input boxes.


Rounding off

Ok, that completes my introduction to the WAI web standered this should be enough to get you started.

Validating

It is always important to use a validator to check the main points of your code. Remember to also check things validators cant.

http://bobby.watchfire.com A great validator to check your sites. Also gives a list of things for users to check independantly.

Hope this helps

Jamie