This tip is especially appropriate for news sites, considering lists of headlines are the bread and butter of most of their home pages.
To see the hard-coded images in action, check out the News Break section on the right side of ajc.com's home page -- each of those red arrows is a separate image. Same goes for CJOnline's home page, but in its case the arrows are double arrows, and they're blue. Neither site has an ALT attribute set for the arrow images, which means people using a text-only browser will see [redarrow] each time that image is used on ajc.com, and [blue_double_arrow] for every instance on CJOnline.
Of course, I don't mean to pick on these two sites in particular. After browsing for a few more minutes, I found many more examples:
- The Tampa Tribune (blue triangles)
- Newsday (red blobs)
- The Detroit News (red triangles)
- The Boston Globe (maroon triangles)
- The Boston Herald (somewhat three-dimensional blue balls)
- The Christian Science Monitor (a golden arrow)
I also noticed some sites use normal text bullets but go out of the way to style them in a different color or font. This is fine and dandy from an accessibility standpoint (text bullets should show up as text bullets regardless of your browser environment, as long as nothing funky happens with character sets), but I think it's wasteful -- and downright silly -- to do this. Here are some culprits:
- The Washington Post (bullets in red Arial vs. text in blue MS Sans Serif)
- The RealCities sites, e.g. San Jose Mercury News (arrows in orange vs. text in blue)
- The Village Voice (orange bullets vs. black text)
For all these sites, OL and UL tags would simplify the lists tenfold -- they'd be easier to maintain, the pages would be lighter (assuming stylesheets were used), and in some cases they'd be more accessible. News sites have got to clean up their flab.