Can everyone read your Web page?
I don’t just mean that fact that you’re using dark blue text on a black background either (lousy color choice). I mean all people, even those who are using disabled browsers.
I’ve known for a while that people who are using disabled browsers need everything on a Web page to have a text equal. Depending on the person’s disability, the special browser will read the text to them, or create the text in Braille, or somehow relate the information to the user. I had a few tips to tell people, but now it’s been laid down for all the world to seeand hopefully use.
On May 5th, 1999, the World Wide Web Consortium (W3C) came out with their “Checklist of Checkpoints for Web Content Accessibility Guidelines v1.0” (Guidelines). You can travel to see the page yourself by going to:
http://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505/
The Guidelines are the consortium’s help page to Web developers to offer tips on how to make your pages more accessible to a disabled assistant browser. I’ve read the page a couple of times and it all looks pretty straight forward and easy to follow. If you write your HTML is a traditional manner, you’re a big part of the way there.
The W3C break the tips down into three priorities, 1, 2, and 3. Priority 1 items must be done in order for your page to be read by disabled assistant browsers (The W3C refers to the browsers as “User Agents”). Priority 2 items should be done, and Priority 3 items may be done.
Let me hit some of the high points for you. Then you can go and read the page for yourself. It’s a little dry, but it’s a great source of information.
From my reading of the document, I took away two major rules of thumb:
- Absolutely every image, movie, icon, or any other non-text element on the page must have a text equivalent. The easiest method is to always offer an ALT command. Like so:
<IMG SRC=”image.src” ALT=”Image of my father”>See https://www.htmlgoodies.com/tutorials/web_graphics/article.php/3479921 for more on the ALT command.
Image maps not only require the ALT command, but also require that you offer text links in addition to the map itself. Movies should offer audio tracks or the text right on the page so that the text can be read. The simplest method is to offer a second page that has the movie’s element. The user can go to the page to get the information.
- The second rule was to write your HTML code is a traditional fashion. That means tags in capital letters and attributes lower-case and in double quotes. Again, Like so:
<FONT SIZE=”+3″>Hello There</FONT>
Yes, I know that the double quotes aren’t needed and that HTML is not case sensitive. But remember that I’m talking about getting your pages to the point where the disabled assistant browser will have the best shot at reading them for someone else.
Here are a few other very good Priority 1 tips. Remember, Priority 1 tips are those that must be done to ensure your page can be read by a disabled assistant browser.
- Do not make color such a part of the page that without the color the page loses meaning.
- Avoid causing screen flickering or blinking.
- If style sheets are used, use the style sheet command right on the page rather than using an external CSS page.
(See https://www.htmlgoodies.com/beyond/css/index.php) - Use a client-side image map rather than server side.
(See https://www.htmlgoodies.com//tutorials/image_maps/article.php/3479741) - Give all frame and source pages a title.
- Table rows and columns should be given titles.
(See https://www.htmlgoodies.com/tutorials/html_401/article.php/3479671) - Many disabled assistant browsers will not work with applets or scripts so make sure that your page use useable if the scripts and applets do not come into play.
- Write with the simplest coding possible.
Those are all good tips. In fact they’re good tips for whomever you’re writing for, especially that “no blinking” thing.
Priority 2 Tips are those that you should try to include in your page. Here is a sampling. There are many more than this:
- Make sure your background and foreground colors differ so that people with poor eyesight can make out your text and are not inhibited by a clash in color.
- Use the HTML tags to get an effect before you use a Style Sheet or script equal.
- Use relative rather than absolute positions for your page’s elements.
- Do not use auto-refreshing pages. Most disabled assistant browsers do not support the scripts that perform the refresh.
- Avoid pop up windows as many disabled assistant browsers disallow the user to shut the window.
- Clearly identify what each link points at.
- Make your navigation consistent. Use all active images or all textthat kind of thing. (That means across pages, not just page to page)
- Layout should be done with Style Sheets rather than tables. If you use tables, provide a version of your page for the users.
Priority 3 tips are those that you may want to do although they are not generally required. Again, there are many more than this. I just thought these were very good tips across the board.
- Identify the natural language of the document in a META or a commented out line.
- Use Style Sheets to get links to highlight so that visually impaired persons can quickly realize the link.
- Group related links.
The W3C has offered all of their Priority 1, 2 and 3 tips in a printable checklist at:
http://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505/full-checklist.html.
You can use it to roll down though your pages and test your work against the checklist.
So there you have it, some basic tips to make your Web page accessible to everyone who stops by. If you’ve been writing in good HTML form, you’ve probably already created good, useable, pages.
Enjoy!
