For each image conveying information that has a text alternative, is this alternative relevant (except in special cases)?

A screen reader encounters an image and reads its text alternative aloud. If that alternative says « img_banniere_2024_v3_final.png » or « image », the user receives noise, not information. Criterion 1.3 goes a step further than criterion 1.1: it does not only check that the alternative exists, but that it says something useful.

A relevant alternative is one that conveys the same informational content as the image. If the image shows a growth chart, the alternative must give the key figures or trend. If the image is a « Search » button, the alternative must say « Search », not « blue magnifying glass ». The visual form is not the content.

This criterion applies to all types of images: <img>, <area>, <input type="image">, <object type="image/…">, <embed type="image/…">, <svg> and <canvas>. For each, the check is identical: does the alternative, read alone, allow you to understand what the image communicates? A simple rule applies: if you had to describe this image to someone over the phone, what would you say? That's the right alternative text.

Test 1.3.9 adds an additional constraint: the alternative must be short and concise. This is not a stylistic luxury. Users of screen magnification see only a portion of the screen at a time: a 200-word alternative forces them to scroll painfully. Focus on the essentials, refer to a long description if the image is complex.

9 tests to assess the relevance of each text alternative

Relevance of alternative text <img> and role="img"

  1. Identify all <img> elements and elements with role="img" that have a text alternative (alt, aria-label or filled aria-labelledby).
  2. For each one, read the text alternative alone, without seeing the image.
  3. Verify that this alternative describes the content or function of the image completely and accurately.
  4. A generic alternative (« image », « photo ») or one that describes the format rather than the content fails the test.
  5. If all alternatives are relevant, the test is validated.

Relevance of alternative text <area>

  1. Identify all <area> elements in reactive images (<map>) that have a filled alt attribute.
  2. For each zone, read the alt attribute without looking at the delimited area in the image.
  3. Verify that this alt describes the destination or function of the zone explicitly.
  4. If all zone alternatives are relevant, the test is validated.

Relevance of alternative text <input type="image">

  1. Identify all <input type="image"> elements that have a text alternative.
  2. For each image button, read the alternative without seeing the visual.
  3. Verify that it describes the action triggered by the button (e.g., « Submit the form »), not the appearance of the image.
  4. If all alternatives are relevant, the test is validated.

Relevance of alternative text <object>

  1. Identify all <object type="image/…"> elements that have a text alternative.
  2. For each element, read the alternative without seeing the embedded image.
  3. Verify that the alternative describes the informational content of the image.
  4. If all alternatives are relevant, the test is validated.

Relevance of alternative text <embed>

  1. Identify all <embed type="image/…"> elements that have a text alternative.
  2. For each element, read the alternative without seeing the image.
  3. Verify that the alternative conveys the informational content of the image.
  4. If all alternatives are relevant, the test is validated.

Relevance of alternative text <svg>

  1. Identify all <svg> elements carrying information that have a text alternative (via <title>, aria-label or aria-labelledby).
  2. For each SVG, read the alternative without looking at the graphic.
  3. Verify that the alternative describes what the SVG represents or communicates.
  4. If all alternatives are relevant, the test is validated.

Relevance of alternative text <canvas> via ARIA

  1. Identify all <canvas> elements carrying information that have a text alternative via aria-label or aria-labelledby.
  2. For each canvas, read the alternative without seeing the visual rendering.
  3. Verify that the alternative describes the content of the canvas in a relevant way.
  4. If all alternatives are relevant, the test is validated.

Rendering of alternative content <canvas>

  1. Identify all <canvas> elements that contain alternative content between <canvas> and </canvas>.
  2. Test the rendering with a screen reader (NVDA, JAWS or VoiceOver depending on the target test environment).
  3. Verify that the alternative content is properly announced by the screen reader.
  4. If the content is correctly rendered for each canvas, the test is validated.

Short and concise alternative text

  1. Identify all images carrying information with a text alternative.
  2. For each image, verify that the alternative is short and concise: it must not describe the image in exhaustive detail, but convey the essential information.
  3. If an alternative is excessively long (full paragraph), it must be moved to a long description via aria-describedby or an adjacent link.
  4. If all alternatives are short and concise, the test is validated.

Examples

❌ Non-compliant : Text alternative that describes the form, not the content

<img src="fleche-hausse.png" alt="Green arrow pointing upward">

The alternative describes the visual appearance of the icon, not what it means in context. A screen reader user understands there is a green arrow, but not that sales increased by 12% this quarter. This is the most frequent error in audits.

✅ Compliant : Text alternative that conveys meaning

<img src="fleche-hausse.png" alt="Sales increase of 12% in Q1 2025">

The alternative conveys the information that the image communicates. The visitor who cannot see the image receives exactly the same data as the one who does. The visual description (« green arrow ») has no informational value here.

