{"id":5063,"date":"2026-05-21T11:23:45","date_gmt":"2026-05-21T09:23:45","guid":{"rendered":"https:\/\/ideance.net\/blog\/?p=5063"},"modified":"2026-05-22T11:41:53","modified_gmt":"2026-05-22T09:41:53","slug":"quand-developpeurs-et-experts-accessibilite-unissent-leurs-forces-interview-croisee","status":"publish","type":"post","link":"https:\/\/ideance.net\/blog\/5063\/quand-developpeurs-et-experts-accessibilite-unissent-leurs-forces-interview-croisee\/","title":{"rendered":"Quand d\u00e9veloppeurs et experts accessibilit\u00e9 unissent leurs forces &#8211; interview crois\u00e9e"},"content":{"rendered":"\n<p class=\"ice-block wp-block-paragraph\">Cette interview a \u00e9t\u00e9 r\u00e9alis\u00e9e par Laur\u00e8ne Bel, responsable de communication chez bluedrop.fr. <a href=\"https:\/\/www.bluedrop.fr\/content\/accessibilite-drupal-rgaa-refonte-sites-toulon-interview-experts\" target=\"_blank\" rel=\"noreferrer noopener\">L&rsquo;interview est \u00e9galement disponible sur le blog bluedrop.fr<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">La Ville de Toulon et la M\u00e9tropole de Toulon ont engag\u00e9 une refonte compl\u00e8te de leurs sites institutionnels respectifs avec un objectif clair : proposer un service num\u00e9rique plus lisible, plus performant\u2026 et surtout plus accessible.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dans le cadre d\u2019un march\u00e9 public, ils ont fait appel \u00e0 diff\u00e9rents prestataires qui ont collabor\u00e9 \u00e9troitement :<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/www.permeable.org\/\" target=\"_blank\" rel=\"noreferrer noopener\">Perm\u00e9able<\/a> pour la conception UX\/UI,<\/li>\n\n\n\n<li><a href=\"https:\/\/www.bluedrop.fr\" data-type=\"link\" data-id=\"https:\/\/www.bluedrop.fr\" target=\"_blank\" rel=\"noreferrer noopener\">bluedrop.fr<\/a> pour le d\u00e9veloppement, l&rsquo;int\u00e9gration et le pilotage technique,<\/li>\n\n\n\n<li><a href=\"https:\/\/ideance.net\/fr\/\" data-type=\"link\" data-id=\"https:\/\/ideance.net\/fr\/\">Ideance<\/a> pour l&rsquo;accompagnement en accessibilit\u00e9 num\u00e9rique et l&rsquo;audit RGAA.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Voici le nouveau <a href=\"https:\/\/toulon.fr\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">site de la Ville<\/a> et celui de la <a href=\"https:\/\/metropoletpm.fr\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">M\u00e9tropole de Toulon<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-style-default\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png-1024x576.webp\" alt=\"\" class=\"wp-image-5071\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png-1024x576.webp 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png-300x169.webp 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png-768x432.webp 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png-18x10.webp 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-toulon-ville-drupal-1.png.webp 1368w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png-1024x576.webp\" alt=\"\" class=\"wp-image-5070\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png-1024x576.webp 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png-300x169.webp 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png-768x432.webp 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png-18x10.webp 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accueil-metropole-toulon-drupal-2.png.webp 1368w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">L&rsquo;accessibilit\u00e9 a \u00e9t\u00e9 trait\u00e9e comme un axe structurant du projet, et ce n&rsquo;est pas un hasard. Les services publics num\u00e9riques ont une obligation l\u00e9gale en la mati\u00e8re : depuis la loi du 11 f\u00e9vrier 2005 pour l&rsquo;\u00e9galit\u00e9 des droits et des chances, renforc\u00e9e par la directive europ\u00e9enne de 2016, les organismes publics sont tenus de rendre leurs sites et applications accessibles \u00e0 toutes et tous, y compris aux personnes handicap\u00e9es. Cette obligation se traduit concr\u00e8tement par le respect du <a href=\"https:\/\/accessibilite.numerique.gouv.fr\/methode\/criteres-et-tests\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">RGAA<\/a>, le R\u00e9f\u00e9rentiel G\u00e9n\u00e9ral d&rsquo;Am\u00e9lioration de l&rsquo;Accessibilit\u00e9, et par la publication d&rsquo;une <strong>d\u00e9claration d&rsquo;accessibilit\u00e9<\/strong>.<br>C&rsquo;est dans ce contexte qu&rsquo;est n\u00e9e une <strong>collaboration \u00e9troite<\/strong> entre les \u00e9quipes de <strong>bluedrop.fr<\/strong> et d&rsquo;<strong>Ideance<\/strong>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Une collaboration au service de l\u2019accessibilit\u00e9<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Nous avons int\u00e9gr\u00e9 l&rsquo;accessibilit\u00e9 au c\u0153ur du processus de conception UX\/UI et de d\u00e9veloppement, d\u00e8s les premi\u00e8res phases du projet.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Cette approche a port\u00e9 ses fruits, comme le confirment les <strong>r\u00e9sultats de l&rsquo;audit<\/strong> : le site de la M\u00e9tropole de Toulon affiche un <strong>taux de conformit\u00e9<\/strong> global de <strong>95,9 %<\/strong> et un <strong>taux moyen<\/strong> de <strong>99,6 %<\/strong>. Des r\u00e9sultats qui t\u00e9moignent du s\u00e9rieux et de l&rsquo;engagement de toute l&rsquo;\u00e9quipe tout au long du projet.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/metropoletpm.fr\/accessibilite\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">D\u00e9claration d\u2019accessibilit\u00e9 M\u00e9tropole de Toulon<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Interview crois\u00e9e Ideance \/ bluedrop.fr<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Pour revenir sur cette collaboration et les enseignements qu&rsquo;on en tire, nous avons \u00e9chang\u00e9 avec<strong> Steven Mouret<\/strong>, expert accessibilit\u00e9 num\u00e9rique chez Ideance, et <strong>Roua\u00efda Roumieh<\/strong>, Responsable du p\u00f4le d\u00e9veloppement front et r\u00e9f\u00e9rente accessibilit\u00e9 chez bluedrop.fr.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Pouvez-vous vous pr\u00e9senter, pr\u00e9senter votre structure et nous expliquer votre lien avec l&rsquo;accessibilit\u00e9 num\u00e9rique\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven :<\/strong> Ideance est un cabinet sp\u00e9cialis\u00e9 en accessibilit\u00e9 num\u00e9rique. Notre mission, c&rsquo;est d&rsquo;accompagner les organisations (entreprises, collectivit\u00e9s, organismes publics) pour rendre leurs services num\u00e9riques accessibles \u00e0 tous : audits RGAA, conseil, formation, accompagnement technique. C&rsquo;est dans ce cadre que j&rsquo;interviens au quotidien.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Mon propre parcours part du d\u00e9veloppement front-end. Je me suis int\u00e9ress\u00e9 \u00e0 l&rsquo;accessibilit\u00e9 d&rsquo;abord en autodidacte, puis j&rsquo;ai pass\u00e9 en 2012 une certification d&rsquo;expert accessibilit\u00e9 web aupr\u00e8s de l&rsquo;association <a href=\"https:\/\/fr.wikipedia.org\/wiki\/BrailleNet\" target=\"_blank\" rel=\"noreferrer noopener\">Braillenet<\/a>, membre du W3C, qui a form\u00e9 une grande partie des experts fran\u00e7ais dans ce domaine. C&rsquo;est d&rsquo;ailleurs de leurs travaux qu&rsquo;est issu le RGAA, le r\u00e9f\u00e9rentiel fran\u00e7ais en vigueur aujourd&rsquo;hui.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ce qui m&rsquo;a profond\u00e9ment marqu\u00e9 dans ce parcours, c&rsquo;est le sens que l&rsquo;accessibilit\u00e9 a donn\u00e9 \u00e0 mon travail. Comprendre que ce qu&rsquo;on d\u00e9veloppe peut r\u00e9ellement changer le quotidien des personnes handicap\u00e9es, \u00e7a transforme la fa\u00e7on d&rsquo;aborder chaque projet. Depuis 2022, j&rsquo;ai rejoint Ideance en tant qu&rsquo;expert accessibilit\u00e9. Mon exp\u00e9rience technique reste un vrai atout pour accompagner les \u00e9quipes de d\u00e9veloppeurs et proposer des solutions concr\u00e8tes adapt\u00e9es \u00e0 chaque technologie.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong> : bluedrop.fr est une agence web sp\u00e9cialis\u00e9e dans la conception UX\/UI, le d\u00e9veloppement et la maintenance de projets web Drupal. On s\u2019int\u00e9resse de pr\u00e8s aux enjeux du web comme l\u2019accessibilit\u00e9, la performance, la s\u00e9curit\u00e9, l\u2019\u00e9co-conception, etc.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Il y a 19 ans, j&rsquo;ai rejoint bluedrop.fr en tant que d\u00e9veloppeuse back-end. Au fur et \u00e0 mesure que la soci\u00e9t\u00e9 grandissait et qu&rsquo;un p\u00f4le front-end se structurait, mon poste a naturellement \u00e9volu\u00e9 dans cette direction, jusqu&rsquo;\u00e0 ce que j&rsquo;en prenne la responsabilit\u00e9 en tant que Responsable du p\u00f4le d\u00e9veloppement front. De la m\u00eame mani\u00e8re, au fil du temps, la question de l&rsquo;accessibilit\u00e9 est devenue partie int\u00e9grante des attentes de nos clients et de nos projets. &nbsp;Dans mon travail, elle est devenue une sp\u00e9cialit\u00e9 \u00e0 part enti\u00e8re. En 2024, j&rsquo;ai suivi une formation d\u00e9di\u00e9e et obtenu une <a href=\"https:\/\/www.bluedrop.fr\/content\/certification-accessibilite-developpement-rgaa\">certification en accessibilit\u00e9 num\u00e9rique<\/a>, et j&rsquo;ai progressivement pris le r\u00f4le de r\u00e9f\u00e9rente accessibilit\u00e9 au sein du p\u00f4le d\u00e9veloppement. \u00c7a veut dire que je ne me contente plus de d\u00e9velopper : je forme aussi mes coll\u00e8gues et je structure nos process internes.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Concr\u00e8tement, en quoi consiste l\u2019accessibilit\u00e9 num\u00e9rique et comment abordez-vous l\u2019accessibilit\u00e9 dans votre travail\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven&nbsp;<\/strong>: Il faut distinguer deux notions qu&rsquo;on confond souvent. D\u2019un c\u00f4t\u00e9, l&rsquo;accessibilit\u00e9 au sens large, c&rsquo;est la capacit\u00e9 d&rsquo;un contenu ou d&rsquo;une fonctionnalit\u00e9 \u00e0 \u00eatre utilis\u00e9 par une personne handicap\u00e9e, qu&rsquo;il soit visuel, moteur, cognitif ou auditif. D\u2019un autre c\u00f4t\u00e9, la conformit\u00e9, elle, c&rsquo;est le respect d&rsquo;une norme : en France, le RGAA. On peut avoir un site conforme qui reste difficile \u00e0 utiliser en pratique, et inversement. Quand je parle de conformit\u00e9, je parle strictement du respect de la norme. Quand je parle d&rsquo;accessibilit\u00e9, je parle d&rsquo;usage r\u00e9el.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ce qui est souvent mal compris, c&rsquo;est que l&rsquo;accessibilit\u00e9 ne concerne pas seulement les personnes aveugles. Elle implique des utilisateurs avec des difficult\u00e9s tr\u00e8s diff\u00e9rentes. Ceux qui naviguent au clavier, ceux qui utilisent la reconnaissance vocale, ceux qui ont besoin d&rsquo;un fort contraste visuel, ou encore ceux qui se servent d&rsquo;une plage braille, un dispositif physique pos\u00e9 sous le clavier, compos\u00e9 de petits picots qui se rel\u00e8vent pour restituer le contenu en braille en temps r\u00e9el.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong> : Concr\u00e8tement, pour nous qui d\u00e9veloppons, cela se traduit par l\u2019application de r\u00e8gles pr\u00e9cises sur la structure HTML, les contrastes de couleurs, les alternatives aux images, la navigation clavier. C&rsquo;est un travail rigoureux, mais qui produit des sites vraiment robustes, compr\u00e9hensibles et utilisables par tous.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Comment int\u00e9grez-vous l\u2019accessibilit\u00e9 dans vos projets\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda&nbsp;<\/strong>: Avant que je me forme, pour les \u00e9quipes de d\u00e9veloppement, l&rsquo;accessibilit\u00e9 repr\u00e9sentait une vraie lourdeur. On nous demandait d&rsquo;appliquer des r\u00e8gles qu&rsquo;on ne comprenait pas vraiment, sans savoir \u00e0 quoi elles servaient ni quel impact elles avaient sur les utilisateurs. On avait l&rsquo;impression de faire deux d\u00e9veloppements en parall\u00e8le, sans en voir le sens.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Apr\u00e8s ma formation, j&rsquo;ai form\u00e9 l&rsquo;\u00e9quipe \u00e0 mon tour. Et l\u00e0, quelque chose a chang\u00e9. Une fois que les d\u00e9veloppeurs ont compris pourquoi on applique ces r\u00e8gles, ce que vivent concr\u00e8tement les personnes qui en d\u00e9pendent, la r\u00e9sistance tombe. On a ensuite pu cr\u00e9er des process structur\u00e9s : l&rsquo;accessibilit\u00e9 est int\u00e9gr\u00e9e d\u00e8s le d\u00e9part dans le d\u00e9veloppement, des tests sont r\u00e9alis\u00e9s en cours de route, et on travaille en parall\u00e8le avec des partenaires comme Ideance sur les points techniques complexes. C&rsquo;est devenu une fa\u00e7on de travailler, pas une contrainte suppl\u00e9mentaire.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven<\/strong> : Ce que dit Roua\u00efda est fondamental, et c&rsquo;est malheureusement un frein que l&rsquo;on rencontre tr\u00e8s souvent. C\u2019est pourquoi la sensibilisation est le point de d\u00e9part incontournable. Un d\u00e9veloppeur \u00e0 qui on demande d&rsquo;appliquer des r\u00e8gles sans lui en expliquer les cons\u00e9quences r\u00e9elles aura du mal \u00e0 les maintenir dans la dur\u00e9e. Quand on comprend qu&rsquo;un bouton sans nom emp\u00eache litt\u00e9ralement un utilisateur naviguant \u00e0 la voix de cliquer dessus, on ne l&rsquo;oublie plus.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Comment s\u2019est organis\u00e9e votre collaboration sur le projet Toulon\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven<\/strong> : On a structur\u00e9 l&rsquo;intervention en plusieurs phases compl\u00e9mentaires. En amont, j&rsquo;ai fourni des ressources de r\u00e9f\u00e9rence et des pr\u00e9conisations techniques cibl\u00e9es sur les points complexes, en tenant compte des contraintes techniques propres au projet et \u00e0 Drupal.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ensuite, on a travaill\u00e9 en mode agile, par sprints. \u00c0 chaque livraison, j&rsquo;intervenais en recette pour v\u00e9rifier l&rsquo;accessibilit\u00e9 des composants d\u00e9velopp\u00e9s. Ce n&rsquo;est pas une v\u00e9rification superficielle : on teste chaque fonctionnalit\u00e9 avec les technologies d&rsquo;assistance r\u00e9elles, on v\u00e9rifie les comportements clavier, les changements d&rsquo;\u00e9tat, les d\u00e9placements de focus. Puis venait la phase d&rsquo;audit formel, suivie d&rsquo;une phase de correction, et enfin le contre-audit pour valider les corrections apport\u00e9es.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ce fonctionnement en accompagnement continu, plut\u00f4t qu&rsquo;un simple audit en fin de projet, permet d&rsquo;anticiper les probl\u00e8mes au lieu de les d\u00e9couvrir trop tard.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong> : De notre c\u00f4t\u00e9, la collaboration a \u00e9t\u00e9 tr\u00e8s fluide. Les recommandations \u00e9taient claires, directement exploitables, et toujours accompagn\u00e9es d\u2019explications.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">On ne recevait pas seulement des consignes, mais une logique de r\u00e9flexion. \u00c7a nous a permis de monter en comp\u00e9tence et de devenir plus autonomes sur le sujet.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Quels ont \u00e9t\u00e9 les principaux d\u00e9fis techniques rencontr\u00e9s\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda <\/strong>: Un des d\u00e9fis a concern\u00e9 les filtres de contenu. On s&rsquo;est demand\u00e9 au d\u00e9part quel composant utiliser : des onglets, un accord\u00e9on, autre chose ? Ce choix initial a des cons\u00e9quences sur l&rsquo;accessibilit\u00e9. La difficult\u00e9 technique, c&rsquo;est que le module Drupal qui g\u00e9rait ces filtres avait une m\u00e9canique de base peu accessible. Il a fallu, tout en conservant ce module, lui ajouter les comportements attendus : navigation clavier, changements d&rsquo;\u00e9tat, comportements de focus. Le fait que la page fonctionne en Ajax, c&rsquo;est-\u00e0-dire que les r\u00e9sultats se mettent \u00e0 jour sans rechargement complet de la page, ne constituait pas un probl\u00e8me en soi, mais n\u00e9cessitait un travail suppl\u00e9mentaire qu&rsquo;on n&rsquo;a habituellement pas \u00e0 faire sur une page classique.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven<\/strong> : Pour rendre \u00e7a concret : imaginez que vous utilisez un site les yeux ferm\u00e9s, guid\u00e9 uniquement par la restitution sonore du lecteur d&rsquo;\u00e9cran. Vous appliquez un filtre. La liste de r\u00e9sultats change \u00e0 l&rsquo;\u00e9cran, mais votre lecteur d&rsquo;\u00e9cran ne vous dit rien. Vous ne savez pas si l&rsquo;action a fonctionn\u00e9, ni ce qui s&rsquo;est pass\u00e9. Est-ce que la page a r\u00e9pondu ? Y a-t-il des r\u00e9sultats ? Lesquels ?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ce qu&rsquo;on a mis en place, c&rsquo;est un message automatique, non visible \u00e0 l&rsquo;\u00e9cran, qui est restitu\u00e9 par le lecteur d&rsquo;\u00e9cran d\u00e8s que la liste se met \u00e0 jour. Ce message indique par exemple le nombre de r\u00e9sultats affich\u00e9s. L&rsquo;utilisateur sait alors que son filtre a bien \u00e9t\u00e9 pris en compte, et peut ensuite naviguer dans la liste pour consulter les nouveaux contenus. Ce n&rsquo;est qu&rsquo;un \u00e9l\u00e9ment parmi d&rsquo;autres, mais il illustre bien la nature du travail : rendre perceptible des informations purement visuelles, pour que chacune et chacun puisse comprendre ce qui se passe sur la page et continuer \u00e0 l&rsquo;utiliser.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Y a-t-il des \u00e9l\u00e9ments dont vous \u00eates particuli\u00e8rement satisfaits\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong>\u00a0: Oui, notamment le travail sur les m\u00e9dias (images). Nous avons mis en place des champs pour les alternatives textuelles, des l\u00e9gendes, des transcriptions enrichies.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><img loading=\"lazy\" decoding=\"async\" width=\"750\" height=\"456\" class=\"wp-image-5069\" style=\"width: 750px;\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png.webp\" alt=\"Pr\u00e9sentation des diff\u00e9rents modules de gestion des m\u00e9dias de la M\u00e9tropole Toulon Provence M\u00e9diterran\u00e9e : Carrousel d'images, images avant\/apr\u00e8s et vid\u00e9o.\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png.webp 1368w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png-300x182.webp 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png-1024x622.webp 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png-768x467.webp 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2026\/05\/accessibilite-image-drupal-metropole-toulon-refonte-2.png-18x12.webp 18w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven&nbsp;<\/strong>: C&rsquo;est un excellent exemple. L&rsquo;exercice s&rsquo;av\u00e8re particuli\u00e8rement exigeant pour les contributeurs, car une m\u00e9connaissance du sujet des images rend la distinction entre ses diff\u00e9rents \u00e9l\u00e9ments floue.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Sans une compr\u00e9hension profonde du sens de l&rsquo;image et des contextes, il devient difficile de concevoir&nbsp;:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>L&rsquo;alternative textuelle : qui doit d\u00e9crire l&rsquo;image.<\/li>\n\n\n\n<li>La l\u00e9gende : qui apporte du contexte \u00e0 l&rsquo;image.<\/li>\n\n\n\n<li>La description d\u00e9taill\u00e9e : qui permet de d\u00e9crire les images \u00e0 fort contenu.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Le risque de confusion est r\u00e9el lorsque le fond n&rsquo;est pas ma\u00eetris\u00e9. C&rsquo;est pr\u00e9cis\u00e9ment l\u00e0 que la formation prend tout son sens : elle doit permettre aux contributeurs d&rsquo;analyser l&rsquo;intention derri\u00e8re l&rsquo;image avant m\u00eame de r\u00e9diger la moindre ligne.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">En quoi consiste l&rsquo;audit d&rsquo;accessibilit\u00e9 RGAA\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven <\/strong>: L&rsquo;audit, c&rsquo;est la v\u00e9rification formelle de la conformit\u00e9. On commence par d\u00e9finir un \u00e9chantillon de pages repr\u00e9sentatives du service : la page d&rsquo;accueil et la page de contact sont obligatoires, on y ajoute \u00e9galement surtout les pages qui refl\u00e8tent les contenus et fonctionnalit\u00e9s cl\u00e9s. Pour Toulon, cela incluait des vues agenda, des actualit\u00e9s, des contenus dits \u00ab\u00a0froids\u00a0\u00bb et \u00ab\u00a0chauds\u00a0\u00bb. Sur cet \u00e9chantillon, on passe en revue l&rsquo;ensemble des crit\u00e8res et tests du RGAA.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">C&rsquo;est un travail majoritairement manuel, et c&rsquo;est important de le comprendre. Beaucoup de crit\u00e8res ne peuvent pas \u00eatre v\u00e9rifi\u00e9s par un outil automatique. Est-ce que l&rsquo;alternative textuelle d&rsquo;une image est pertinente dans son contexte ? Est-ce que la hi\u00e9rarchie des titres a du sens pour un utilisateur&nbsp;? Aucun robot ne peut r\u00e9pondre \u00e0 \u00e7a aujourd&rsquo;hui. C&rsquo;est pour \u00e7a que l&rsquo;audit prend du temps et qu&rsquo;il faut choisir le bon moment pour le lancer : trop t\u00f4t, il remonte des erreurs \u00e9l\u00e9mentaires qui auraient pu \u00eatre corrig\u00e9es bien en amont.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00c0 l&rsquo;issue de l&rsquo;audit, on produit un rapport de conformit\u00e9 pr\u00e9sent\u00e9 \u00e0 toutes les \u00e9quipes (clients et prestataires). Vient ensuite une phase de correction, puis le contre-audit pour valider les corrections apport\u00e9es.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong> : Le contre-audit s&rsquo;est pass\u00e9 tr\u00e8s vite de notre c\u00f4t\u00e9. Les pr\u00e9conisations avaient \u00e9t\u00e9 claires d\u00e8s le d\u00e9part, donc quand il y avait des oublis, on comprenait imm\u00e9diatement ce qu&rsquo;il fallait corriger. La plupart du temps, c&rsquo;\u00e9taient de petites erreurs d&rsquo;inattention, pas des probl\u00e8mes structurels.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven<\/strong> : C&rsquo;est assez rare pour \u00eatre soulign\u00e9 en effet ! Et c&rsquo;est directement li\u00e9 au fait qu&rsquo;on avait travaill\u00e9 ensemble tout au long du projet. Je connaissais les \u00e9quipes, leurs contraintes techniques, et elles ma\u00eetrisaient suffisamment le sujet pour int\u00e9grer les corrections sans allers-retours. On a obtenu des r\u00e9sultats tr\u00e8s proches du 100 % de conformit\u00e9 c\u00f4t\u00e9 d\u00e9veloppement, ce qui montre que c&rsquo;est tout \u00e0 fait atteignable quand chacun joue son r\u00f4le.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Quels b\u00e9n\u00e9fices tirez-vous de cette collaboration\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven <\/strong>: Travailler avec une \u00e9quipe d\u00e9j\u00e0 sensibilis\u00e9e change vraiment la fa\u00e7on dont on peut accompagner. Quand les \u00e9quipes ne connaissent pas le sujet, on se cantonne souvent \u00e0 ce qui est strictement n\u00e9cessaire pour la conformit\u00e9. Avec bluedrop.fr, on a pu aller plus loin : r\u00e9fl\u00e9chir \u00e0 l&rsquo;ergonomie pour les utilisateurs r\u00e9els, pas seulement cocher des crit\u00e8res. C&rsquo;est une approche qu&rsquo;on n&rsquo;a pas toujours la chance d&rsquo;adopter avec des \u00e9quipes moins matures sur l\u2019accessibilit\u00e9.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda <\/strong>: Pour nous, c&rsquo;\u00e9tait une premi\u00e8re collaboration de ce type et on avait quelques appr\u00e9hensions. Mais l&rsquo;\u00e9change a toujours \u00e9t\u00e9 fluide. Ce qui m&rsquo;a le plus marqu\u00e9e, c&rsquo;est la p\u00e9dagogie de Steven : il ne se contentait pas simplement de r\u00e9pondre \u00e0 nos questions, il expliquait le raisonnement derri\u00e8re. Aujourd&rsquo;hui, quand je tombe sur un point complexe, je me demande comment il l&rsquo;analyserait. Parfois je trouve la r\u00e9ponse toute seule. C&rsquo;est une fa\u00e7on de transmettre qui laisse des traces.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Un conseil pour les collectivit\u00e9s qui souhaitent se lancer\u00a0?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Steven <\/strong>: Sensibilisez t\u00f4t, et sensibilisez tout le monde, pas seulement les d\u00e9veloppeurs. Du d\u00e9cideur au contributeur, chacun a un r\u00f4le \u00e0 jouer. Int\u00e9grez l&rsquo;accessibilit\u00e9 dans vos march\u00e9s publics : demandez des preuves, des rapports d&rsquo;audit, v\u00e9rifiez que vos prestataires ont une vraie politique en la mati\u00e8re. Formez vos \u00e9quipes avant de lancer un audit, parce qu&rsquo;un audit trop pr\u00e9coce ne fait que constater des erreurs qui auraient pu \u00eatre \u00e9vit\u00e9es.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Et n&rsquo;attendez pas d&rsquo;avoir un r\u00e9sultat parfait pour publier une d\u00e9claration d&rsquo;accessibilit\u00e9. La loi pr\u00e9voit de d\u00e9clarer qu&rsquo;on est en cours de mise en conformit\u00e9. Ce qui compte, c&rsquo;est d&rsquo;avancer. La loi date de 2005, mais il n&rsquo;est jamais trop tard pour commencer, et l&rsquo;accessibilit\u00e9 est de toute fa\u00e7on un travail continu. Un audit donne un \u00e9tat \u00e0 un instant T. D\u00e8s le lendemain, si des contenus sont publi\u00e9s sans respecter les r\u00e8gles, la conformit\u00e9 \u00e9volue. C&rsquo;est pour \u00e7a qu&rsquo;il faut l&rsquo;ancrer dans les pratiques de toutes vos \u00e9quipes, au m\u00eame titre que la qualit\u00e9 ou la performance.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Roua\u00efda<\/strong> : Tout \u00e0 fait d\u2019accord. On n&rsquo;imaginerait pas livrer un site sans design. Alors pourquoi livrerait-on un site sans accessibilit\u00e9 ? C&rsquo;est un standard de qualit\u00e9, pas une contrainte suppl\u00e9mentaire. \u00c7a doit faire partie de l&rsquo;ADN du projet, au m\u00eame titre que le fonctionnel.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Vous souhaitez am\u00e9liorer l\u2019accessibilit\u00e9 de votre site et recherchez un partenaire pour la conception et le d\u00e9veloppement de sites Drupal accessibles ?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">L\u2019accessibilit\u00e9 ne s\u2019improvise pas : elle se construit d\u00e8s la conception et s\u2019\u00e9value tout au long du projet. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">bluedrop.fr, accompagne les organisations publiques et priv\u00e9es dans la conception et le d\u00e9veloppement de sites Drupal accessibles et conformes au RGAA. Vous pouvez <a href=\"https:\/\/www.bluedrop.fr\/content\/contact\" target=\"_blank\" rel=\"noreferrer noopener\">contacter l&rsquo;\u00e9quipe bluedrop.fr via leur formulaire de contact<\/a>. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Et si vous souhaitez \u00eatre accompagn\u00e9 pour la mise en accessibilit\u00e9 de vos services num\u00e9riques, <a href=\"mailto:contact@ideance.fr\">contactez l&rsquo;\u00e9quipe Ideance<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>bluedrop.fr et Ideance accompagnent la ville de Toulon et la M\u00e9tropole Toulon Provence M\u00e9diterran\u00e9e dans la conception et le mise en accessibilit\u00e9 de leur sites.<\/p>\n","protected":false},"author":19,"featured_media":5092,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[20,26,10,14],"tags":[],"class_list":["post-5063","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-audit","category-gestion-de-projets","category-ideance","category-rgaa"],"acf":[],"_links":{"self":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/5063","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/comments?post=5063"}],"version-history":[{"count":21,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/5063\/revisions"}],"predecessor-version":[{"id":5091,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/5063\/revisions\/5091"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/media\/5092"}],"wp:attachment":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/media?parent=5063"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/categories?post=5063"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/tags?post=5063"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}