RGAA Lab

RGAA 4.1.2 · Images · Critère 1.2

Chaque image de décoration est-elle correctement ignorée par les technologies d’assistance ?

Une image décorative annoncée par un lecteur d'écran est du bruit : sur une page qui en compte trente, elle rend la lecture épuisante.

Ce que dit le référentiel

Transcription du RGAA 4.1.2, sans interprétation. C’est ce texte qui fait foi, et celui que vous citez dans un rapport.

  1. 1.2.1
    Chaque image (balise <img>) de décoration, sans légende, vérifie-t-elle une de ces conditions ?
    • La balise <img> possède un attribut alt vide (alt="") et est dépourvue de tout autre attribut permettant de fournir une alternative textuelle ;
    • La balise <img> possède un attribut WAI-ARIA aria-hidden="true" ou role="presentation".
  2. 1.2.2
    Chaque zone non cliquable (balise <area> sans attribut href) de décoration, vérifie-t-elle une de ces conditions ?
    • La balise <area> possède un attribut alt vide (alt="") et est dépourvue de tout autre attribut permettant de fournir une alternative textuelle ;
    • La balise <area> possède un attribut WAI-ARIA aria-hidden="true" ou role="presentation".
  3. 1.2.3
    Chaque image objet (balise <object> avec l’attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?
    • La balise <object> possède un attribut WAI-ARIA aria-hidden="true" ;
    • La balise <object> est dépourvue d’alternative textuelle ;
    • Il n’y a aucun texte faisant office d’alternative textuelle entre <object> et </object>.
  4. 1.2.4
    Chaque image vectorielle (balise <svg>) de décoration, sans légende, vérifie-t-elle ces conditions ?
    • La balise <svg> possède un attribut WAI-ARIA aria-hidden="true" ;
    • La balise <svg> et ses enfants sont dépourvus d’alternative textuelle ;
    • Les balises <title> et <desc> sont absentes ou vides ;
    • La balise <svg> et ses enfants sont dépourvus d’attribut title.
  5. 1.2.5
    Chaque image bitmap (balise <canvas>) de décoration, sans légende, vérifie-t-elle ces conditions ?
    • La balise <canvas> possède un attribut WAI-ARIA aria-hidden="true" ;
    • La balise <canvas> et ses enfants sont dépourvus d’alternative textuelle ;
    • Il n’y a aucun texte faisant office d’alternative textuelle entre <canvas> et </canvas>.
  6. 1.2.6
    Chaque image embarquée (balise <embed> avec l’attribut type="image/…") de décoration, sans légende, vérifie-t-elle ces conditions ?
    • La balise <embed> possède un attribut WAI-ARIA aria-hidden="true" ;
    • La balise <embed> et ses enfants sont dépourvus d’alternative textuelle.

Comment le vérifier

  1. Repérer les images qui n'apportent rien au propos : ornements, séparateurs, motifs de fond, icônes doublant un texte voisin.
  2. Vérifier qu'elles sont bien retirées de l'arbre d'accessibilité : alt="" pour une <img>, aria-hidden="true" pour un SVG ou une icône.
  3. Vérifier qu'elles ne portent ni title, ni aria-label, ni rôle explicite — l'un d'eux suffit à les faire réapparaître.

Ce que notre outil fait

Assisté

Le moteur repère les éléments concernés et vous pose la question. Il ne conclut pas à votre place.

Aucune règle opposable ne couvre ce critère, et c'est assumé : le W3C publie bien une règle sur les éléments décoratifs exposés, mais sans exigence de conformité — son échec seul n'établit rien. L'assistant vous présente donc les images décoratives de la page et vous demande de confirmer qu'elles sont bien ignorées. Attention à ne pas confondre avec le 1.1 : le moteur y détecte l'inverse, une image retirée de l'arbre alors qu'elle porte de l'information.

Comment nous mesurons ce que l'outil sait faire · ce critère s'audite dans l'extension RGAA Lab.

Les pièges

Les erreurs qu’on rencontre vraiment, relevées au fil des audits.

  • Une icône qui double un texte (« ✉ Nous écrire ») est décorative : l'annoncer ferait entendre le mot deux fois.
  • Un logo de partenaire dans un pied de page est rarement décoratif — il porte un nom, donc une information.
  • role="presentation" sur une image qui porte quand même un alt non vide est contradictoire : le nom l'emporte et l'image réapparaît.

À lire avec