| Ensuring your website is accessible isn't as | | | | pixels (px) or (pt) instead use relative |
| hard as you would imagine. There are a number | | | | length units such as percent or (em) or use |
| of steps that can be taken to make a website | | | | absolute size ([ xx-small | x-small | small | |
| accessible. | | | | medium | large | x-large | xx-large ]) or |
| | | | relative size ([ larger | smaller ]) when |
| | | | defining the font size for a particular |
| | | | element within your web pages. |
| 1. Page organisation. Use headings, lists, | | | | |
| and consistent structure. Use CSS for | | | | 5. Accessible navigation. Build your website |
| layout and style where possible. Use | | | | so that the pages can be accessed using only |
| structural semantic markup to aid | | | | a keyboard. Features such as ACCESSKEY and |
| navigation rather than for presentation | | | | TABINDEX can make your pages easier to |
| effect this will help visitors with | | | | navigate. Ensure that the accesskeys you |
| specialised software to understand the | | | | choose don't clash with keystroke |
| organisation of the page and to navigate | | | | combinations which have already been reserved |
| through it. Reduce information overload by | | | | by other applications. Skip links which |
| simplifying text and by ensuring a | | | | bypass content and go to main navigation |
| simplified, consistent design throughout the | | | | areas can also be helpful. |
| site. | | | | |
| | | | 6. Use high contrast colours for text. Use |
| 2. Use valid code. Make sure HTML code is | | | | dark text on light backgrounds. For most |
| validated against W3C standards. Not only | | | | people, this increases site readability. |
| does valid code make it easier for assistive | | | | Also, consider that 10% of men are colour |
| technologies such as screen readers to | | | | blind so red/green or blue/yellow |
| 'understand' your web pages, but browsers | | | | combinations can potentially cause a problem. |
| and browsing technologies tend to prefer it | | | | |
| too! | | | | 7. Ensure links make sense out of context. |
| | | | Blind people often skip through the links on |
| 3. Write meaningful ALT text. Label ALL | | | | a web page. This makes it vital that links |
| images with ALT (alternative) tags; without | | | | make sense out of context. 'Click here for |
| ALT tags a website might be virtually | | | | more information on our latest holiday |
| unusable for a blind visitor. This also | | | | offers' is a lot more useful to a blind web |
| applies to all multimedia including audio, | | | | user than 'Click here' or 'Find out more'. |
| videos, applets, etc where captioning and | | | | |
| transcripts should be provided. | | | | 8. Make forms accessible. All form fields |
| | | | should have 'prompt' text associated |
| 4. Make text scalable. Partially-sighted | | | | explicitly with them. These are called |
| people need to be able to resize text. | | | | label tags. A web user can then click their |
| Internet Explorer doesn't allow the | | | | mouse or pointing device on this prompt text |
| resizing of text if font-size is set in | | | | to move the cursor into that form field. |