https://alexis-degryse.com/prestations/accessibilite-numerique/

1<!DOCTYPE html> <html lang="fr"> <head> <title>Accessibilité numérique - Prestations - Alexis Degryse </title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="description" content="Vous souhaitez mettre en place une démarche d’amélioration de l’accessibilité sur votre projet ? Sensibilisation, audit, accompagnement."> <link rel="icon" href="/favicon.svg" type="image/svg+xml"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="icon" type="image/png" href="/favicon-dark.png" media="(prefers-color-scheme: dark)"> <link rel="icon" type="image/png" href="/favicon-light.png" media="(prefers-color-scheme: light)"> <link rel="icon" href="/favicon.ico" type="image/x-icon"> <link href="/dest/css/styles.min.css" rel="stylesheet" media="all"> <link href="/dest/css/styles-sm.min.css" rel="stylesheet" media="(min-width: 36rem)"> <link href="/dest/css/styles-md.min.css" rel="stylesheet" media="(min-width: 48rem)"> <link href="/dest/css/styles-lg.min.css" rel="stylesheet" media="(min-width: 75rem)"> <link href="/dest/css/pages/prestations.min.css" rel="stylesheet"> <link href="/dest/css/pages/accessibilite.min.css" rel="stylesheet"> <meta property="og:site_name" content="Alexis Degryse - Conception web et accessibilité numérique"> <meta property="og:image" content="https://alexis-degryse.com/dest/img/og.png"> <meta property="og:image:width" content="2250"> <meta property="og:image:height" content="1200"> <meta property="og:type" content="website"> <meta property="og:url" content="https://alexis-degryse.com/prestations/accessibilite-numerique"> <meta property="og:title" content="Accessibilité numérique - Prestations - Alexis Degryse"> <meta property="og:description" content="Vous souhaitez mettre en place une démarche d’amélioration de l’accessibilité sur votre projet ? Sensibilisation, audit, accompagnement."> </head> <body> <nav class="skip-links" role="navigation" aria-label="Liens d'accès rapide"> <p><a href="#contenu">Aller au contenu principal</a> <a href="#pied-de-page">Aller au pied de page</a></p> </nav> <header class="header" role="banner"> <div class="container pos-relative pt md:pt-0"> <div class="row align-center"> <div class="col-auto"> <div class="logo"><img src="/dest/img/svg/logo.svg" alt="" width="52" height="76"> <div><span> <a href="/" aria-label="Alexis Degryse, retour à l'accueil">Alexis Degryse</a>&nbsp;</span><span>Intégrateur web<br><span aria-hidden="true">&nbsp;·&nbsp;</span>Accessibilité numérique </span></div> </div> </div> <div class="col-12 md:col-auto ml-a md:mx-a lg:col lg:pl-4 pos-static pt"> <nav class="menu" role="navigation" aria-label="Principale"> <button class="md:d-none js-disclosure" type="button" aria-controls="menu" aria-expanded="false"> <svg class="icon" aria-hidden="true" viewBox="0 0 13 7"> <rect></rect> <rect></rect> <rect></rect> </svg>Menu </button> <ul role="list" id="menu"> <li><a href="/a-propos">À propos</a></li> <li> <button class="btn-as-link js-disclosure" type="button" aria-expanded="false" aria-controls="prestations-nav"> Prestations <svg class="icon chevron ml-a" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-down"></use> </svg> </button> <ul id="prestations-nav" role="list"> <li><a href="/prestations/creation-sites-web">Création de sites web</a></li> <li><a href="/prestations/accessibilite-numerique" aria-current="page">Accessibilité numérique</a></li> <li><a href="/prestations/audit-qualite-web">Audit qualité web</a></li> </ul> </li> <li><a href="/contact">Contact </a></li> </ul> </nav> </div> </div> </div> </header> <main id="contenu" role="main"> <div class="container lg:pb-4"> <h1>Accessibilité numérique</h1> <div class="row justify-center"> <div class="col-12 md:col-10 lg:col-8"> <section class="border border-2 border-primary-light radius bg-primary-lightest p py-2 md:p-3 mb-2"> <h2 class="h4 lh-base text-center"> <svg class="text-primary-light mr-0.5" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-right"></use> </svg>Mise à jour importante <svg class="text-primary-light ml-0.5" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-left"></use> </svg> </h2> <p>Ayant rejoint <a href="https://ideance.net/" class="text-primary-dark">Ideance</a> (société d’expertise en accessibilité numérique et handicap en entreprise) depuis mai 2025, je ne propose plus de prestation facturée sur ce sujet de l’accessibilité (sauf exception, pour des associations, par exemple).</p> <p><b>Cependant</b>, si vous avez une demande de devis ou tout autre besoin d’informations, je continuerai de <a href="/contact" class="text-primary-dark">vous répondre</a> et vous proposerai d’échanger avec vous sur la façon dont Ideance peut vous accompagner dans votre projet.</p> </section> </div> </div> <p class="h4 fw-regular text-system lh-base md:text-center">Vous souhaitez mettre en place une démarche d’amélioration de l’<strong>accessibilité</strong> sur votre projet ?<br>Je peux <strong class="highlighted-term">sensibiliser</strong> vos équipes, <strong class="highlighted-term">auditer</strong> des livrables graphiques ou développements existants, ou tout simplement vous <strong class="highlighted-term">accompagner</strong> et vous conseiller tout au long de la vie de votre projet.</p> <div class="row justify-center"> <div class="col-12 md:col-10 lg:col-8"> <section class="border border-2 border-secondary-light radius bg-secondary-lightest p py-2 md:p-3 my-2 md:my-3 text-center"> <h2 class="h4 lh-base">Vous ne savez pas en quoi consiste l’accessibilité numérique ? </h2> <button class="btn btn--white btn--sm mt-0.5 js-disclosure" type="button" aria-expanded="false" aria-controls="what-is-a11y"> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-right"></use> </svg>Je vous explique </button> <div id="what-is-a11y"> <div class="text-left pt-2 md:pt-3"> <h3 class="h4">Contexte</h3> <p>Le numérique c’est trop chouette ! Il facilite la recherche d’emploi, l’accè

