Digital accessibility watch October 2022 -January 2023

Big lazyness at the end of 2022, so 4 months of watch, I promise, I will do it again!
We had the right to lots of great advent calendars, lots of great things to watch:

• a calendar list in webdev: https://adrianroselli.com/2022/12/web-development-advent-calendars-for-2022.html
• another: https://www.smashingmagazine.com/2022/12/tech-advent-calendars-web-developers-web-designers-2022/
• the famous 24 days of web (fr): https://www.24joursdeweb.fr/
• and a new one (fr): https://www.htmhell.dev/adventcalendar/

In this new year when France has not shone with regard to its a11y report to the European Commission (read about it (fr): https://koena.net/rapport-de-la-france-a-la-commission-europeenne-sur-la-directive-accessibilite-web-regles-du-jeu-modifiees/ ), an opinion that I share on the fact that inaccessibility is often ONLY political (fr): https://www.lalutineduweb.fr/inaccessibilite-politique/

Good reading !

Accessibility in laws and standards #

• WCAG finally AG 3.0, where are we?: https://www.tpgi.com/wcag-3-0-are-we-there-yet/
• Explanation of the future criterion 2.4.11 focus appearance of WCAG 2.2: https://www.tempertemper.net/blog/focus-appearance-explained

Feedback and accessibility #

• Point on definition lists in HTML, attention: https://adrianroselli.com/2022/12/brief-note-on-description-list-support.html
• The concerns of aria-label, to read: https://ericwbailey.website/published/aria-label-is-a-code-smell/
• Start in the setting in a11y (fr): https://access42.net/comment-demarrer-demarche-accessibilite-numerique
• Always test the browser / AT support, it evolves: https://www.tpgi.com/carry-on-testing-2023/

Accessibility Strategy #

• The strategy of the a11y of the English government site gov.uk evolves, to read (in): https://accessibility.blog.gov.uk/2023/01/06/a-new-accessibility-strategy-for-the-gov-uk-design-system/
• SEO and a11y, together, 4 articles on the subject: https://www.deque.com/blog/author/matthew-luken/
• Small reminder for font size: https://joshcollinsworth.com/blog/never-use-px-for-font-size
• Accessibility and keyboard navigation everything you need to know:
  • part 1: https://www.smashingmagazine.com/2022/11/guide-keyboard-accessibility-html-css-part1/
  • part 2: https://www.smashingmagazine.com/2022/11/guide-keyboard-accessibility-javascript-part2/
• Information architecture is also a11y: https://medium.com/known-item/your-information-architecture-is-an-accessibility-problem-cd54ae917f8e
• A11y washing, stop lying to yourself: https://adrianroselli.com/2022/11/accessibility-gaps-in-mvps.html
• 7 things to do for a11y and SEO: https://www.deque.com/blog/7-tactics-that-benefit-both-accessibility-and-seo/

Test accessibility #

• The top 5 errors of a11y in 2022, informative: https://intopia.digital/articles/top-5-critical-accessibility-issues-in-2022/
• Beta of the government's RGAA declaration tool (fr): https://ara.numerique.gouv.fr/
• The consistency of the main WCAG test tools published by the W3c, to read:
  • Announcement on Deque's blog: https://www.deque.com/blog/w3c-publishes-wcag-testers-consistency-list/
  • w3c article: https://www.w3.org/WAI/standards-guidelines/act/implementations/
• Comparison of 5 a11y auto and hand test tools, to read: https://adrianroselli.com/2023/01/comparing-manual-and-free-automated-wcag-reviews.html
• Self test, the basics: https://www.smashingmagazine.com/2022/11/automated-test-results-improve-accessibility/
• Set up a test environment for screen reader, complete: https://www.sarasoueidan.com/blog/testing-environment-setup/
• Guide to testing WCAG 2.1 AA, in progress: https://github.com/alphagov/wcag-primer/wiki
• A Chrome extension to test 1.14.12 - Text Spacing: https://chrome.google.com/webstore/detail/text-spacing-editor/amnelgbfbdlfjeaobejkfmjjnmeddaoj

Technical points in accessibility #

• The label tag and its use, I learned stuff: https://maxdesign.com.au/articles/label.html:
• HTML semantics and its support: https://www.tpgi.com/screen-readers-support-for-text-level-html-semantics/
• A link and not a button: https://www.tempertemper.net/blog/if-you-need-a-link-dont-use-a-button
• The solution for always visible focus with sticky elements: https://www.tpgi.com/prevent-focused-elements-from-being-obscured-by-sticky-headers/
• Icons plus text, reminder of the problem: https://www.tempertemper.net/blog/buttons-with-icons-and-text
• Do not nest HTML interactive elements: https://www.tempertemper.net/blog/overlapping-interactive-areas
• Aria, you only need it when you need it, again: https://www.htmhell.dev/adventcalendar/2022/2/
• Shadow Dom and ARIA, the problems: https://nolanlawson.com/2022/11/28/shadow-dom-and-accessibility-the-trouble-with-aria/
• Detailed explanation of accessible masking (visually-hidden or sr-only), didactic: https://www.tpgi.com/the-anatomy-of-visually-hidden/
• Consideration on HTML validation and the WCAG 4.1.1 criterion: https://adrianroselli.com/2022/12/the-411-on-4-1-1.html
• Aria-label and the displayed label, which is problematic: https://ashleemboyer.com/blog/don-t-overwrite-visual-labels-with-aria-label
• Focus-visible, the savior (fr): https://www.nicolas-hoffmann.net/source/1716-Focus-visible-la-pseudo-classe-qui-met-presque-tout-le-monde-d-accord.html
• Update on the HTML title attribute: https://www.tpgi.com/using-the-html-title-attribute/
• Feedback on focus visibility, state of the art before WCAG 2.2: https://tetralogical.com/blog/2023/01/13/foundations-visible-focus-styles/

Mobile app, mobile web #

• The zoom in safari: https://convergeaccessibility.com/2023/01/09/hidden-accessibility-gems/
• Developing a11y on Android, a few points: https://dev.to/steady5063/android-accessibility-a-developers-guide-1n0m
• iOS developer specializing in a11y, follow: https://iosdev.space/@dadederk/

Ergonomics, UI & UX #

• a11y annotations in wireframes: https://kb.iu.edu/d/bhpk
• A study that takes stock in France, mobile UX: https://wexperience.fr/blog/lux-mobile-en-2023-en-france-pire-ou-mieux/
• Checklist for user testing in accessibility, practice: http://www.uiaccess.com/accessucd/ut_checklist.html
• Feedback from screen reader user tests, to read: https://jessbudd.com/blog/screen-reader-usability-testing-observations/
• Differences between modals, dialogs and popover: https://hidde.blog/dialog-modal-popover-differences/
• The drag&drop anatomy: https://pencilandpaper.io/articles/ux-pattern-drag-and-drop/#drag-and-drop-alternatives
• Use infinite scrolling wisely: https://www.nngroup.com/articles/infinite-scrolling-tips/infinite-scrolling-tips/

Resources #

• Design system, component library and a11y, resources: https://www.webaxe.org/web-accessible-code-library-design-systems-patterns/
• Neurodiversity and design system, to read: https://www.neurodiversity.design/
• Test the a11y, everything is explained: https://web.dev/learn-accessibility-available/
• A study on the a11y of job sites, edifying (fr): https://www.access-first.fr/etude-accessibilite-sites-emploi
• Another study on shops and the a11y, not better (fr): https://www.access-first.fr/etude-accessibilite-de-sites-de-vente-en-ligne
• The a11y of text and links explained, complete: https://blog.pope.tech/2023/01/01/link-and-text-accessibility/
• Getting started with WCAG 2.2: https://alphagov.github.io/wcag-primer/
• Some figures around disability: https://dequeuniversity.com/resources/disability-statistics
• Another study on Christmas shopping and a11y (fr): https://blog.empreintedigitale.fr/2022/12/08/accessibilite-numerique-et-e-commerce-ou-en-sommes-nous__trashed/
• Short semantic HTML lessons, reminder: https://mikemai.net/blog/2022/12/04/24-semantic-terms-web-pros-should-know.html#main
• Site on the a11y, neat, in particular on the specifications of components (en/fr): https://accessuse.eu/en/components.html

Others #

• Find accessible colors well contrasted: https://randoma11y.com/
• Techniques for audio description: https://mn.gov/mnit/media/blog/?id=38-560867