Lessons · HTML and CSS · what the image is for here
What the image is for here
Alt text says what the image is FOR in this place: the information somebody would miss without it.
Hone is a place to practise programming. This is one of its lessons, written out in full and free to read without an account.
What it is for
The same photograph needs different alt text in a news story and in a shop, because it is doing a different job.
How to think about it
Ask what job it is doing here and write that. On a shop page the buyer needs colour, kind and view, because those are what they are choosing between.
Worked example
<img src="kettle.jpg" alt="Blue enamel kettle, seen from the side">The browser reads back exactly what you wrote -- so what you wrote is the whole of what anybody gets.
<img src="logo.svg" alt="Acme home">An image that is a link on its own: the alt becomes the LINK's name, so it describes where the link goes, not the logo's shape.
Your turn
Alt text describes what the image is
here
Write a page and watch it render
The trap
Empty alt on an image that is the only content of a link leaves a link announced as nothing at all, which is the worst case of the three.
Practise what the image is for here on HoneA question on it now, a coding challenge where there is one, and it is remembered for review. Free, no email needed.