{"id":111,"date":"2026-02-09T15:06:32","date_gmt":"2026-02-09T13:06:32","guid":{"rendered":"https:\/\/www.conform-it.fr\/?p=111"},"modified":"2026-02-09T15:06:32","modified_gmt":"2026-02-09T13:06:32","slug":"chapitre-8-du-rgaa-elements-obligatoires-poser-les-bases-techniques-de-laccessibilite","status":"publish","type":"post","link":"https:\/\/wp7.conform-it.fr\/index.php\/2026\/02\/09\/chapitre-8-du-rgaa-elements-obligatoires-poser-les-bases-techniques-de-laccessibilite\/","title":{"rendered":"Chapitre 8 du RGAA : \u00c9l\u00e9ments obligatoires \u2013 poser les bases techniques de l\u2019accessibilit\u00e9"},"content":{"rendered":"<h2><span style=\"text-decoration: underline;\">Introduction<\/span><\/h2>\n<p>Le chapitre 8 du RGAA traite des \u00e9l\u00e9ments obligatoires pr\u00e9sents dans toute page web. Contrairement aux chapitres pr\u00e9c\u00e9dents qui concernent des contenus sp\u00e9cifiques (images, tableaux, scripts\u2026), celui-ci porte sur les fondations techniques indispensables \u00e0 l\u2019accessibilit\u00e9.<\/p>\n<p>Ces \u00e9l\u00e9ments permettent aux technologies d\u2019assistance de <strong>comprendre correctement la structure, la langue et le fonctionnement global de la page<\/strong>. S\u2019ils sont absents ou mal d\u00e9finis, m\u00eame un contenu bien con\u00e7u peut devenir difficile \u00e0 interpr\u00e9ter.<\/p>\n<h2><span style=\"text-decoration: underline;\">Les informations essentielles d\u2019une page accessible<\/span><\/h2>\n<p>Le chapitre 8 impose notamment la pr\u00e9sence et la qualit\u00e9 de plusieurs \u00e9l\u00e9ments structurants :<\/p>\n<ul>\n<li>\n<p>Un titre de page pertinent<\/p>\n<\/li>\n<li>\n<p>Une langue principale d\u00e9clar\u00e9e<\/p>\n<\/li>\n<li>\n<p>Des changements de langue signal\u00e9s<\/p>\n<\/li>\n<li>\n<p>Une structure HTML valide<\/p>\n<\/li>\n<li>\n<p>Des m\u00e9tadonn\u00e9es utiles \u00e0 la compr\u00e9hension<\/p>\n<\/li>\n<\/ul>\n<p>Ces \u00e9l\u00e9ments sont souvent invisibles pour l\u2019utilisateur, mais essentiels pour les lecteurs d\u2019\u00e9cran.<\/p>\n<h4>Exemple 1 : le titre de page (balise <code>&lt;title&gt;<\/code>)<\/h4>\n<p>Le titre de la page est la premi\u00e8re information annonc\u00e9e par un lecteur d\u2019\u00e9cran. Il doit d\u00e9crire clairement le contenu.<\/p>\n<pre><code class=\"language-html\">&lt;head&gt;\n  &lt;title&gt;Contact \u2013 Ville de Nantes&lt;\/title&gt;\n&lt;\/head&gt;\n<\/code><\/pre>\n<p>Bonnes pratiques :<\/p>\n<ul>\n<li>\n<p>Le titre doit \u00eatre unique et pertinent<\/p>\n<\/li>\n<li>\n<p>Il doit refl\u00e9ter le contenu principal<\/p>\n<\/li>\n<li>\n<p>Il doit permettre de distinguer les pages entre elles<\/p>\n<\/li>\n<\/ul>\n<p>Exemple non pertinent :<\/p>\n<pre><code class=\"language-html\">&lt;title&gt;Accueil&lt;\/title&gt;\n<\/code><\/pre>\n<p>Trop vague si plusieurs pages portent ce nom.<\/p>\n<h4>Exemple 2 : d\u00e9claration de la langue principale<\/h4>\n<p>La langue doit \u00eatre indiqu\u00e9e pour permettre une bonne prononciation par les lecteurs d\u2019\u00e9cran.<\/p>\n<pre><code class=\"language-html\">&lt;html lang=\"fr\"&gt;\n<\/code><\/pre>\n<p>Cela permet au logiciel de lecture vocale d\u2019utiliser la bonne synth\u00e8se vocale.<\/p>\n<h4>Exemple 3 : changement de langue dans le contenu<\/h4>\n<p>Lorsqu\u2019un mot ou un passage est dans une autre langue, cela doit \u00eatre signal\u00e9.<\/p>\n<pre><code class=\"language-html\">&lt;p&gt;\n  Le terme &lt;span lang=\"en\"&gt;accessibility&lt;\/span&gt; signifie accessibilit\u00e9.\n&lt;\/p&gt;\n<\/code><\/pre>\n<p>Le lecteur d\u2019\u00e9cran change automatiquement de prononciation.<\/p>\n<h4>Exemple 4 : structure HTML correcte<\/h4>\n<p>Une page doit respecter les standards du web :<\/p>\n<ul>\n<li>\n<p>Balises correctement imbriqu\u00e9es<\/p>\n<\/li>\n<li>\n<p>Attributs valides<\/p>\n<\/li>\n<li>\n<p>Absence d\u2019erreurs bloquantes<\/p>\n<\/li>\n<\/ul>\n<p>Exemple simple :<\/p>\n<pre><code class=\"language-html\">&lt;header&gt;\n  &lt;h1&gt;Actualit\u00e9s&lt;\/h1&gt;\n&lt;\/header&gt;\n\n&lt;main&gt;\n  &lt;article&gt;\n    &lt;h2&gt;Nouvelle version du site&lt;\/h2&gt;\n  &lt;\/article&gt;\n&lt;\/main&gt;\n<\/code><\/pre>\n<p>Une structure claire facilite la navigation pour tous.<\/p>\n<h4>Exemple 5 : identification des zones importantes avec ARIA<\/h4>\n<p>Dans les pages complexes, ARIA peut aider \u00e0 identifier les grandes r\u00e9gions.<\/p>\n<pre><code class=\"language-html\">&lt;header role=\"banner\"&gt;\n  ...\n&lt;\/header&gt;\n\n&lt;nav role=\"navigation\"&gt;\n  ...\n&lt;\/nav&gt;\n\n&lt;main role=\"main\"&gt;\n  ...\n&lt;\/main&gt;\n\n&lt;footer role=\"contentinfo\"&gt;\n  ...\n&lt;\/footer&gt;\n<\/code><\/pre>\n<p>Cependant, en HTML5, ces r\u00f4les sont souvent implicites. Par exemple :<\/p>\n<pre><code class=\"language-html\">&lt;header&gt;\n&lt;nav&gt;\n&lt;main&gt;\n&lt;footer&gt;\n<\/code><\/pre>\n<p>Les r\u00f4les ARIA sont alors optionnels.<\/p>\n<h4>Exemple 6 : donner un nom \u00e0 une zone sp\u00e9cifique<\/h4>\n<pre><code class=\"language-html\">&lt;nav aria-label=\"Menu principal\"&gt;\n  ...\n&lt;\/nav&gt;\n<\/code><\/pre>\n<p>Cela permet au lecteur d\u2019\u00e9cran d\u2019annoncer clairement la fonction de la zone.<\/p>\n<h4>Exemple 7 : gestion du focus lors du chargement<\/h4>\n<p>Dans certaines applications dynamiques, on peut pr\u00e9ciser la zone principale.<\/p>\n<pre><code class=\"language-html\">&lt;main tabindex=\"-1\" id=\"contenu-principal\"&gt;\n  ...\n&lt;\/main&gt;\n<\/code><\/pre>\n<p>Puis d\u00e9placer le focus avec un script pour faciliter la navigation.<\/p>\n<h2><span style=\"text-decoration: underline;\">Le r\u00f4le d\u2019ARIA dans ce chapitre<\/span><\/h2>\n<p>ARIA intervient surtout pour compl\u00e9ter la structure lorsque le HTML seul ne suffit pas :<\/p>\n<ul>\n<li>\n<p><code>role=\"main\"<\/code> pour identifier le contenu principal<\/p>\n<\/li>\n<li>\n<p><code>role=\"navigation\"<\/code> pour nommer un menu<\/p>\n<\/li>\n<li>\n<p><code>aria-label<\/code> pour pr\u00e9ciser la fonction d\u2019une zone<\/p>\n<\/li>\n<li>\n<p><code>aria-labelledby<\/code> pour associer un titre<\/p>\n<\/li>\n<\/ul>\n<p>Mais dans la majorit\u00e9 des cas, le HTML5 fournit d\u00e9j\u00e0 les bonnes bases.<\/p>\n<h2><span style=\"text-decoration: underline;\">Les crit\u00e8res cl\u00e9s du RGAA pour les \u00e9l\u00e9ments obligatoires<\/span><\/h2>\n<p>Le chapitre 8 v\u00e9rifie notamment que :<\/p>\n<ul>\n<li>\n<p>Le titre de page est pr\u00e9sent et pertinent<\/p>\n<\/li>\n<li>\n<p>La langue principale est d\u00e9finie<\/p>\n<\/li>\n<li>\n<p>Les changements de langue sont signal\u00e9s<\/p>\n<\/li>\n<li>\n<p>Le code HTML est valide<\/p>\n<\/li>\n<li>\n<p>Les r\u00e9gions principales sont identifiables<\/p>\n<\/li>\n<\/ul>\n<p>Ces \u00e9l\u00e9ments permettent aux technologies d\u2019assistance d\u2019interpr\u00e9ter correctement la page.<\/p>\n<h2><span style=\"text-decoration: underline;\">Erreurs fr\u00e9quentes observ\u00e9es en audit<\/span><\/h2>\n<p>On retrouve souvent :<\/p>\n<ul>\n<li>\n<p>Des titres de pages identiques sur tout le site<\/p>\n<\/li>\n<li>\n<p>Une langue non d\u00e9clar\u00e9e<\/p>\n<\/li>\n<li>\n<p>Des mots \u00e9trangers non signal\u00e9s<\/p>\n<\/li>\n<li>\n<p>Une structure HTML confuse<\/p>\n<\/li>\n<li>\n<p>Des zones importantes non identifiables<\/p>\n<\/li>\n<\/ul>\n<p>Ces probl\u00e8mes d\u00e9gradent fortement l\u2019exp\u00e9rience de navigation.<\/p>\n<h2><span style=\"text-decoration: underline;\">Impact concret pour les utilisateurs<\/span><\/h2>\n<p>Sans langue d\u00e9clar\u00e9e, un lecteur d\u2019\u00e9cran peut prononcer un texte fran\u00e7ais avec un accent anglais.<br \/>Sans titre clair, il devient difficile de se rep\u00e9rer entre plusieurs onglets ouverts.<br \/>Sans structure identifiable, la navigation devient lente et impr\u00e9cise.<\/p>\n<p>Ces \u00e9l\u00e9ments, bien que discrets, jouent un r\u00f4le majeur dans l\u2019accessibilit\u00e9 globale.<\/p>\n<h2><span style=\"text-decoration: underline;\">Conclusion<\/span><\/h2>\n<p>Le chapitre 8 du RGAA pose les fondations techniques indispensables \u00e0 toute page accessible. Titre de page, langue, structure HTML et identification des r\u00e9gions principales permettent aux technologies d\u2019assistance de comprendre correctement le contenu.<\/p>\n<p>Les attributs ARIA peuvent compl\u00e9ter cette structure, notamment pour nommer certaines zones, mais l\u2019essentiel repose sur une base HTML propre, coh\u00e9rente et bien organis\u00e9e. Ces \u00e9l\u00e9ments obligatoires constituent le socle sur lequel repose toute d\u00e9marche d\u2019accessibilit\u00e9 num\u00e9rique.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction Le chapitre 8 du RGAA traite des \u00e9l\u00e9ments obligatoires pr\u00e9sents dans toute page web. Contrairement aux chapitres pr\u00e9c\u00e9dents qui [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[7],"tags":[],"class_list":["post-111","post","type-post","status-publish","format-standard","hentry","category-comprendre-le-rgaa"],"_links":{"self":[{"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/posts\/111","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/comments?post=111"}],"version-history":[{"count":0,"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/posts\/111\/revisions"}],"wp:attachment":[{"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/media?parent=111"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/categories?post=111"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wp7.conform-it.fr\/index.php\/wp-json\/wp\/v2\/tags?post=111"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}