{"id":8844,"date":"2025-05-17T17:46:18","date_gmt":"2025-05-17T15:46:18","guid":{"rendered":"https:\/\/www.creativejuiz.fr\/blog?p=8844"},"modified":"2025-05-17T17:50:30","modified_gmt":"2025-05-17T15:50:30","slug":"figma-sites-une-belle-promesse-encore-inaccessible","status":"publish","type":"post","link":"https:\/\/www.creativejuiz.fr\/blog\/ux-experience-utilisateur\/figma-sites-une-belle-promesse-encore-inaccessible","title":{"rendered":"Figma Sites, une belle promesse\u2026 encore inaccessible\u00a0?"},"content":{"rendered":"\n

Le 08 mai dernier, Figma a lev\u00e9 le voile<\/a> sur plusieurs nouveaut\u00e9s dont Figma Sites<\/span>, une fonctionnalit\u00e9 qui promet de r\u00e9volutionner la cr\u00e9ation de sites web directement depuis leur interface de design. \u00c0 ses c\u00f4t\u00e9s, Figma Make<\/bdo><\/span> (AI & Code) , Figma Buzz<\/bdo><\/span> (composant communautaire \u00e0 la Canva) et Figma Draw<\/bdo> (dessin vectoriel) ajoutent de nouvelles cordes \u00e0 l\u2019arc de la plateforme.<\/p>\n\n\n\n\n\n\n\n

Pourtant, en tant que designer attentif \u00e0 l\u2019accessibilit\u00e9 num\u00e9rique, une chose saute aux yeux d\u00e8s les premi\u00e8res minutes de test : si l\u2019intention est belle, la base m\u00eame de l\u2019accessibilit\u00e9 est encore tr\u00e8s bancale, voire b\u00e2cl\u00e9e. Certes, Figma permet d\u00e9j\u00e0 d\u2019utiliser quelques balises s\u00e9mantiques comme <header><\/code>, <footer><\/code>, <section><\/code> ou encore les niveaux de titres (h1<\/code>, h2<\/code>, h3<\/code>). Mais bien d’autres \u00e9l\u00e9ments essentiels brillent par leur absence : pas de balises de liste (ul<\/code>, ol<\/code>, li<\/code>), pas de tableau (table<\/code>, thead<\/code>, th<\/code>, td<\/code>), pas d’attributs personnalis\u00e9s (hreflang, lang, dir, etc.) et surtout, pas de formulaire (form<\/code>, input<\/code>, label<\/code>, button<\/code>, etc.). C\u00f4t\u00e9 attributs ARIA ? C\u2019est le d\u00e9sert.<\/p>\n\n\n\n

Pour effectuer mon test<\/a>, j’ai ouvert l’un des exemples fourni par Figma Sites, et j’ai utilis\u00e9 un maximum d’outils mis \u00e0 disposition par Figma pour rendre le site moins inaccessible.<\/p>\n\n\n\n

Cet article n\u2019a pas pour but de fustiger un outil encore en b\u00eata, mais bien de souligner des priorit\u00e9s essentielles. Car pendant que du temps est investi dans des effets de rotation ou d\u2019animation cosm\u00e9tique, l\u2019acc\u00e8s \u00e0 l\u2019information \u2013 fondement m\u00eame du web \u2013 est n\u00e9glig\u00e9. Il serait dommage que ce nouvel outil, aussi prometteur soit-il, parte sur des bases excluantes d\u00e8s sa naissance.<\/p>\n\n\n\n

Voici donc une lecture critique et constructive de Figma Sites, avec pour ambition d\u2019aider la plateforme \u00e0 \u00e9voluer dans le bon sens : celui de tous les utilisateurs.<\/p>\n\n\n\n

\n

Sommaire<\/h2>\n\n\n\n
    \n
  1. L’importance de l’accessibilit\u00e9 en design web<\/a><\/li>\n\n\n\n
  2. Ce que Figma offre aujourd’hui<\/a><\/li>\n\n\n\n
  3. Les manques flagrants dans Figma Sites (\u00e0 date)<\/a><\/li>\n\n\n\n
  4. Quand l\u2019esth\u00e9tique prend le pas sur l\u2019essentiel<\/a><\/li>\n\n\n\n
  5. Figma, vous tenez quelque chose : suggestions concr\u00e8tes<\/a><\/li>\n<\/ol>\n<\/div><\/div>\n\n\n\n
    \n\n\n\n

    L\u2019importance de l\u2019accessibilit\u00e9 en design web<\/h2>\n\n\n\n

    Mais avant d’attaquer sur le sujet m\u00eame de Figma Sites, revenons un peu sur les bases et fondements du design moderne, et de l’accessibilit\u00e9.<\/p>\n\n\n\n

    Pourquoi l\u2019accessibilit\u00e9 n\u2019est pas une option<\/h3>\n\n\n\n

    L\u2019accessibilit\u00e9, ce n\u2019est pas une \u201cfeature\u201d \u00e0 activer plus tard. C\u2019est un fondement<\/strong> du web, au m\u00eame titre que la compatibilit\u00e9 mobile, la performance ou la s\u00e9curit\u00e9. L\u2019ignorer, c\u2019est priver une partie de la population de l\u2019acc\u00e8s \u00e0 l\u2019information ou aux services propos\u00e9s ; en soit, c’est priver l’individu de son autonomie. C\u2019est aussi une mani\u00e8re de renforcer les in\u00e9galit\u00e9s, volontairement ou non.<\/p>\n\n\n\n

    D\u2019un point de vue l\u00e9gal, plusieurs pays, dont ceux de l\u2019Union europ\u00e9enne, imposent d\u00e9sormais des standards d\u2019accessibilit\u00e9 pour les services publics et les entreprises. Le RGAA<\/strong>, le RAWeb<\/strong>, le WCAG<\/strong>, et le European Accessibility Act<\/strong> ne sont plus de simples recommandations. \u00c0 partir de 2025, ignorer ces exigences, c\u2019est aussi prendre un risque juridique.<\/p>\n\n\n\n

    Mais surtout, l\u2019accessibilit\u00e9 est une marque de respect<\/strong>. Respect pour la diversit\u00e9 des usages, des corps, des esprits. Elle est un levier d\u2019inclusion, d’opportunit\u00e9s, une obligation morale et non pas une contrainte technique.<\/p>\n\n\n\n

    Ce que les designers attendent d\u2019un outil \u00ab moderne \u00bb<\/h3>\n\n\n\n

    Un outil de cr\u00e9ation de sites en 2025 ne peut plus faire l\u2019impasse sur l\u2019accessibilit\u00e9. Ce que les designers attendent d\u2019un outil dit \u00ab moderne \u00bb, ce n\u2019est pas juste une interface fluide ou un onboarding avec des micro-interactions l\u00e9ch\u00e9es. C\u2019est la possibilit\u00e9 de construire des fondations solides<\/strong> : du balisage s\u00e9mantique, des formulaires accessibles, une navigation clavier coh\u00e9rente, des labels visibles et compr\u00e9hensibles.<\/p>\n\n\n\n

    En clair, un outil moderne doit \u00eatre capable de faire \u00e9merger de bonnes pratiques<\/strong>, pas d\u2019encourager des effets cosm\u00e9tiques au d\u00e9triment de l\u2019essentiel. Nous, designers, proposons des interfaces pour que des \u00eatres humains puissent acc\u00e9der \u00e0 un contenu, service ou produit, et pas uniquement pour satisfaire nos egos artistiques. C’est aux outils que nous utilisons de montrer l’exemple.<\/p>\n\n\n\n

    Les b\u00e9n\u00e9fices pour les utilisateurs<\/h3>\n\n\n\n

    Quand un site est accessible, tout le monde y gagne :<\/p>\n\n\n\n