❌ Non-compliant : Image button with alternative describing the icon

<input type="image" src="btn-loupe.png" alt="Blue magnifying glass">

For an <input type="image">, the alternative must describe the action triggered, not the image itself. A screen reader user hears « blue magnifying glass » and does not know what this button does.

✅ Compliant : Image button with alternative describing the action

<input type="image" src="btn-loupe.png" alt="Search">

The alternative describes what the button does. This is the rule for all buttons: their text alternative must name the action, not the visual appearance of the control.

✅ Compliant : SVG with relevant alternative via aria-label

<svg role="img" aria-label="2025 budget breakdown: 40% R&D, 35% Marketing, 25% Infrastructure" xmlns="http://www.w3.org/2000/svg">
  <!-- chart paths -->
</svg>

The text alternative on the SVG conveys the key data from the pie chart. A screen reader user obtains an actionable summary without access to the visual rendering.

Tips and pitfalls

⚠️ Describing the image instead of its message

The visual description of an image (« man in suit smiling in front of a whiteboard ») is rarely what an image communicates. If this photo illustrates an article on participatory management, the alternative must say so. Ask yourself: why is this image here? The answer to that question is your alternative.

⚠️ Using the file name or URL as the alternative

Some CMS or image editors automatically generate an alt from the file name: alt="DSC_0042" or alt="hero-image-version2-final". Criterion 1.3 systematically fails in these cases. Verify that your content creation pipeline does not automate the alt from the file name.

⚠️ Image captioned with <figure> and <figcaption>

When an image is accompanied by a <figcaption>, the text alternative and caption must be complementary, not redundant. The alt describes the image content; the <figcaption> can provide context, photo credit or supplementary information. Writing the same text in both is a common mistake.

⚠️ CAPTCHA and test images: criterion not applicable

A visual CAPTCHA is designed so that a human can solve it but not a robot. Providing a text alternative that describes the code to enter would destroy the purpose of the CAPTCHA itself. Criterion 1.3 does not apply in this case. However, criterion 1.4 requires offering a non-visual alternative (audio CAPTCHA, logic question). Same logic for test images: an image used to test a user's visual perception cannot have an alternative without voiding the test.

💡 For a complex chart, the short alternative is not enough

Test 1.3.9 requires a short alternative. But a chart with ten data lines cannot be summarized in 80 characters without loss of information. Solution: a short alternative in the aria-label (« Sales evolution 2020-2025 ») and a detailed description via aria-describedby pointing to an adjacent data table. You satisfy both requirements without overloading the alternative.

💡 Test the alternative by disabling images

The fastest audit method: disable image display in your browser (or use the Web Developer extension). Browse the page reading only the alternative texts. If you understand the content and can use the features without missing anything, criterion 1.3 is very likely validated.

Frequently asked questions

What is the difference between RGAA criterion 1.1 and criterion 1.3?

Criterion 1.1 checks that each informative image has a text alternative (presence). Criterion 1.3 checks that this alternative says something relevant (quality). An image can have a filled alt and still fail 1.3 if the alt is generic or off-topic. Both criteria are complementary and must be audited together.

How to adapt the text alternative of the same image used in two different contexts?

No, and this is a counter-intuitive point. Relevance depends on context, not on the image itself. A company logo in the header must have the alt of the company name. The same logo in the footer, next to the text of the company name, can have an empty alt because it becomes decorative. The right alternative is the one that conveys what the image contributes in that specific context.

How to verify the relevance of a text alternative during an RGAA audit?

Cover or hide the image, read only the alternative. Ask yourself two questions: do I understand what the image communicates? Can I accomplish the associated action if it is a button or link? If the answer to either is no, test 1.3.1 fails. With NVDA or VoiceOver, navigate from image to image (I key under NVDA) to hear the alternatives as they are rendered.

Why can a text alternative that is too long fail criterion 1.3?

Yes, via test 1.3.9. An alternative that describes every visual detail of an image over three paragraphs is not « short and concise ». Users with screen magnification or keyboard navigation suffer this text with each pass over the image. The rule: the text alternative carries the essentials, a long description via aria-describedby or an adjacent link takes the rest.

How to verify compliance of test 1.3.8 on <canvas> with a screen reader?

Yes. The alternative content between <canvas> and </canvas> must be properly rendered by assistive technologies, which cannot be verified by source code reading alone. Support for <canvas> varies between browsers and screen readers. Test with at least NVDA under Firefox and VoiceOver under Safari to cover the test environments defined in your accessibility statement.

References

RGAA 4.1.2: Criterion 1.3
WCAG 2.1:1.1.1 (A)4.1.2 (A)G94G95F30F71G196ARIA6ARIA9ARIA101.1.1 (A)4.1.2 (A)