Four questions from the W3C decide every image. Here is what to write for logos, icons, buttons, backgrounds and charts, and how to leave an alt empty in WordPress.
Give a decorative image an empty alt attribute (alt="") so screen readers skip it. Give a logo, an icon or a button image alt text that says what it is or what it does: the organization, the destination of the link or the action. W3C’s decision tree sorts any image into informative, functional or decorative with four questions.
W3C’s alt decision tree starts from the purpose of the image on the page. An informative image conveys a simple concept, a functional image starts an action because it sits in a link or a button, and a decorative image adds no information. W3C says the choice between informative and decorative is a judgment that only the author can make, based on why the image is on the page.
For hard cases, W3C suggests a simple test: imagine reading the page aloud over the phone to someone who needs to understand it. If an image has no informative value and is not a link or a button, it is probably safe to treat it as decorative. WCAG success criterion 1.1.1 asks for pure decoration to be implemented so that assistive technology can ignore it.
Decorative does not only mean ornaments. W3C’s list includes borders, spacers and corners, images that only improve the look of a link or enlarge its clickable area, images that illustrate adjacent text without adding information, and images already described by the surrounding text.
Read the questions in order and stop at the first one that fits. The table follows the W3C alt decision tree, which says itself that it does not cover every case.
| Question | Your answer | What to put in alt |
|---|---|---|
| 1. Does the image contain text? | Yes, and the text is also real text nearby, or is only there for a visual effect | An empty alt (alt="") |
| 1. Does the image contain text? | Yes, and the text has a function, for example an icon | The function of the image |
| 1. Does the image contain text? | Yes, and the text appears nowhere else on the page | The text of the image |
| 2. Is the image in a link or a button, and would it be hard to tell what that link or button does without it? | Yes | The destination of the link or the action it triggers |
| 3. Does the image add meaning to the page? | Yes, and it is a simple graphic or a photograph | A brief description that conveys that meaning |
| 3. Does the image add meaning to the page? | Yes, and it is a graph or a complex piece of information | A short alt, with the information given elsewhere on the page |
| 3. Does the image add meaning to the page? | Yes, but it shows content that real text nearby already gives | An empty alt |
| 4. Is the image purely decorative, or not meant for users? | Yes | An empty alt |
| Is the use of the image not listed above, or is it unclear what to write? | Yes | The tree does not cover it: read the W3C Images Tutorial |
Three values look close in the code and behave differently for a visitor who cannot see the image.
W3C advises a null alt for decorative images so assistive technologies can ignore them. MDN adds that non-visual browsers may omit the image. It is the right value for decoration, and the wrong one for an image that carries information or is the only content of a link.
W3C warns that leaving the attribute out is not an option: some screen readers then announce the file name of the image. For a linked image, WebAIM adds that they may read the address of the linked page. Neither helps a visitor.
W3C notes that an image may not be hidden if the quotes hold a space: some screen readers still announce it. Our guide to the missing and the empty alt attribute shows how Lighthouse, WAVE and SEO crawlers treat each case.
of the images missing alt text on the top million home pages were linked images (WebAIM Million, February 2026)
linked images on those home pages had no alt text at all (WebAIM Million, February 2026)
of home page images had missing alt text, without counting alt=”” (WebAIM Million, February 2026)
of images with alt text had questionable or repetitive text, such as “image” or a file name (WebAIM Million, February 2026)
One case per step, with the sources that settle each one.
A logo on its own gets the name of the organization. In its example W3C writes “Web Accessibility Initiative” and adds that there is no need to say it is a logo; WebAIM agrees that the word “logo” is usually not important. A logo that is the only content of a link is a functional image: W3C’s example is “W3C home”, while WebAIM finds the company name enough, since screen readers announce a graphic link. If the same name is written next to the logo inside the same link, the image gets alt="".
An icon next to a visible label that says the same thing gets alt="". An icon that adds what the text lacks gets that information: W3C uses “new window” for an icon placed after a link, and WebAIM uses “PDF” for a PDF icon beside “Download the employment application”. An icon alone in a link or a button names its function, such as “Print this page” rather than “printer”. W3C also warns that icon labels often disappear on small screens, so check that the icons still make sense without them. Skip the words “icon” and “image”: screen readers already announce an image. See also what alt text is.
When an image is the only content of a link or a button, an empty alt is never right: WebAIM explains that screen readers may read the file name or the address of the page instead. Write what happens on activation, such as “Search”, “Submit” or “Place your order”. For an image button the W3C example is alt="Search". WCAG 1.1.1 requires a control to have a name that describes its purpose. If an image button only holds a picture of text, WebAIM recommends replacing it with real text styled with CSS.
A CSS background image cannot take alt text. WebAIM puts it this way: content shown in a background must be made accessible in the page markup. W3C and WebAIM both recommend CSS backgrounds for purely decorative images, so a background is the right home for a flourish. If the picture shows a product, a name, a price or a slogan, put it in a real image with an alt, or write the same information as text on the page.
For a chart, W3C asks for two parts: a short alt that identifies the image, and a long description of the essential information, shown on the page for everyone. WebAIM’s example is “Line chart of annual sales data” placed next to a link to the data. For an image of text the alt repeats the text, although real styled text is better, and when the same text is already on the page the alt stays empty. Our alt text examples show charts, photos and screenshots.
WordPress 7.1, released on August 19, 2026, adds a Mark as decorative checkbox to the Image block. Select the block and open the Content tab of the settings sidebar. The WordPress documentation says to use it only when the image adds no meaningful information or function. Ticking the box clears the alt text, the caption and the link, and WordPress adds role="none" to the image in the saved markup. Before 7.1, leave the Alternative text field empty: the same documentation says to do so when the image is decorative.
Block settings and the Media Library are two places. The documentation says that alt text added in the block settings applies to that image on that post only, while alt text added in the Media Library sets the default for later insertions. A decorative image used in several posts has to be set in each of them.
If you use Rank Math, note that its Add missing ALT attributes option adds an alt to images that have none, from the file name by default, when the page is displayed. The documentation does not say how it treats an alt that is empty on purpose, so test a decorative image after you switch it on.
Filikod handles decoration from the media library. On the ALT Audit page, a Decorative column with a toggle marks an image as an intentional empty alt. The image leaves the ALT Quality Score, gets its own tab for review and can be switched back. Automatic alt generation from file names skips it, and typing a real alt text on a decorative image removes the mark. A lone “logo” as alt text is flagged as generic. The free checker works differently: by its published rules it counts an image as decorative only with role="presentation" or aria-hidden="true", and it reports an empty alt as missing, so read those lines as a prompt to confirm the image really is decorative. To see what a page prints, use the checker or the methods in our guide to checking alt text.
They need an empty alt attribute, not a description. W3C advises alt="" so that assistive technologies ignore the image, and warns that omitting the attribute lets some screen readers announce the file name. Use the empty alt only when the image adds nothing: if it conveys even a little information, describe it. The difference between the two cases is explained in our guide to the empty alt attribute.
Yes, unless the logo sits in a link next to the same name, where it gets an empty alt. A logo alone gets the name of the organization. A logo that is a link names the destination: W3C’s example is “W3C home” and WebAIM finds the company name enough. The word “logo” is not needed according to both. Filikod flags a lone “logo” as generic alt text.
It depends on the job of the icon. An icon beside a text label that says the same thing gets an empty alt. An icon that adds information, or that is alone in a link or a button, gets alt text that gives the information or the function, such as “PDF”, “new window” or “Print this page”. The W3C decision tree asks the same questions in order.
Describe the action or the destination, not the picture. W3C’s examples are “Search” for a magnifying glass button and “Print this page” for a printer icon. WebAIM says an empty alt would never be appropriate when an image is the only content of a link or a button. See our alt text examples for more cases.
You cannot: WebAIM states that it is not possible to add alternative text directly to CSS or other background images. Use backgrounds for decoration only. If the image carries information, insert it as a real image with an alt, or give the same information as text on the page.
The full FAQ covers the checker, the score, the plugin and how your data is handled.
Install Filikod, set decorative images aside so they leave the score, and fix missing or generic alt text across the media library in bulk. The plugin is free.