1s à l’information, les déplacements, l’apprentissage, etc. Bref, il apporte de l’autonomie et permet de participer plus facilement à la vie sociale et citoyenne.</p> <p><b>Vraiment ?</b> </p> <p><b>Oui ! Mais seulement si</b> ce numérique est pensé dans sa conception pour tout le monde. </p> <p>Or, un trop grand nombre de produits et services numériques conçus, aujourd’hui et depuis des années, sans prendre en compte les personnes handicapées excluent cette large partie de la population du paysage numérique, restreignant leur participation à la société, instaurant ainsi un environnement discriminant sur tous les plans (social, citoyen, culturel, etc.)</p> <h3 class="h4">Quelques chiffres</h3> <p>En France, on estime à 18% la part de la population française présentant une forme ou une autre de handicap, soit environ <b>12 millions de français et françaises</b> (autrement dit 1 personne sur 6 !).</p> <p>En 2023, 95,9% des pages d'accueil des 1.000.000 sites les plus visités présentent au moins une erreur d'accessibilité détectable automatiquement (Source : <a href="https://webaim.org/projects/million/" lang="en" aria-describedby="english-content">The WebAIM Million</a>).</p> <h3 class="h4">Constat</h3> <p>Au lieu de favoriser l’inclusion, <b>le numérique devient finalement un vecteur d’exclusion</b> pour la plus grande minorité au monde : les personnes handicapées.</p> <p>L’<strong>accessibilité numérique</strong> signifie alors que les <strong>personnes handicapées</strong> peuvent <b>utiliser</b> le <strong>web</strong>, c’est-à-dire qu’elles peuvent percevoir, comprendre, naviguer, interagir avec le web et y contribuer.</p> <p>L’accessibilité sert aussi aux personnes âgées. Avec l’âge peuvent survenir une baisse progressive de l’acuité visuelle et auditive, une diminution de la dextérité, une altération de nos capacités cognitives, etc.</p> <h3 class="h4">Historique</h3> <p>Elle est un <strong>droit fondamental</strong> issu du principe d’égalité des droits et des chances en faveur des personnes handicapées, inscrit à l’<strong>ONU</strong> depuis <b>2006</b> (<a href="https://www.ohchr.org/fr/instruments-mechanisms/instruments/convention-rights-persons-disabilities">Convention relative aux droits des personnes handicapées</a>) et dans la <strong>loi française</strong> depuis <b>2005</b>. </p> <p>Elle découle également du principe d’universalité voulu à la naissance du web par son inventeur il y a 30 ans (« <a href="https://www.w3c.fr/a-propos-du-w3c-france/la-mission-du-w3c/">un seul web partout et pour tous</a> »).</p> <p>En France, l’<a href="https://www.legifrance.gouv.fr/loda/article_lc/LEGIARTI000048050213">article 47 de la loi du 11 février 2005</a> pour « l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées » et le <a href="https://www.legifrance.gouv.fr/jorf/id/JORFTEXT000038811937">décret d’application n°2019-768</a> du 24 juillet 2019 obligent les personnes morales de droit public et certaines entreprises privées à prendre en compte l’accessibilité dans leur stratég

