- Where's the Logic?
- Purposeful Web Page Construction
- Alternative Text Descriptions
- Summary
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Alternative Text Descriptions
One of the easiest elements to fix for accessibility is the addition of an alternative text description for images, also known as the ALT tag in HTML. A screen reader cannot interpret graphics at all. This makes for a frustrating Web surfing experience, especially when graphics are used as click-able links rather then hypertext links for navigation. You can only imagine what it must be like to navigate when you can't understand where you are going!
The mark up for a graphic without an alternative text description looks like this:
<IMC SRC="marsrock.gif">
The markup for the same graphic with an alternative text description looks like this:
<IMC SRC="marsrock.gif" ALT="Image of rocks on the planet Mars">
Sometimes, graphics are used for decoration only or to provide spacing in-between elements. In this case, you can use the ALT tag with no description just to be courteous:
<IMC SRC="spacer.gif" ALT="">
It's a good rule of thumb to use a description that has meaning, rather then keywords or phrases. The ALT description is read out loud by a screen reader, but it's also viewed by sighted users while hovering the mouse over the graphic (see Figure 2) or if browser graphics are turned off.
){kind=link}
Figure 2 Alternative text descriptions in graphics are also viewed onscreen.
You get another bonus when using ALT text descriptions! Some search engines, such as Google and AltaVista, consider ALT descriptions for ranking purposes. In this case, ALT tags help improve your Web site's rank in search engines.
What more can you ask for? Improved accessibility and search engine rank improvement all spun into one little tag: ALT.