WebAIM - Web Accessibility In Mind

E-mail List Archives

Pure CSS icons and accessibility

for

From: Iza Bartosiewicz
Date: May 17, 2010 9:57PM

Greetings,

I was reading Zander Martineau's post about his experiment with pure CSS icons. It is interesting to see what can be created with the CSS alone, although at this stage it seems like a lot of effort just to create image replacements, which may not work as expected in some browsers or devices.

On the positive side, these icons scale well; however, the linked examples from Zander's demo may not be accessible to JAWS. Each link contains a bunch of spans and no link text, so to make this work would require a link text to be positioned off-screen. This, on the other hand, may affect keyboard accessibility...

What are your thoughts on the pros and cons of this technique?

Article: http://rathersplendid.net/home/pure-css-icons
Demo: http://rathersplendid.net/cssicons/

cheers
Iza

--

----
Izabella Bartosiewicz
Web Coordinator
RMIT University Library

03 9925 3103
<EMAIL REMOVED>
www.rmit.edu.au/library
www.linkedin.com/in/izabartosiewicz
twitter.com/mr0wka18 ( http://www.twitter.com/mr0wka18 )

Save a tree... Don't print this email unless you have to...