1ie numérique, notamment par la mise en conformité aux règles établies par le RGAA et la publication d’une déclaration d’accessibilité et d’un schéma pluriannuel de mise en accessibilité.</p> </div> </div> </section> </div> </div> <div class="row justify-center py-2"> <div class="col-8 md:col-4 lg:col-5"><img class="mx-a" src="/dest/img/svg/accessibilite-sensibilisation.svg" alt="" width="300" height="300"></div> <section class="col-12 md:col-8 lg:col-6"> <h2 class="h3 text-center md:text-left"><span class="highlighted-term">Sensibilisation</span> aux fondamentaux de l'accessibilité numérique</h2> <p>La vocation de cette sensibilisation est d’apporter les bases fondamentales au sujet de l’accessibilité numérique afin d’assimiler son historique, comprendre ses enjeux humains, connaître les besoins et les technologies d’assistance des personnes handicapées, appréhender le cadre légal, découvrir les normes et référentiels, acquérir un début de socle de bonnes pratiques impactantes non coûteuses et ses bénéfices.</p> <ul> <li><b>Format</b> : distanciel</li> <li><b>Durée</b> : 2 à 3 heures</li> <li><b>Tarif</b> : sur devis <span class="fs-smaller">(TVA non applicable, article 293 B du CGI)</span></li> <li><b>Profil</b> : tout profil ! Aucun prérequis nécessaire (si ce n'est vouloir oeuvrer pour un web plus éthique)</li> <li><b>Programme</b> : <ol> <li>Découvrir l'accessibilité numérique <span class="fs-4">— Définitions, historique</span></li> <li>État de la situation <span class="fs-4">— Les types de handicaps, besoins et outils, chiffres, études</span></li> <li> Normes techniques <span class="fs-4">— <button class="tooltip" id="w3c-toggle" popovertarget="w3c-meaning" style="anchor-name:--w3c-anchor" lang="en">W3C</button><span id="w3c-meaning" popover anchor="w3c-toggle" style="position-anchor:--w3c-anchor" lang="en">World Wide Web Consortium</span>, <button class="tooltip" id="wai-toggle" popovertarget="wai-meaning" style="anchor-name:--wai-anchor" lang="en">WAI</button><span id="wai-meaning" popover anchor="wai-toggle" style="position-anchor:--wai-anchor" lang="en">Web Accessibility Initiative</span>, <button class="tooltip" id="wcag-toggle" popovertarget="wcag-meaning" style="anchor-name:--wcag-anchor" lang="en">WCAG</button><span id="wcag-meaning" popover anchor="wcag-toggle" style="position-anchor:--wcag-anchor" lang="en">Web Content Accessibility Guidelines</span>, <button class="tooltip" id="rgaa-toggle" popovertarget="rgaa-meaning" style="anchor-name:--rgaa-anchor">RGAA</button><span id="rgaa-meaning" popover anchor="rgaa-toggle" style="position-anchor:--rgaa-anchor">Référentiel général d'amélioration de l'accessibilité</span></span> </li> <li>La législation en France <span class="fs-4">— Obligations, entités concernées, sanctions, autorités de contrôle</span></li> <li>Focus sur le RGAA <span class="fs-4">— Méthodologie, conformité, réflexion et pondération</span></li> <li>« <span lang="en">Solid start</span> » <span class="fs-4">— Par où commencer en tant que concepteur ?</span></li> <li>Mythes et idées reçues <span class="fs-4">— Coût, design, responsabilités, cible</span></li> </ol> </li> </ul> </section> </div> <div class="row justify-center d-none md:d-flex py text-center"> <div class="md:col-8 lg:col-6 md:offset-4 lg:offset-5"> <hr class="border-lightgrey"> </div> </div> <div class="row justify-center py-2"> <div class="col-8 md:col-4 lg:col-5"><img class="mx-a" src="/dest/img/svg/accessibilite-audit.svg" alt="" width="300" height="300"></div> <section class="col-12 md:col-8 lg:col-6"> <h2 class="h3 text-center md:text-left"><span class="highlighted-term">Audit</span> d’accessibilité numérique</h2> <p><a href="https://certificate.bcdiploma.com/check/9329046CD54F5D79A35C2AAC63B752CA2CBB1166426AD12E5C4FF99DD2C7E27DZkcwTXd0cUl2K3gxdUllNHFNSkpIZFM2aEt5cnZkbjlUcWZoL3VYTDZ1c0tRZk1J">Consulter ma certification d'auditeur</a></p> <h3 class="h4">Audit rapide</h3> <p>Obtenez un diagnostic type « état des lieux » de votre site afin d’avoir une appréciation générale du niveau d’accessibilité.</p> <h3 class="h4">Audit de livrables UI/UX</h3> <p>Pour <span lang="en">wireframes</span>, maquettes, styles guide, <span lang="en">design system</span>.</p> <ul> <li>Analyse sur base de critères RGAA applicables</li> <li>Rapport des relevés d’erreurs ou de manquements</li> <li>Recommandations afin d’éviter de la dette d’accessibilité avant la phase de développement et d’intégration</li> </ul> <h3 class="h4">Audit de conformité RGAA</h3> <ul> <li>Analyse de votre site basée sur les 106 critères du RGAA</li> <li>Grille de conformité</li> <li>Synthèse d’audit contenant, pour chaque principale non-conformité : <ul> <li>des explications des impacts sur les utilisateurs</li> <li>des recommandations et/ou corrections à réaliser</li> </ul> </li> <li>Atelier de restitution pour les points les plus bloquants</li> <li>Rédaction de la déclaration d’accessibilité</li> </ul> </section> </div> <div class="row justify-center d-none md:d-flex py text-center"> <div class="md:col-8 lg:col-6 md:offset-4 lg:offset-5"> <hr class="border-lightgrey"> </div> </div> <div class="row justify-center py-2"> <div class="col-8 md:col-4 lg:col-5"><img class="mx-a" src="/dest/img/svg/accessibilite-accompagnement.svg" alt="" width="300" height="300"></div> <section class="col-12 md:col-8 lg:col-6"> <h2 class="h3 text-center md:text-left"><span class="highlighted-term">Accompagnement</span> et conseils</h2> <p><a href="https://certificate.bcdiploma.com/check/921E87207432C080C751E426575A0C8DB9F9D647EEDE4F5D95B1090AD3C8DD04RWwzNXA3Y2RYbWtYUTl0N2UvRkZqblRraXplbkcxZVZCVXZpd05URHYrVEVFZUFl">Consulter ma certification de développeur</a></p> <ul> <li>Conception accessible de composants</li> <li>Suivi de projets</li> <li>Aide à la conception ou corrections post-audit </li> </ul> </section> </div> </div> <section class="bg-primary"> <div class="container text-center py-3 lg:py-4 mt-2 lg:mt-0"> <h2 class="text-white">Vous souhaitez recevoir un devis ?</h2> <p class="text-white h3 text-system fw-regular lh-base">Ou simplement avoir plus de renseignements ?</p><a class="btn btn--white mt" href="/contact"> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-envelop"></use> </svg>Discutons-en !</a> </div> </section> </main> <footer class="footer" role="contentinfo" id="pied-de-page"> <svg class="d-none md:d-block" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2560 240" preserveAspectRatio="none" aria-hidden="true"> <path d="M2103.79,197.44C1837.02,153.6,1662.56,66.67,1490.78,30.56c-164.51-34.69-336.12-32.67-501.01,0.78-115.68,23.47-227.33,62.14-343.78,83.72A1288.44,1288.44,0,0,1,0,54.7V256H2560V204.44C2413.87,253.87,2240.65,237.43,2103.79,197.44Z"></path> </svg> <div class="bg-primary-dark text-white"> <div class="container py-3"> <div class="row"> <div class="col-12 md:col-4 lg:col-6"> <div class="row"> <div class="col-auto d-none lg:d-block"> <img class="footer-logo" src="/dest/img/svg/logo.svg" alt="" width="52" height="76"></div> <div class="col"> <p class="h3 fw-bold">Alexis Degryse</p> <p> Entrepreneur individuel<br> Intégrateur web freelance basé à Lille<br> Consultant en accessibilité numérique<br> SIREN 931 007 991 - APE 6201Z </p> <p> <svg class="text-primary-light mr-0.5 fs-larger va-m" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-envelop"> </use> </svg><a href="mailto:[email protected]">[email protected]</a> </p> <div id="ecoindex-badge"></div> 

