Day 84 of 100DaysOfSpec, alt text for images, contd.

I am reading and taking notes on the HTML specifications for 100 days as part of #The100DayProject. Read the initial intent/backstory. I am a Microsoft employee but all opinions, comments, etc on this site are my own. I do not speak on behalf of my employer, and thus no comments should be taken as representative of Microsoft's official opinion of the spec. Subsections not listed below were read without comment.

Currently reading 4.7.1.1 Requirements for providing text to act as an alternative for images

4.7.1.1.9 A purely decorative image that doesn't add any information

I actually looked this up today. For images that are purely decorative, use an empty alt attribute (alt=“”) on the img element. The spec encourages authors to try to include these images using CSS instead of through the markup, I think there are situations to demand use of the img tag instead.

4.7.1.1.10 Inline images

“When images are used inline as part of the flow of text in a sentence, provide a word or phrase as a text alternative which makes sense in the context of the sentence it is apart of.”

Section. Over.

4.7.1.1.11 A group of images that form a single larger picture with no links

I’m just thinking right now that the people who put together this spec are really covering their bases. This whole section is a pretty awesome cheatsheet when you’re unsure of how to proceed w/ a particular alt attribute.

In this case of a group of images that create a whole, you would put descriptive text on ONE of the images, and then set the others to an empty alt attribute (alt=“”).

4.7.1.1.12 Image maps

If the image meets certain criteria such that it can be considered an image map, you HAVE to add meaningful alt attributes, as it’s interactive content and needs to be accessible. You’d add said alt attributes to the img elements itself, and to the area elements nested inside the map element associated with the image.

4.7.1.1.13 A group of images that form a single larger picture with links

In this case, each linked img within the composite whole needs an alt attribute.

4.7.1.1.14 Images of Pictures

They’re referring here to photos, paintings, drawings, artwork, illustrations, etc. that “can convey a significant amount of information visually or provide a specific sensory experience, to a sighted person”.

In these cases, you would write a brief description, a task in which “best judgement” is needed. I still think a good test would be to read the alt text and surrounding text out loud to someone (keeping in mind that a screen reader would typically announce presence of an image before or after the alt text).

4.7.1.1.15 Webcam images

“Webcam images are static images that are automatically updated periodically.” Puppy cam!

The idea with these is that the vantage point of the camera is pretty fixed. The alt text is the title and time stamp (preferred to be in surrounding text, but alas…?), and there would be a caption for the photo via the figure and figcaption elements. The way this section is written is a little confusing because it’s hard to tell what the spec authors are advising and what they are saying gets returned by your typical webcam program.