How to write good alt text

Alternative text makes images accessible to people who cannot see them. Learn the rules, see real examples – and find out when an empty alt attribute is the right choice.

What alt text is for

Alt text (alternative text) is the textual equivalent of an image. It lives in the alt attribute of the img element, becomes visible when the image itself is unavailable – and audible when someone cannot see it.

• Screen readers: Blind and severely visually impaired people have web pages read aloud to them. Without alt text, all they hear is the file name or the word "graphic" – the information in the image is lost.
• Images disabled or not loaded: On slow connections, after loading errors, or with images switched off, the browser displays the alt text instead.
• SEO as a side effect: Search engines use alt text to understand image content. That is a welcome bonus – but not the purpose. Stuffing alt text with keywords hurts the very people it is meant for.

Alt text is also one of the oldest accessibility requirements: success criterion 1.1.1 "Non-text Content" sits at conformance level A – the lowest level of the WCAG. Missing alt text has nevertheless been among the most common errors on the web for years.

The ground rules

Function before description

Ask yourself first: what job does this image do right here? Good alt text conveys the information or function of the image – not every visible detail. A photo of the board in a press release needs names and occasion, not a description of tie colors.

Context decides

The same image can need completely different alt text depending on where it appears. A photo of an apple tree means one thing on a gardening blog ("Young Elstar apple tree with a support stake") and another on the team page of an orchard ("Our orchard near Hamburg during harvest"). Always write alt text for the specific page, never "in advance" for the image as such.

Length: short but complete

A proven rule of thumb is around 80 to 125 characters – one or two concise sentences. That is not a technical limit but a matter of listening comfort: screen readers announce alt text in one go, without the pause points of regular body text. Anything that needs to be longer belongs in a long description (see below).

No "image of …"

Screen readers already announce images as graphics. Phrases like "image of", "photo showing" or "graphic:" are therefore redundant. Exception: if the type of depiction itself matters ("oil painting", "X-ray", "screenshot"), it may go into the text.

Examples: good and bad

Decorative images: empty alt instead of none

Not every image carries information. Ornamental borders, background patterns, mood-setting stock photos with no substantive connection to the content – screen readers may skip all of these entirely. To make that happen, the image gets an empty alt attribute: alt="".

When in doubt, a simple test helps: would the page lose information if the image disappeared? If not, it is decorative.

Linked images: describe the destination

When an image is also a link, the job of the alt text changes: it must describe where the link leads or what it triggers – not what is visible. A linked company logo in the header therefore gets "Go to homepage" or the company name, not "logo with a blue wave". A thumbnail leading to an article carries the article title as its alt text. And if a text link with the same destination already sits right next to the image, the image inside the link may get alt="" so screen reader users do not hear the link twice.

Complex graphics and charts

Infographics, charts, organizational diagrams or maps cannot be captured in 125 characters. Here a two-step approach applies:

1. Short alt text with topic and key message: "Line chart: visitor numbers tripled between 2023 and 2026."
2. Long description with all relevant data – ideally as regular text directly below the graphic, as an expandable section, or as a data table. Everyone benefits from this, by the way, not just screen reader users.

Offering a chart's data as an HTML table is often the cleanest solution: tables can be navigated cell by cell with a screen reader, while a long read-aloud wall of text cannot.

Logos, icons and text in images

• Logos: The alt text is the name of the company or product – "Wave Tools", not "logo". The word "logo" may be added if it helps with orientation.
• Icons with a function: Describe the action ("Open menu", "Shopping cart"), not the symbol ("three lines", "trolley").
• Icons next to text: If the label already sits beside the icon, the icon is decorative – alt="".
• Text in images: As a rule, text belongs on the page as real text, not inside graphics. Where that cannot be avoided (an event poster, for example), the complete text must appear in the alt text or in a long description – word for word, not loosely summarized.

Alt text in WordPress

WordPress offers fields for alternative text in two places:

• Media library: Every image has an "Alternative text" field there. Whatever you enter is used as the default when you newly insert the image into content. Images that are already placed do not change retroactively.
• Block editor: In the image block you can adjust the alt text per use in the block settings under "Alternative text" – exactly right, because context decides. The value in the block overrides the value from the media library.

For decorative images, simply leave the field in WordPress empty – the block editor then correctly writes alt="" into the HTML. The caption, by the way, is no substitute for alt text: it is shown to everyone and has a different job.

How AI can help – and where its limits are

Modern image AI describes photos remarkably well and is a real help when hundreds of images sit in your media library without alt text. It recognizes subjects, the number of people, mood and often even text within the image – and delivers a usable draft in seconds.

What AI cannot read from the image is the context: it sees "woman at a laptop in a bright office", but not that this is your new managing director and the image illustrates her introduction. It cannot tell whether an image is decorative on this particular page, or whether, as a link, it should describe its destination instead.

The best way to check whether your alt text works in practice is a screen reader pass plus automated testing tools – our guide How to test your website for accessibility shows you how.