1<script src="https://cdn.jsdelivr.net/gh/cnumr/ecoindex_badge@3/assets/js/ecoindex-badge.js" defer="defer"></script>

1 </div> </div> </div> <div class="col-12 md:col-4 lg:col-3 py-2 md:py-0"> <h2 class="h3">Mes réseaux</h2> <ul class="row" role="list"> <li class="col-auto pr"><a class="h1 text-white" href="https://bsky.app/profile/twogrey.bsky.social" rel="me"> <span class="sr-only">Bluesky</span> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-bluesky"> </use> </svg></a></li> <li class="col-auto pr"><a class="h1 text-white" href="https://h4.io/@twogrey" rel="me"> <span class="sr-only">Mastodon</span> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-mastodon"> </use> </svg></a></li> <li class="col-auto pr"><a class="h1 text-white" href="https://www.linkedin.com/in/alexis-degryse/" rel="me"> <span class="sr-only">LinkedIn</span> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-linkedin"> </use> </svg></a></li> <li class="col-auto pr"><a class="h1 text-white" href="https://codepen.io/twogrey" rel="me" aria-describedby="english-content"> <span class="sr-only">Codepen</span> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-codepen"> </use> </svg></a></li> </ul> </div> <div class="col-12 md:col-4 lg:col-3"> <h2 class="h3">Liens utiles</h2> <ul class="nmt-0.25"> <li class="py-0.25"><a href="/contact">Contact</a></li> <li class="py-0.25"><a href="/mentions-legales">Mentions légales</a></li> <li class="py-0.25"><a href="/credits">Crédits</a></li> <li class="py-0.25"><a href="/plan-du-site">Plan du site</a></li> </ul> </div> </div> </div> </div> </footer> <div hidden> <div id="new-window">Ce lien ouvre un nouvel onglet.</div> <div id="english-content">En anglais.</div> </div> 

1<script src="/dest/js/scripts.min.js"></script>

1 

1<script src="/dest/js/components/disclosure.min.js"></script>

1 

1<script async defer="defer" src="https://scripts.withcabin.com/hello.js"></script>

1 </body> </html>