Veille accessibilité numérique Janvier 2021 – février 2021

Grosse nouvelle, sortie du “W3C First Public Working Draft 21 January 2021” l’avenir de l’a11y web et bien plus. Une introduction : https://www.w3.org/WAI/standards-guidelines/wcag/wcag3-intro/

Et quelques articles pour se faire une idée :

• https://www.deque.com/blog/first-public-working-draft-wcag-3/
• https://www.deque.com/blog/public-working-draft-wcag-3-history/
• https://jspellman-77432.medium.com/an-insider-look-at-wcag-3-0-276e9b964a33
• https://sheribyrnehaber.medium.com/silver-wcag-3-0-first-public-working-draft-released-15f765b9525e
• https://www.jdsupra.com/legalnews/new-web-content-accessibility-standard-4698390/

L’accessibilité dans les lois, les normes et recommandations #

• Label in name WCAG 2.5.3, expliqué en détails (anglais) : https://css-tricks.com/whats-new-in-wcag-2-1-label-in-name/
• Message status 4.1.3 explications (anglais) : https://www.digitala11y.com/understanding-sc-4-1-3-status-messages/

Retours d’expérience et accessibilité #

• Un message d’un utilisateur de lecteur d’écran pour les devs (anglais) : https://bighack.org/message-to-web-developers-from-a-screen-reader-user/
• HTML sémantique ou affichage CSS ? (anglais) : https://adrianroselli.com/2020/10/a11yto-conf-css-display-properties-versus-html-semantics.html

Stratégie de mise en accessibilité #

• Faire des cartes accessibles, tous les points de vigilance (anglais) : https://www.benjystanton.co.uk/blog/a-plan-for-accessible-maps/
• Réduire les animations via CSS, JS et React, à lire (anglais) : https://letsbuildui.dev/articles/reducing-motion-in-animations

Tester l’accessibilité #

• Les outils développeur du navigateur pour tester l’accessibilité (anglais) : https://christianheilmann.com/2021/01/11/seven-ways-to-test-for-accessibility-of-your-web-site-with-browser-developer-tools/
• Le problème du test avec lecteur d’écran pour les devs (anglais) : https://jaketracey.com/a-developers-perspective-the-problem-with-screen-reader-testing/
• Outils de tests développeur, succinct mais fait le point (anglais) : https://techosmo.com/hacker-noon/winning-at-web-accessibility-in-2021-with-these-tools-for-developers/
• Calculateur de ratio de contraste pour WCAG3 (anglais) : https://www.myndex.com/APCA/

Points techniques en accessibilité #

• aria-description, chouette (anglais) : https://html5accessibility.com/stuff/2021/02/09/aria-description-by-public-demand-and-to-thunderous-applause/
• Attention à la propriété CSS content-visibility (anglais) : https://marcysutton.com/content-visibility-accessible-semantics
• Différence aria-label, labelledby, describedby (anglais) : https://benmyers.dev/blog/aria-labels-and-descriptions/
• Étiqueter un contrôle (éléments interactif), prioriser les méthodes, à lire (anglais) : https://adrianroselli.com/2020/01/my-priority-of-methods-for-labeling-a-control.html
• aria-haspopup, peu robuste et donc à éviter, comment… (anglais) : https://html5accessibility.com/stuff/2021/02/02/haspopup-haspoop/
• Un point sur la visibilité du focus, techniques (anglais) : https://www.nicchan.me/blog/tips-for-focus-styles/
• Conseil pour la commande vocale et les SVG (anglais) : https://www.ajsaucier.com/accessibility/2020/12/14/voice-control-and-css-psuedo-elements.html
• Changer les noms accessibles dynamiquement, bof ! (anglais) : https://adrianroselli.com/2020/12/be-careful-with-dynamic-accessible-names.html
• alt et figcaption, pour qui, pourquoi (anglais) : https://thoughtbot.com/blog/alt-vs-figcaption
• Lien ancre et accessibilité (anglais) : https://amberwilson.co.uk/blog/are-your-anchor-links-accessible/

Appli mobile #

• Des guidelines mobiles sur le très sérieux bbc.co.uk (anglais) : https://www.bbc.co.uk/accessibility/forproducts/guides/mobile/

Ergonomie, UI & UX #

• Expérience utilisateur et accessibilité, les points de base (anglais) : https://www.awwwards.com/accessibility-in-user-experience-how-to-include-people-with-disabilities.html
• Utilisateurs sans souris, les basiques (anglais) : https://uxdesign.cc/taking-the-keyboard-navigation-red-pill-dbb76dd73b1e
• La charge cognitive, exemples (anglais) : https://uxdesign.cc/the-cognitive-overload-happening-on-your-screen-right-now-deee2a913393
• 8 points sur UX et a11y (anglais) : https://uxdesign.cc/8-faqs-about-accessible-ux-7c5a372a1ffb

Ressources #

• Bibliothèques de code web et design patterns, plein de ressources (anglais) : http://www.webaxe.org/web-accessible-code-library-design-systems-patterns/
• Ressources sympa pour les devs en a11y (anglais) : https://www.upyoura11y.com/
• Ressources pour l’accessibilité et ses lois (anglais) : https://accessibility-manual.dwp.gov.uk/accessibility-law
• Un peu d’histoire des lecteurs d’écran (anglais) : https://knowbility.org/blog/2021/a-brief-history-of-screen-readers/
• Excellents épisodes vidéos de Heydon Pickering, ici sur ARIA, à voir absolument, humour dedans (anglais) : https://briefs.video/videos/what-is-aria-even-for/
• Newsletter accessibilité numérique (anglais) : http://www.webaxe.org/digital-accessibility-newsletters/
• Outils 2021 de dev a11y (anglais) : https://dev.to/jaketracey/the-best-web-accessibility-tools-for-developers-in-2021-8c8
• Le HTML sémantique (anglais) : https://dev.to/eevajonnapanula/ode-to-semantic-html-38c3
• Le web sémantique, aller plus loin que le précédent lien (anglais) : https://24days.in/umbraco-cms/2020/semantics-in-web-development/
• Liste de sites accessibles (anglais) : https://www.a11ywebsites.com/

Autres #

• Le progressive enhancement (amélioration progressive) où en est-on ? (anglais) : https://briefs.video/videos/is-progressive-enhancement-dead-yet/
• Pourquoi séparer HTML, CSS et JS, c’est bon pour l’utilisateur (anglais) : https://hiddedevries.nl/en/blog/2020-11-25-why-its-good-for-users-that-html-css-and-js-are-separate-languages