![\"Chiffre](\"ca-2025.png\")
\n ![\"image\"](\"chart.png\")
",
"good": "",
"note": {
"fr": "L'alternative décrit le sens, pas le nom de fichier.",
"en": "The alternative conveys the meaning, not the file name."
}
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#1.1"
},
{
"id": "images-decorative-alt-empty",
"criterionId": "1.2",
"wcag": ["1.1.1", "4.1.2"],
"title": {
"fr": "Images de décoration ignorées par les technologies d'assistance",
"en": "Decorative images ignored by assistive tech"
},
"summary": {
"fr": "Une image purement décorative doit être ignorée : alt vide (alt=\"\") pour une img, ou aria-hidden=\"true\" pour une icône.",
"en": "A purely decorative image must be ignored: empty alt (alt=\"\") on an img, or aria-hidden=\"true\" on an icon."
},
"impact": "medium",
"examples": [
{
"lang": "html",
"bad": "![\"séparateur](\"separateur.png\")
",
"good": "",
"note": {
"fr": "Une décoration annoncée au lecteur d'écran est du bruit.",
"en": "A decoration announced to a screen reader is noise."
}
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#1.2"
},
{
"id": "iframes-title-attribute",
"criterionId": "2.1",
"wcag": ["4.1.2"],
"title": {
"fr": "Titre de cadre pour chaque iframe",
"en": "Frame title on every iframe"
},
"summary": {
"fr": "Chaque iframe doit porter un attribut title court et pertinent décrivant son contenu.",
"en": "Every iframe must carry a short, relevant title attribute describing its content."
},
"impact": "high",
"examples": [
{
"lang": "html",
"bad": "",
"good": ""
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#2.1"
},
{
"id": "links-explicit",
"criterionId": "6.1",
"wcag": ["1.1.1", "2.4.4", "2.5.3"],
"title": {
"fr": "Intitulé de lien explicite",
"en": "Explicit link text"
},
"summary": {
"fr": "L'intitulé du lien (texte visible, ou nom accessible via aria-label/aria-labelledby) doit être explicite hors contexte.",
"en": "The link text (visible, or accessible name via aria-label/aria-labelledby) must be explicit out of context."
},
"impact": "high",
"examples": [
{
"lang": "html",
"bad": "Cliquez ici",
"good": "Télécharger le rapport annuel 2024 (PDF, 2 Mo)"
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#6.1"
},
{
"id": "images-icon-only-accessible-name",
"criterionId": "6.2",
"wcag": ["1.1.1", "2.4.4"],
"title": {
"fr": "Contrôle à icône seule : nom accessible obligatoire",
"en": "Icon-only control must have an accessible name"
},
"summary": {
"fr": "Un bouton/lien à icône seule (sans texte visible) doit avoir un nom accessible via aria-label (l'icône restant aria-hidden).",
"en": "An icon-only button/link (no visible text) must have an accessible name via aria-label (the icon stays aria-hidden)."
},
"impact": "high",
"examples": [
{
"lang": "html",
"bad": "",
"good": ""
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#6.2"
},
{
"id": "lang-html-attribute",
"criterionId": "8.3",
"wcag": ["3.1.1"],
"title": {
"fr": "Langue par défaut sur l'élément html",
"en": "Default language on the html element"
},
"summary": {
"fr": "L'élément html doit déclarer la langue par défaut de la page via l'attribut lang.",
"en": "The html element must declare the page's default language via the lang attribute."
},
"impact": "high",
"examples": [
{
"lang": "html",
"bad": "\n\n3 résultats trouvés
", "good": "3 résultats trouvés
", "note": { "fr": "role=\"status\" implique déjà aria-live=\"polite\" : un aria-live=\"assertive\" contradictoire interrompt l'utilisateur pour une information non urgente.", "en": "role=\"status\" already implies aria-live=\"polite\"; a contradictory aria-live=\"assertive\" interrupts the user for non-urgent information." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#7.5" }, { "id": "aria-live-polite-atomic", "criterionId": "7.5", "wcag": ["4.1.3"], "title": { "fr": "Une zone de restitution polie doit être atomique", "en": "A polite live region must be atomic" }, "summary": { "fr": "Une zone de restitution en aria-live=\"polite\" doit toujours porter aria-atomic=\"true\" pour que la technologie d'assistance restitue l'intégralité du message et non seulement le nœud de texte modifié. Sans aria-atomic, une mise à jour partielle (ex. un compteur qui passe de « 2 » à « 3 ») peut être annoncée hors contexte ou pas du tout.", "en": "A live region with aria-live=\"polite\" must always carry aria-atomic=\"true\" so the assistive technology reads the whole message, not just the changed text node. Without aria-atomic, a partial update (e.g. a counter going from \"2\" to \"3\") may be announced out of context or not at all." }, "impact": "medium", "examples": [ { "lang": "html", "bad": "Adresse e-mail invalide.
", "good": "Adresse e-mail invalide.
", "note": { "fr": "L'erreur visible porte un id cible d'aria-describedby, et le champ aria-invalid=\"true\" — l'association devient programmatique.", "en": "The visible error carries an id referenced by aria-describedby, and the field has aria-invalid=\"true\" — the association becomes programmatic." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#11.10" }, { "id": "images-alt-relevance", "criterionId": "1.3", "wcag": ["1.1.1"], "title": { "fr": "Pertinence de l'alternative textuelle des images", "en": "Relevance of the image text alternative" }, "summary": { "fr": "L'alternative d'une image porteuse d'information doit transmettre la même information ou fonction, de façon concise. Elle ne doit pas se limiter à « image »/au nom de fichier, ni répéter mot pour mot un texte adjacent, ni décrire l'apparence quand c'est l'information qui compte.", "en": "An informative image's alt must convey the same information or function, concisely. It must not be just \"image\"/the file name, must not duplicate adjacent text verbatim, and must not describe appearance when it is the meaning that matters." }, "impact": "medium", "examples": [ { "lang": "html", "bad": "Notre équipe vous accueille du lundi au vendredi.
\n![\"Notre](\"equipe.jpg\")
",
"good": "Notre équipe vous accueille du lundi au vendredi.
\n",
"note": {
"fr": "L'alternative ne répète pas le texte adjacent : elle apporte l'information que l'image ajoute.",
"en": "The alt does not repeat the adjacent text: it conveys what the image adds."
}
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#1.3"
},
{
"id": "images-captcha-alt-purpose",
"criterionId": "1.4",
"wcag": ["1.1.1"],
"title": {
"fr": "Alternative d'une image CAPTCHA : nature et fonction",
"en": "CAPTCHA image alternative: nature and purpose"
},
"summary": {
"fr": "L'alternative d'une image utilisée comme CAPTCHA ou image-test doit en identifier la nature et la fonction (« Code de sécurité visuel anti-spam ») sans jamais révéler la réponse attendue, ni rester vide.",
"en": "The alt of an image used as a CAPTCHA or test image must identify its nature and purpose (\"Visual anti-spam security code\") without ever revealing the expected answer, and must not be empty."
},
"impact": "high",
"examples": [
{
"lang": "html",
"bad": "",
"good": "\n Janvier : 1,2 M€ ; mars : 1,5 M€ ; juin : 1,8 M€ ; septembre : 2,0 M€ ; décembre : 2,4 M€.
\n\nGraphique présentant l'évolution du chiffre d'affaires en 2025.
", "good": "\nChiffre d'affaires trimestriel 2025 : T1 1,2 M€, T2 1,5 M€, T3 2,0 M€, T4 2,4 M€, soit +40 % sur l'année, portés par l'export au T2 et au T4.
", "note": { "fr": "La description doit livrer les données réelles, pas seulement reformuler le titre.", "en": "The description must provide the actual data, not merely restate the title." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#1.7" }, { "id": "images-no-text-in-images", "criterionId": "1.8", "wcag": ["1.4.5"], "title": { "fr": "Remplacer les images texte par du texte stylé", "en": "Replace images of text with styled real text" }, "summary": { "fr": "Le texte porteur d'information rendu sous forme d'image (bannière, titre en PNG) doit être remplacé par du vrai texte HTML mis en forme en CSS, sauf si la présentation visuelle est essentielle (logo, marque). Le texte image ne se redimensionne pas, ne se reflow pas et ignore les préférences utilisateur.", "en": "Information-bearing text rendered as an image (banner, PNG heading) must be replaced by real HTML text styled with CSS, unless the visual presentation is essential (logo, brand). Image text does not resize, reflow, or honour user preferences." }, "impact": "low", "examples": [ { "lang": "html", "bad": "![\"Bienvenue](\"banniere-bienvenue.png\")
",
"good": "",
"note": {
"fr": "Le vrai texte HTML se redimensionne, se traduit et respecte les préférences de l'utilisateur.",
"en": "Real HTML text resizes, translates, and respects user preferences."
}
}
],
"reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#1.8"
},
{
"id": "images-figure-figcaption",
"criterionId": "1.9",
"wcag": ["1.1.1", "4.1.2"],
"title": {
"fr": "Relier une légende à son image",
"en": "Associate a caption with its image"
},
"summary": {
"fr": "Quand une image a une légende visible, l'image et sa légende doivent être regroupées dans un ![\"Le](\"siege.jpg\")
\nLe nouveau siège inauguré en 2025 à Lyon.
", "good": "\n Erreur : saisissez une adresse e-mail valide.
", "note": { "fr": "L'erreur n'est plus signalée que par la couleur : un texte d'erreur la rend perceptible par tous.", "en": "The error is no longer signalled by colour alone: an error text makes it perceivable by everyone." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#3.1" }, { "id": "color-text-contrast", "criterionId": "3.2", "wcag": ["1.4.3"], "title": { "fr": "Contraste suffisant entre texte et arrière-plan", "en": "Sufficient text/background contrast" }, "summary": { "fr": "Le contraste texte/arrière-plan doit être d'au moins 4,5:1 pour le texte courant et 3:1 pour le grand texte (≥ 24 px, ou ≥ 18,66 px en gras). Le texte placé sur une image ou un dégradé doit être vérifié visuellement. Le RGAA arrondit ce seuil « gras » à 18,5 px ; le moteur applique le seuil WCAG exact de 18,66 px (14pt gras), donc un texte gras entre 18,5 et 18,66 px reste tenu au seuil normal (4,5:1).", "en": "Text/background contrast must be at least 4.5:1 for body text and 3:1 for large text (≥ 24 px, or ≥ 18.66 px bold). Text over an image or gradient must be checked visually. RGAA rounds this \"bold\" threshold to 18.5 px; the engine applies the exact WCAG threshold of 18.66 px (14pt bold), so bold text between 18.5 and 18.66 px is still held to the normal (4.5:1) threshold." }, "impact": "high", "examples": [ { "lang": "html", "bad": "Conditions générales d'utilisation
", "good": "Conditions générales d'utilisation
", "note": { "fr": "#999 sur blanc ≈ 2,85:1 (insuffisant) ; #595959 sur blanc ≈ 7:1, conforme pour du texte courant.", "en": "#999 on white ≈ 2.85:1 (insufficient); #595959 on white ≈ 7:1, compliant for body text." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#3.2" }, { "id": "color-non-text-contrast", "criterionId": "3.3", "wcag": ["1.4.11"], "title": { "fr": "Contraste des composants et éléments graphiques", "en": "Contrast of UI components and graphical elements" }, "summary": { "fr": "Les couleurs des composants d'interface (bordures de champ, boutons, cases, focus) et des éléments graphiques porteurs d'information doivent atteindre un contraste d'au moins 3:1 avec les couleurs adjacentes, pour rester perceptibles.", "en": "The colours of UI components (field borders, buttons, checkboxes, focus) and of information-bearing graphical elements must reach at least 3:1 contrast with adjacent colours to remain perceivable." }, "impact": "medium", "examples": [ { "lang": "html", "bad": "", "good": "", "note": { "fr": "#ccc sur blanc ≈ 1,61:1 (la bordure disparaît) ; #767676 ≈ 4,5:1 dépasse le seuil de 3:1 requis.", "en": "#ccc on white ≈ 1.61:1 (the border vanishes); #767676 ≈ 4.5:1 exceeds the required 3:1 threshold." } } ], "reference": "https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/#3.3" }, { "id": "media-transcript", "criterionId": "4.1", "wcag": ["1.2.1", "1.2.3"], "title": { "fr": "Transcription ou audiodescription d'un média pré-enregistré", "en": "Transcript or audio description for prerecorded media" }, "summary": { "fr": "Chaque média temporel pré-enregistré (audio, vidéo) doit, si nécessaire, disposer d'une transcription textuelle complète ou d'une audiodescription, accessible directement dans la page (texte adjacent ou lien clairement identifié), pas seulement via un téléchargement.", "en": "Each prerecorded time-based media (audio, video) must, where needed, provide a full text transcript or an audio description, available directly in the page (adjacent text or a clearly identified link), not only via a download." }, "impact": "high", "examples": [ { "lang": "html", "bad": "", "good": "