Heal Your Church WebSite

Teaching, rebuking, correcting & training in righteous web design.

CSS and round corners: Making accessible menu tabs

“One of the best websites out there, in terms of functionality, is, Amazon1. In terms of accessibility though, it’s not too great … Amazon’s menu tabs with their nice round corners, for example, look really nice but are rather inaccessible …” – Webcredible, August 2004

Yeah, okay, so I realize the quoted article is a bit dated – but their CSS for rendering rounded tab menus isn’t.

Short and sweet today kiddies – but don’t let my brevity fool’ya, this article is chock-full of simple code to take a simple unordered list and render as an Amazon.com like rounded menu tab …

… only that is more accessible, and works on just about every browser I’ve run it against … and we’re talking some oldy moldies such as IE 5.2 on the Mac and NetScrape 4.7 on Windows 2000!

Read the article, then realize the joy you too can enjoy with data-driven tab menus that instead of representing text with images that are less accessible and require fabrication, display text with text that both your favorite readers and your favorite search engines can both consume in their own yummy flavors of HTML.

Comments are closed.