https://alexis-degryse.com/

1<!DOCTYPE html> <html lang="fr"> <head> <title>Alexis Degryse - Conception web et accessibilité numérique </title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="description" content="Je vous accompagne dans la création de votre site web et votre démarche de prise en compte de l’accessibilité numérique."> <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/index.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"> <meta property="og:title" content="Alexis Degryse - Conception web et accessibilité numérique"> <meta property="og:description" content="Je vous accompagne dans la création de votre site web et votre démarche de prise en compte de l’accessibilité numérique."> </head> <body class="index-page"> <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">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"> <section> <div class="container lg:pt-2"> <div class="row align-center justify-center"> <div class="col-12 lg:col-5 py-3 lg:pt-2 lg:pb-4"> <h1 class="h2">Intégrateur web soucieux de l’assurance qualité web <span class="text-secondary" aria-hidden="true">●</span></h1> <p class="h3 fw-regular text-system lh-base">Je vous accompagne dans la création de votre site web et votre démarche de prise en compte de l’accessibilité numérique.</p> <div class="row"> <div class="col-auto"><a class="btn btn--primary" href="#prestations"> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-sparkles"></use> </svg>Mes prestations</a></div> <div class="col-auto"><a class="btn btn--grey" href="/contact"> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-envelop"></use> </svg>Me contacter</a></div> </div> </div> <div class="col-12 md:col-9 lg:col-7 align-end-self"><img src="/dest/img/svg/illustration-homepage.svg" width="706" height="519" alt=""></div> </div> </div> </section> <section id="prestations"> <div class="container pb-3 lg:pb-4"> <h2 class="py-3 mb-0 text-center">Mes prestations</h2> <div class="row justify-center"> <div class="col-12 md:col-6 lg:col-4"> <article class="d-flex flex-column align-center bg-white p-2 radius text-center h-100"><img src="/dest/img/svg/prestation-site.svg" width="240" height="200" loading="lazy" alt=""> <h3 class="text-primary-dark">Création de sites web</h3> <div class="text-left mb-2"><p>

1Vous avez des maquettes graphiques (ou un thème de CMS) prêtes à être intégrées pour démarrer le développement de votre nouveau site ?</p><p><b>Je réalise vos pages web</b> de manière respectueuse des standards de <strong>qualité web</strong>.</p></div><a class="btn btn--primary mt-a" href="/prestations/creation-sites-web"> <svg class="p-0.5" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-right"></use> </svg>Créer mon site</a> </article> </div> <div class="col-12 md:col-6 lg:col-4"> <article class="d-flex flex-column align-center bg-white p-2 radius text-center h-100"><img src="/dest/img/svg/prestation-accessibilite.svg" width="221" height="200" loading="lazy" alt=""> <h3 class="text-primary-dark">Accessibilité numérique</h3> <div class="text-left mb-2"><p>Vous souhaitez mettre en place une démarche d’amélioration de l’accessibilité sur votre projet ?</p><p>Je peux <strong>sensibiliser</strong> vos équipes, <strong>auditer</strong> des livrables graphiques ou développements existants, ou tout simplement vous <strong>accompagner</strong> et vous conseiller tout au long de la vie de votre projet.</p></div><a class="btn btn--primary mt-a" href="/prestations/accessibilite-numerique"> <svg class="p-0.5" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-right"></use> </svg>Se faire accompagner</a> </article> </div> <div class="col-12 md:col-6 lg:col-4"> <article class="d-flex flex-column align-center bg-white p-2 radius text-center h-100"><img src="/dest/img/svg/prestation-qualite-web.svg" width="145" height="200" loading="lazy" alt=""> <h3 class="text-primary-dark">Audit qualité web</h3> <div class="text-left mb-2"><p>Vous avez déjà un site web ? Je peux vous rédiger un compte-rendu des manquements relatifs à l’<strong>assurance qualité web</strong>.</p><p>Et ainsi vous proposer des pistes de <strong>corrections</strong> et d’<strong>améliorations</strong> en matière d’accessibilité, de SEO, d’éco-conception, d’ergonomie, de respect des données personnelles, d’éditorial, et bien d’autres.</p></div><a class="btn btn--primary mt-a" href="/prestations/audit-qualite-web"> <svg class="p-0.5" aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-chevron-right"></use> </svg>Auditer mon site</a> </article> </div> </div> </div> </section> <section class="bg-white"> <div class="container py-3 lg:py-4"> <div class="row justify-evenly"> <div class="col-12 sm:col-8 md:col-7"> <h2 class="text-center sm:text-left">Qui suis-je ?</h2> <p>Je m’appelle <strong>Alexis</strong>, 35 ans, jeune papa, gaga des animaux, baigné dans la culture populaire japonaise des années 90, rêvant d’un numérique responsable, j’ai la chance d’exercer le métier d’<strong>intégrateur web</strong> depuis une quinzaine d'années, ainsi que, plus récemment, le métier de <strong>consultant en accessibilité numérique</strong> depuis 2025.</p> <p>Passionné depuis toujours par ce que le web est en mesure d’apporter au monde, je suis féru de <strong>HTML</strong> et <strong>CSS</strong> depuis mes débuts.<br>Ces langages, faciles à utiliser mais difficiles à maitriser, sont mes outils au quotidien et constituent le fil principal de ma veille. J’adore discuter de sémantique, d’animations, de SEO, d’accessibilité, d’éco-conception, de responsive et d'ergonomie.</p><a class="btn btn--grey" href="/a-propos"> <svg aria-hidden="true"> <use xlink:href="/dest/img/sprite.svg#icon-user"></use> </svg>En apprendre plus</a> </div> <div class="col-8 sm:col-4 md:col-5 sm:order-first align-center-self pt sm:pt-0" style="container-type: inline-size"> <div class="photo"><img src="/dest/img/photo-about-1.webp" alt="" loading="lazy" width="342" height="700"></div> </div> </div> </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>