I would like to reduce the number of HTTP requests in this website I'm building, and sprites would be a simple way to do that; however, for semantic reasons some of the imagery should remain in the foreground. Assume for the sake of this question that I have a perfectly functional way to sprite a foreground image.So what should my alt tags look like? Here's one thought I had:<img src=mysprite.png alt=Product photographs of all the frobnobs we offer, organized by gauge>but does that really provide accessibility to the visually impaired, given that the image would only be showing one frobnob at a time?
Foreground sprites and the alt tag
accessibility;sprite
That would not be accessible, and would actually be kind of useless.Your alt text(there's no such thing as alt tags) should describe what that particular image tag is actually presenting. Let's say your sprite has a bunch of animal icons in it.When you use it to show the sprite chunk with a cat in it, your image tag should be:<img src=animals.png alt=Cat icon />And when you use it to show the dog it should be: <img src=animals.png alt=Dog icon />The alt text is intended to be a replacement for the visual content if it doesn't load, or isn't visible to the user. Sprites are a bit of an oddity(read: cheat), so it might help to think of it as needing to replace the current use of the image tag. In contrast, what you're doing in your question is describing the image file, even though you're not always showing the entire thing. Sprites are a collection of images, and when you use them, the alt should match the bit you're actually using.