Chapter 5
However, Figure 5-8 shows the same site as it appears in Lynx, a text-only web browser that displays the
image file name when the alt attribute is missing. Without alt attributes for the images, the site’s
navigation is practically useless. Visually impaired people using screen readers, people using mobile
devices with less capable browsers, and even people with limited connections who turn off images to
spare their bandwidth—they’re all out of luck. The file names don’t even provide any clues in this example,
and far too many websites are built like this. It’s downright shameful.
Figure 5-8. Images without alt attributes, as seen in Lynx
The only situation in which you may validly omit the alt attribute is when you don’t know the image’s
content. For instance, you may leave out alt attributes on a web site that allows users to upload images,
where you as the host would have no way to describe its content. Even then, alt can only be omitted if
certain other conditions are met: if a non-empty title attribute is present (and its value should at least be
descriptive of the image’s purpose if it can’t describe the image itself) or if the image is a child of a figure
element that also contains a figcaption but no other content or images (so the figcaption can
describe only the one image it shares space with).
An automatic markup validator might not flag missing alt attributes as errors under these circumstances,
but remember: validators can’t read. Just because your markup might be technically valid doesn’t mean
your content is appropriately marked up. A title attribute or figcaption isn’t really a substitute for
accurate, meaningful alt text, even if the validator lets it slide. An img element almost always requires an
alt attribute. In those very rare cases where alt is optional, it’s a safer bet to include it with an empty
value (alt="").
For much more on writing proper alt text, as well as many different examples of usage,
see the HTML5 spec at w3.org/TR/html5/embedded-content-1.html#alt