Design Accessibility Testing made easy | BrowserStack. Référentiel général d'écoconception de services numériques (RGESN) - 2024 - Numérique écoresponsable. Version 2. Dernière mise à jour le 28 mai 2024 Version : 2 Format PDF (4,2 Mo) Outil d'évaluation en Open Document (ODS 101 Ko) Outil d'évaluation en format Excel (XLS 129 Ko) Exemple de déclaration d'écoconception, format word (DOCX 15 Ko) Exemple de déclaration d'écoconception, format open document (ODT 50 Ko) La loi relative à la réduction de l’empreinte environnementale du numérique (loi REEN) a confié à l’Arcep et l’Arcom la définition, en lien avec l’ADEME, du contenu de la nouvelle version du référentiel général de l’écoconception des services numériques.
Un projet de référentiel a été mis en consultation publique à l’automne 2023, et des ateliers de concertation avec l’écosystème et des experts de la société civile ont également permis de contribuer à l’élaboration de ce référentiel. Stratégie La stratégie permet de déterminer et de suivre la pertinence, les enjeux et le pilotage de la conception du service numérique. Spécifications Architecture. Simulation de handicap par des personnes valides : qu’en pensent les personnes handicapées ? – Access42. Lorsqu’il s’agit de sensibiliser les personnes sans handicap à l’accessibilité, les mises en situation de handicap sont monnaie courante dans les domaines de l’entreprise, de l’éducation et du numérique. L’objectif serait de susciter l’empathie des personnes dites valides pour les personnes handicapées.
Que pensent les personnes handicapées elles-mêmes de ces mises en situation, dont elles sont souvent exclues ? Nous avons mené l’enquête. Mises en situation de handicap : définition En quoi consistent les mises en situation de handicap ? Les mises en situation de handicap sont des méthodes de sensibilisation de personnes dites valides. Ces simulations sont définies comme des « situation[s] qui indui[sent] une limitation d’une activité en raison d’une altération ponctuelle d’une fonction physique, sensorielle, matérielle ou cognitive ». Les mises en situation de handicap sont censées contribuer à casser les préjugés sur le handicap grâce à un atelier collectif qui se veut ludique. Conclusion. L’accessibilité numérique, et si nous agissions ? | Atalan. Accessibilité, jouez la bonne carte – Tamara Sredojevic. Défendre l'accessibilité numérique – Tamara Sredojevic. Quand on parle d’accessibilité, la conversation bute souvent sur un “oui, mais…”.
Deux mots simples pour annoncer la réticence. Non pas que l’esprit critique me dérange, mais pourquoi cette résistance sur un sujet aussi essentiel ? Prenons l’exemple de l’Intelligence Artificielle qui suscite un engouement immédiat. Tout le monde explore ses possibilités et s’émerveille de ses opportunités. Pourquoi ne pas appliquer cet enthousiasme à l’accessibilité ? Comme l’explique Sophie Drouvroy dans son article pour 24 jours du web, les deux sujets n’ont pas à s’opposer. En tant que professionnels de la tech, l’accessibilité fait partie de nos responsabilités et de la qualité des services que nous concevons. Dans cet article, je vous propose une série d’arguments à considérer, sans hiérarchie ni ordre précis.
Il est cependant essentiel de manier certains de ces arguments avec prudence pour éviter de renforcer des idées validistes. Il y a plus de personnes handicapées qu'on ne le pense. Fairness - Accueil. Green IO - Podcast and conferences for responsible technologists. The Green Compagnon. How to check and document design accessibility in your mockups by Stéphanie Walter - UX Researcher & Designer. A lot of accessibility issues can be already foreseen and prevented in the design phase. Save time documenting accessibility in Figma mockups with practical tips and a list of selected tools, plugins, and templates! In this article, I will cover color usage, contrast ratios, text resizing, font legibility, target sizes, form elements, focus order, complex components keyboard interactions, skip links, headings, landmarks, and alternative text for images. You can also jump to the list of tools and plugins directly. The plugins in here are focused on Figma, but, the methods can be used with any other designer tool.
This article is a text version of my slides for a Friends of Figma event, I’ll share the video once it’s available. Checking color usage in the mockups You want to help all users distinguish the content. How to check color only usage This is a manual check to do in the mockups. For example: I have a navigation and the active element is only conveyed by the color change to orange. Démonstration d'un tableau simple avec NVDA. The Contrast Triangle. Faux gras, caractères fantaisistes, abus d’émojis : le détournement des caractères Unicode, fléau pour l’accessibilité du web - La Lutine du Web.
Cet article est la transcription textuelle de la vidéo que j’ai enregistrée avec des démonstrations et explications. À partir du titre « Ressources complémentaires », retrouvez des ressources et informations ajoutées à posteriori. Voir la vidéo sur YouTube Mea culpa : oui, je lis mon texte et ça se voit mais je n’ai pas pour vocation de devenir youtubeuse donc, tout va bien tant que cette vidéo fait son boulot de sensibilisation ! 😁 Note : Le cadrage me met la tête en plein milieu de mon miroir, ce qui me fait une drôle d’auréole ; ce que j’ai remarqué au montage. Tant pis, ça vous fera peut-être rire !
Bonjour ! Je n’aurais jamais cru que ça arriverait un jour mais, cette fois-ci, j’ai décidé de passer par le format vidéo. Unicode est un standard informatique qui permet des échanges de textes dans différentes langues, à un niveau mondial.Unicode, Wikipédia Ce sujet-là, je l’avais pas mal abordé en 2019 sur Twitter notamment. C’est quoi ces caractères dont tu nous parles ? Démo avec NVDA. Référentiel d'évaluation de l'accessibilité des documents au format PDF (RAPDF 1) : Introduction - Portail de l'accessibilité numérique. Version 1.0, publiée le 5 avril 2023 D’après la loi luxembourgeoise du 28 mai 2019, tous les sites Internet et applications mobiles d’organismes du secteur public luxembourgeois doivent être accessibles.
Le Service information et presse est en charge du contrôle de leur accessibilité. Dans ce cadre, le référentiel PDF a été élaboré pour servir de socle d’évaluation et d’implémentation pour tous les organismes du secteur public concernés par la loi. Ce référentiel propose un cadre opérationnel de vérification de la conformité aux exigences d’accessibilité. Dès lors, il permet de vérifier qu’un document PDF est conforme aux critères décrits dans la norme européenne EN 301 549 v.3.2.1 pour la Section 10 Non-web documents.
Il comporte 46 critères de contrôle. En cas d’absence de mise à jour du référentiel sous 3 ans pour prendre en compte de nouveaux standards ou spécifications techniques, il est possible de créer ses propres tests en complément de ceux existants. Sommaire. Composants - Système de Design de l'État. Patterns | APG | WAI | W3C. Accordion (Sections With Show/Hide Functionality) An accordion is a vertically stacked set of interactive headings that each contain a title, content snippet, or thumbnail representing a section of content. Alert An alert is an element that displays a brief, important message in a way that attracts the user's attention without interrupting the user's task.
Alert and Message Dialogs An alert dialog is a modal dialog that interrupts the user's workflow to communicate an important message and acquire a response. Breadcrumb A breadcrumb trail consists of a list of links to the parent pages of the current page in hierarchical order. Button A button is a widget that enables users to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation. Le guide d’écoconception de services numériques - Les Designers Éthiques. A checklist for prioritising web accessibility | by Dara Olayebi | Sep, 2022. In the spirit of being transparent, I haven’t always prioritised accessibility. This is not to say that I’ve deliberately built applications to be inaccessible, but rather, that it was often an afterthought — something I needed to “tackle” at the very end.
Because of this, I never spent enough time making sure all parts of the user interface were accessible. Over time, I have realised how important it is to make it a natural part of my development process from the jump. In a nutshell, accessibility on the web refers to the ability for everyone to successfully perceive, operate, understand and access a website or web application. People with disabilities use assistive technologies — screen readers, screen magnifiers, Braille displays, voice control, to name a few — to access the web. Before diving in, we’ll go behind the scenes a little bit. When a browser loads a webpage, a couple of things happen. By default, HTML is accessible. More on semantics: HTML semantics cheat sheet.
Le guide d’éco-conception de services numériques - Les Designers Éthiques. MOOC Numérique Responsable par l'Institut du Numérique Responsable (INR) Analyse performance et qualité de. x171 : la croissance du poids de nos logiciels.
Selon notre étude, le couple Windows 10 et Office 2019 nécessite 171 fois plus de mémoire vive (RAM) que Windows 98 et Office 97. Pourtant, en 20 ans, nos usages n’ont pas changé. Nous continuons à écrire les mêmes textes et courriels, faire des additions et des multiplications, préparer des présentations qui sont pratiquement identiques aux contenus que nous produisions il y a 20 ans. Et nous ne le faisons pas 171 fois plus vite qu’il y a 20 ans. Le principal déclencheur de l’obsolescence prématurée du matériel Cette croissance ininterrompue de la gourmandise des logiciels est le principale déclencheur de l’obsolescence prématurée de nos appareils numériques : nous ne les changeons pas parce qu’ils ne fonctionnent plus, mais parce qu’ils rament !
Le fait est tellement avéré que nous avons forgée une nouvelle expression en 2014 – l’obsolescence logicielle – pour désigner ce phénomène. Que peut-on faire ? On arrête donc d’installer les mises à jour évolutives sans réfléchir. Frédéric Bordage. OPQUAST CHECKLIST FR 2020. Référentiel Général d'Accessibilité pour les Administrations - RGAA 3 2017. Accessibilité et couleurs : outils et ressources pour concevoir des produits accessibles, par Stéphanie Walter - UX designer & experte mobile.
J’avais discuté sur Twitter il y quelque temps des lacunes dans l’enseignement des étudiantes et étudiants en design et notamment du manque de bases de l’accessibilité et des couleurs. Cette discussion a donné lieu à pas mal de réponses intéressantes sur les outils pour mesurer l’accessibilité des couleurs, le design inclusif et quelques discussions sur les émojis. Plusieurs personnes sont venues me demander depuis des conseils et des outils pour les aider. Plutôt qu’un long tweet, j’ai décidé de rédiger un article « aide mémoire » pour partager toutes les ressources, conseils et outils que j’utilise régulièrement pour construire et vérifier l’accessibilité des couleurs des produits et services que je design.
Je continue à mettre à jour régulièrement cet article avec de nouveaux outils. Dernière mise à jour : février 2023 ** This article also exists in English ** Contraste et accessibilité : quelques notions de base sur la couleur Contrastes des textes / arrière plan Color Oracle Stark. Handinewtek Le numérique pour tous – Le site dédié à l'accessibilité numérique et aux nouvelles technologies accessibles. Articles. Accessibility for UX Designers — Accessibility for Teams. Stark. Color Blind Filter. Use the Colorblind Colorlab to select safe colors earlier in the design process. Learn more about colorblindness in this Wikipedia entry. This tool is still in development, but feedback is welcome while we work on it.
If you only use one filter, use the greyscale filter which will not only point out potential problem areas, but will also let you see more clearly which areas the filter is unable to process. Improvements We have made the following improvements to the colorblind web page filter. Improved Image FilteringImage filtering takes more time than HTML or CSS filtering. Improved Non-GIF Image FilteringPreviously, we only filtered GIF images. Improved StylesheetsOur CSS filtering was not perfect, but it was much better than our filtering of client-side scripts. Our Logo If your page meets the following criteria, please feel free to use this logo on your web site (available in gif and png formats). Before using the logo, you'll want to verify the following: Color Oracle | Color Oracle. Website Carbon Calculator | How is your website impacting the planet? INR | Institut du Numérique Responsable - Think Tank.
Opquast, la certification des professionnels du Web - Opquast. Collectif conception numérique responsable.