Basically, here is the simplest way to answer this question. "Is there meaningful and important alt text you can give the image, or is their something they'd miss out on without the image or alt text?". If the answer is yes, use images. If not, then use background images. Basically, background images are supposed to be purely -decoration-. If they are in any way, shape, or form content, use images.

Although, in your specific case, I would go with what Dave Woods said. If you really want those image check boxes, use normal check boxes, and then use Javascript to swap those out for your image ones. With that solution, if they don't have Javascript, normal check boxes appear (which are easy for screen readers and the like), and if you do have Javascript, you get your cute image check boxes. And, I'd say use normal images for those as well and use alt text like "checked, unchecked, disabled", however, that wouldn't work well with a screen reader.

Likely, James A. wrote:

Hello,

I am working on a new site for a client and need some thoughts on a problem that I have.

I am making a list with clickable boxes (like input boxes) that have a checked, disabled and clickable state. My question is, what would work best. Using background images or adding images to the code.

The reason I ask is

1) If I use images, we can add alt text to describe what function the images have. This would help with screen readers and people with disabilities.

2) Background images keep the code clean but wonder about the alt text and how screen readers and people with disabilities would read the site. Is there a way to imitate the alt for background images?

You can see an example of both ways at:

Using images: _http://wisconsin.joekiosk.com/list/list.html_
Using background images: _http://wisconsin.joekiosk.com/list/list2.html_

Let me know your thoughts and what you think would work best. I love the background images as the code is clean, but has any one done any testing to see how this would work for screen readers or do you have suggestions on how to make it more accessible?

Thanks for the help.

James


*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************


--

Christian Snodgrass
Azure Ronin Web Design
http://www.arwebdesign.net/ <http://www.arwebdesign.net>
Phone: 859.816.7955



*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************

Reply via email to