CSS & Round Corners: Making Accessible Menu Tabs

By Trenton Moss
2004-06-27


CSS & Round Corners - The problem
One of the best websites out there, in terms of functionality, is, and always has been, Amazon. In terms of accessibility though, they're not too good.

Amazon's menu tabs, for example, look really nice but are totally inaccessible. First of all, they're missing ALT tags. Additionally, the W3Cs accessibility guideline 3.1 (priority 2) clearly states:

When an appropriate markup language exists, use markup rather than images to convey information.

This basically means don't use images to display text - site users with poor vision are unable to resize text that's displayed through images. Find out how to resize text in your browser, if you don't already know.

Tutorial Pages:
» CSS & Round Corners - The problem
» The solution
» Adding the left corner
» And the right corner
» The final touch

Related Tutorials: » Planning Your Stylesheet - The Definitive Guide » CSS Shorthand Properties » Print Stylesheet - The Definitive Guide » Using CSS Selectors to Highlight Unedited Form Fields » An Introduction to CSS » Overlapping tabbed navigation in CSS