Blank alt attributes

Roger Johansson has a published a short discussion of the alt and title attributes for images. One point he mentions that I think deserves emphasis is the importance of the blank alt attribute. When checking a page’s accessibility, many people attempt to add a descriptive alt attribute to every image on a page. This really isn’t necessary, and could in fact harm the accessibility of the page! On most sites, many of the images on the page exist for purely decorative purposes; the content would still make perfect sense if the images were removed. These images should have a blank alt attribute, to prevent their display in text or speech browsers.

A pleasant side-effect of moving to CSS based web design is that decorative images tend to end up as CSS background images, rather than inline images in the document. This is certainly the preferred approach, but if a decorative image needs to be included inline but makes no contribution to the underlying content its alt attribute should be left blank. My piece on Writing good ALT text has further tips on this, one of the trickier aspects of web accessibility.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://roderick.dk MRoderick

    Another nice benefit of using images as background images in CSS, is that they are not printed.

    So, if an image is part of the content in your document, it should be IN the document. If it is purely decoration, it should be in the CSS. Easy :)

  • http://www.gauss.info realestate

    I am interested to know if it is possible to put an image on a website which can’t be downloaded or printed. I would appreciate no script solutions.

  • http://jrickards.ca jrickards

    I am interested to know if it is possible to put an image on a website which can’t be downloaded or printed. I would appreciate no script solutions.

    Simply by viewing it in your browser, you have downloaded the image. However, if it is a background image, it may be more difficult for a user to save in that they may have to root through their cache to find it but it will exist there.

  • Redivider

    Not possible. For anyone to see your website it has to be downloaded first so everything is already on the users computer, if only in a temporary folder.

    You can make it more difficult to do, but you’ll never be able to completely protect against someone saving/printing your images.

    If an image appears on the screen at all, the user can just take a screen shot of it and bypass any protection you’re trying to implement.

  • A. White

    I concur – not possible. Even wrapping it in Flash is no guarantee (Flash can be cracked); the “screengrab problem” is likely insurmountable.

  • http://www.lunadesign.org awasson

    Brilliant piece of information about alt tags & accessibility.

    If it

  • Refrozen

    Ahh, but watermarking your images will prevent direct theft. IN MOST CASES :P

  • Joe Clark

    The term you should be using is “empty” alt attribute. “Blank” implies that you should be using a space character or some other abomination, which you should not.

  • Brian

    Go to webmastertools.com and download webmaster tool app. a script is included 4 that purpose

  • Dan

    I have been told by several visually impaired people that many screen readers choke on blank alt attributes, and they actually do better when the alt attribute is absent completely from image tags that are not significant to the page.