An image earns its place when it contributes to the story. It may show a detail, establish a mood, or give an abstract idea a tangible point of reference.
Alternative text describes relevant visual information for people who do not see the image. Decorative images can be treated differently from those that carry meaning.
Consider delivery as well as composition. A carefully chosen size and format can preserve the useful detail without asking every reader to download more than the page needs.
- Name what the image contributes.
- Describe its relevant content.
- Use a size suited to its place on the page.
Try the idea in context.
Imagine removing an illustration from a guide. The information that disappears helps you decide what its text alternative needs to describe.
A thought for the next read.
Treat the words around an interaction as part of the interaction. A clear label can answer a question that another visual flourish would leave open.
Follow a related question
Connect the permission to an app feature.
Permissions should have a purposeKeep labels visible during entry.
A form explains why it asksKeep learning
Related background to continue exploring this subject.
MDN: learn web development MDN: how the web works
