feb 16 2007

Styling alt tags

Would it be possible to style the alternative text that is displayed when an image does not load ( This is particularly useful for newsletters, as the default for most mail packages is to NOT display the images right away). My first reaction was: nah, this can’t be done. Second: uhm, let’s try. Third: well have you evah.

Turns out that by setting the text properties (style:text-align, color, font-size ..) of an image, which normally don’t have an effect as the thing IS an image, the alt-text of the image inherits these properties and thus shows up when the image doesn’t load.

That way in our latest vdab magezine-newsletter, we managed to style the head in such a way that the header still comes across well, and the decorative images are hidden ( color: white for those ones ). And that way, the mail still manages to look reasonably nice when opened at first. And it is super-accessible in the same go.

With images loaded: Without them:

Related, on the subject of alt-tags, read this accessibility blog entry: Should alt text be used to paint a thousand words?

Nog geen reacties tot nu toe. Reageer zelf...

Jouw reactie

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

En nu?

En, voor u het vergeet, steek zeker mijn mijn RSS in uw favoriete feedreader. Je kan je ook abonneren op updates via e-mail, facebook, twitter...