{"id":1585,"date":"2025-03-19T10:00:00","date_gmt":"2025-03-19T09:00:00","guid":{"rendered":"https:\/\/2025.latetedansleweb.org\/wordpress\/?p=1585"},"modified":"2025-01-30T16:03:24","modified_gmt":"2025-01-30T15:03:24","slug":"comment-rendre-son-contenu-accessible","status":"publish","type":"post","link":"https:\/\/2025.latetedansleweb.org\/index.php\/2025\/03\/19\/comment-rendre-son-contenu-accessible\/","title":{"rendered":"Comment rendre son contenu accessible sur le web ?"},"content":{"rendered":"\n<h1 class=\"wp-block-heading\"><strong>Comment rendre son contenu accessible sur le web ?<\/strong><\/h1>\n\n\n\n<p>&nbsp;En France, 7 millions de personnes vivent avec un handicap. Pourtant, se balader sur le web reste un parcours sem\u00e9 d\u2019emb\u00fbches pour beaucoup d\u2019entre elles. Selon une \u00e9tude men\u00e9e en 2023 par la Contentsquare Foundation (source : <a href=\"https:\/\/handirect.fr\/wp-content\/uploads\/2023\/11\/Barometre-de-laccessibilite-numerique-2023.pdf\" data-type=\"link\" data-id=\"https:\/\/handirect.fr\/wp-content\/uploads\/2023\/11\/Barometre-de-laccessibilite-numerique-2023.pdf\">Barom\u00e8tre de l\u2019accessibilit\u00e9 num\u00e9rique 2023<\/a>) , <strong>un site web sur deux n\u2019est toujours pas accessible <\/strong>. Heureusement, quelques bonnes pratiques suffisent \u00e0 faire une grande diff\u00e9rence.<\/p>\n\n\n\n<p>D\u00e9couvrez dans cet article <strong>trois actions simples \u00e0 r\u00e9aliser<\/strong> en accessibilit\u00e9 num\u00e9rique inspir\u00e9es de la <a href=\"https:\/\/accessibilite.numerique.gouv.fr\/\">RGAA<\/a> et d\u2019<a href=\"https:\/\/www.accede-web.com\/\">AcceDe Web<\/a><strong> <\/strong>pour rendre vos contenus \u00e0 la port\u00e9e de tous.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. <strong>Optimiser le titre de la page<\/strong><\/h2>\n\n\n\n<p><strong>Le titre d\u2019une page web<\/strong>, visible dans l\u2019onglet du navigateur, r\u00e9sume le contenu de la page. Mais surtout, il fournit aux utilisateurs.rice.s de lecteurs d\u2019\u00e9cran un aper\u00e7u rapide de la page sans qu\u2019ils aient \u00e0 la parcourir.<br>Alors en termes d\u2019accessibilit\u00e9, ce titre doit \u00eatre \u00e0 la fois <strong>court et pr\u00e9cis <\/strong>(entre 50 et 60 caract\u00e8res). C\u2019est simple, il doit pouvoir imm\u00e9diatement r\u00e9pondre \u00e0 la question : \u00ab <em>De quoi parle cette page\u202f?&nbsp;<\/em>\u00bb<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>2. Mettre un texte alternatif \u00e0 vos images<\/strong><\/h2>\n\n\n\n<p>Lorsque des images sont pr\u00e9sentes sur un site web, les utilisateurs.rice.s aveugles ou malvoyants s&rsquo;appuient sur des lecteurs d&rsquo;\u00e9cran pour les interpr\u00e9ter. Ces outils lisent le <strong>texte alternatif <\/strong>associ\u00e9 \u00e0 l&rsquo;image <strong>pour d\u00e9crire son contenu<\/strong>.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Comment les renseigner ?<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Sur les <strong>CMS<\/strong>, vous retrouverez syst\u00e9matiquement <strong>un champ pour mettre du texte alternatif<\/strong> lorsque vous chargez une image.<\/li>\n\n\n\n<li>En<strong> HTML, <\/strong>le texte alternatif sera d\u00e9fini<strong> <\/strong>\u00e0 l\u2019aide de <strong>l\u2019attribut alt <\/strong>au sein de la balise &lt;img&gt;. Par exemple : <em>&lt;img src=\u00a0\u00bbchaton.jpg\u00a0\u00bb <\/em><strong><em>alt=\u00a0\u00bbUn chaton qui dort\u00a0\u00bb<\/em><\/strong><em>&gt;<\/em><\/li>\n<\/ul>\n\n\n\n<p>Pour la remplir, <strong>expliquez bri\u00e8vement ce que montre l&rsquo;image<\/strong>, sans entrer dans les d\u00e9tails inutiles. \u00c9vitez par exemple de commencer par \u00ab Image de&#8230;\u00bb car les outils d&rsquo;assistance savent qu\u2019il s\u2019agit d\u2019une image.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Faut-il toujours renseigner un texte alternatif ?<\/h3>\n\n\n\n<p><strong>Il faut toujours le renseigner<\/strong> <strong>quand l\u2019image a un r\u00f4le dans la compr\u00e9hension du contenu<\/strong>. Il n\u2019est pas utile quand l\u2019image est esth\u00e9tique et n\u2019apporte aucune information.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">3. <strong>Donner un intitul\u00e9 clair \u00e0 votre liens<\/strong><\/h2>\n\n\n\n<p>Les lecteurs d\u2019\u00e9cran lisent aussi les liens ! <strong>Chacun de vos liens doit \u00eatre explicite de son contenu<\/strong>. Comme l\u2019\u00e9nonce la RGAA, \u00ab <em>l\u2019intitul\u00e9 de lien seul doit permettre d\u2019en comprendre la fonction et la destination<\/em> \u00bb. Concr\u00e8tement, le texte du lien doit expliquer <strong>o\u00f9 il m\u00e8ne<\/strong>. Bannissez les intitul\u00e9s vagues comme \u00ab <em>Cliquez ici<\/em> \u00bb et privil\u00e9giez des formulations explicites, telles que \u00ab <em>T\u00e9l\u00e9charger le guide en PDF<\/em> \u00bb.<br><br>Ces pratiques simples \u00e0 appliquer font une r\u00e9elle diff\u00e9rence pour les personnes en situation de handicap naviguant sur le web. Alors, pourquoi ne pas commencer \u00e0 les appliquer d\u00e8s aujourd\u2019hui ?<br><em><br><\/em><strong>Pour aller plus loin autour de l&rsquo;accessibilit\u00e9 dans le web :<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Parcourez <a href=\"https:\/\/2025.latetedansleweb.org\/index.php\/2025\/05\/14\/top-5-des-erreurs-a-eviter-en-accessibilite\/\">notre article regroupant 5 erreurs \u00e0 \u00e9viter en accessibilit\u00e9 sur le web<\/a>.<\/li>\n\n\n\n<li>D\u00e9couvrez dans <a href=\"https:\/\/2025.latetedansleweb.org\/index.php\/2025\/03\/05\/comment-allier-accessibilite-et-esthetique-sur-lux-design\/\">notre autre article comment allier accessibilit\u00e9 et esth\u00e9tique sur l&rsquo;UX Design<\/a><strong>.<\/strong><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Comment rendre son contenu accessible sur le web ? &nbsp;En France, 7 millions de personnes vivent avec un handicap. Pourtant, se balader sur le web reste un parcours sem\u00e9 d\u2019emb\u00fbches pour beaucoup d\u2019entre elles. Selon une \u00e9tude men\u00e9e en 2023 par la Contentsquare Foundation (source : Barom\u00e8tre de l\u2019accessibilit\u00e9 num\u00e9rique 2023) , un site web [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":2810,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_robots_primary_cat":"","_seopress_titles_title":"Comment rendre son contenu accessible sur le web ?","_seopress_titles_desc":"Rendez vos contenus web accessibles gr\u00e2ce \u00e0 trois pratiques cl\u00e9s : structurer avec des titres, ajouter des textes alternatifs et cr\u00e9er des liens explicites.","_seopress_robots_index":"","inline_featured_image":false,"footnotes":""},"categories":[7],"tags":[],"class_list":["post-1585","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles-accessibilite"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/posts\/1585","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/comments?post=1585"}],"version-history":[{"count":9,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/posts\/1585\/revisions"}],"predecessor-version":[{"id":3078,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/posts\/1585\/revisions\/3078"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/media\/2810"}],"wp:attachment":[{"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/media?parent=1585"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/categories?post=1585"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/2025.latetedansleweb.org\/index.php\/wp-json\/wp\/v2\/tags?post=1585"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}