Web Accessibility Techniques

Web Accessibility: General / Introductions

• Lawson, Bruce: Web Accessibility Checklist: 16 Things to Improve Your Website Accessibility, WebsiteSetup.org, 09.03.2020.
• University of Washington: Developing Accessible Websites.
• Guide to Accessible HTML Documents, BBC (no date; accessed on 03.07.2022).
• IT Accessibility Handbook, North Carolina State University.
• Rietveld, Rian: “Blind people don’t visit my website.”, The A11Y Collective, 31.03.2021, updated on 14.04.2021.
• Sapega, Marissa: A Starter Guide For Improving Digital Accessibility, TPGi, 21.07.2020.
• Fisher, Carie: Getting Started with Website Accessibility, Statuscode, 11.09.2017.
• Handreichungen zur BITV 2.0, Überwachungsstelle des Bundes für Barrierefreiheit von Informationstechnik (no date; accessed on 11.04.2022).
• Web Accessibility with Marcy Sutton, Lullabot, 05.10.2017 (podcast).
• Kramer, Nicholas: A Primer to Web Accessibility for Designers, UX Planet on Medium, 10.03.2018.
• Einführung in Barrierefreiheit, Einfach für Alle (no date).
• Web Accessibility (Barrierefreiheit), Gesellschaft für Informatik, 14.10.2013.
• Conti, Genevieve: The Writer's Guide to Making Accessible Web Content, Zapier, 17.05.2016.
• Ng, Cynthia: A Practical Guide to Improving Web Accessibility, Weave: Journal of Library User Experience, Volume 1, Issue 7, 2017 (licensed under a Creative Commons Attribution 3.0 License).
• Kramer, Melody: How accessible is your website for the disabled? Consider doing an audit to find out, Poynter, 17.11.2017.
• Fisher, Carie: Getting Started with Website Accessibility, Statuscode, 11.09.2017.
• Fisher, Carie: Accessibility First: Rethinking the Way We Approach Website Design and Development, 24 Accessibility, 01.12.2017.
• Atherton, Chris: If you care at all about inequality, you also have to care about web accessibility, UX Collective on Medium, 02.01.2018.
• Sethfors, Hampus: Practical Examples of Accessibility Improvements, Axess Lab, 28.12.2017.
• Ratcliff, Christopher: How to design websites for blind and partially sighted people, WhatUsersDo, 15.08.2017.
• Raduenzel, Beth: A DIY Web Accessibility Blueprint, A List Apart, 13.03.2018.
• Campbell, Ronald: A Technical Guide to Getting Started with Web Accessibility: Part 1 (Alternative Text), UsableNet blog, 27.07.2017.
• Campbell, Ronald: A Technical Guide to Getting Started with Web Accessibility: Part 2 (WAI–ARIA Landmarks), UsableNet blog, 27.07.2017.
• 4 Accessibility Tips for Web Developers, Bureau of Internet Accessibility, 27.03.2018.
• Ruzek, Amelia: 10 Small Changes To Build Accessibility Into Your Website, Code Like a Girl, 28.04.2018 (two-minute read).
• Frick, Tim: Make Your Website More Accessible to People with Disabilities, B the Change, 25.07.2018 (eight-minute read).
• Accessibility Developer Guide: an initiative of the Swiss foundation Access for All. See also the Accessibility Developer Guide's source code on GitHub.
• Clark, Joe: Usability benefits of Web accessibility, Personal Weblog of Joe Clark, Toronto, 01.03.2007.
• Clark, Joe: Where open-source is as good as Microsoft, Personal Weblog of Joe Clark, Toronto, 25.11.2010.
• Florin, Hubert: Accessibility, a powerful design tool, Slack Design on Medium, 25.02.2019.
• 7 habits to get into an accessible mindset, I am Schulz, 21.03.2020.
• Mapping of WCAG 2.0 to Functional Performance Criteria, Section508.gov.
• Bone, Charlotte: The Most Common Web Accessibility Mistakes & How To Solve Them, Charlotte’s Digital Web on Medium, 16.10.2019.
• Clark, Joe: Selling accessibility to programmers, Personal Weblog of Joe Clark, Toronto, 08.11.2005.
• Hinweise für barrierefreies Webdesign, Universitätsrechenzentrum, Technische Universität Chemnitz (no date).
  Guidance that briefly covers document titles, structure elements (headings, paragraphs, lists), link text, text alternatives for images, contrast, multimdia, instructions and readability.
• Kaur, Avinash: Accessibility guidelines for UX Designers, UX Collective on Medium, 18.12.2018.
• Accessibility for UX Designers, Accessibility for Teams (no date).
• Perry, Sharon: A Systems Approach Model to Web Accessibility, Cetis Blog, 29.01.2007.
• Barrierefreiheit im Web, RKW-Kompetenzzentrum, 2013.
• Ahlgren, Matt: Top 80 Web Accessibility Resources & Tools, Website Hosting Rating, updated on 26.02.2021.
• Why Web Accessibility is Important: 4 Reasons to Create Accessible Content, Bureau of Internet Accessibility blog, 05.01.2022.
• Tieber, Konstantin: Building accessible web applications: What, Why, Who and How, LeanIX Engineering, 31.01.2022.
• Link-Rodrigue, Margit: The Inclusion Principle, A List Apart, 21.06.2009.
• Ang, Trish: How to Fail at Accessibility: Strategies for building accessibility awareness into your development process, Slack Engineering, 2019.
• Low-Hanging Fruit: 4 Accessibility Issues That Make a Website an Easy Target, Bureau of Internet Accessibility, 06.05.2022.
  The low-hanging fruit discussed in this blog post refers to missing text alternatives, poor contrast ratios, missing captions and transcripts, and keyboard traps and other keyboard accessibility issues.

Myths and Misconceptions about Accessibility

• Accessibility Myths. (Website created by Sergei Kriger; available in various languages.)
• Sentance, Rebecca: 10 Website Accessibility Myths Debunked, UserZoom blog, 04.04.2018.
• de Vries, Hidde: “That's not accessible!” and other statements about accessibility, hidde.blog, 30.06.2022.

Simple Tests

• Pitman, Gemma: 5 accessibility tests you can do in 5 minutes, Open Inclusion, 02.03.2018.
• Groves, Karl: The 6 Simplest Web Accessibility Tests Anyone Can Do, Karl Groves (blog), 05.09.2013.
• Take the #NoMouse Challenge! Quote: The #NoMouse Challenge is a global effort to raise awareness about accessible web design. (Accessed on 16.11.2022.)

Basic Concepts

Accessible Name

• Watson, Léonie: What is an accessible name?, TPGi, 11.04.2017.
• Evans, Alice: Accessible Naming for Screen Reader Compatibility, Knowbility blog, 02.03.2021.
• Chandelier, Lena: Les noms accessibles dans tous leurs états, 24 jours de web, 16.12.2019.
• The accessible name in HTML, Orange digital accessibility guidelines (no date; accessed on 21.04.2023).
• Lexique autour de l’accessibilité numérique, Blog Koena, 08.09.2021, updated on 19.10.2021.

The Accessibility Tree

• Kearney, Meggin; Gash, Dave; Boxhall, Alice: The Accessibility Tree, web.dev, 04.10.2016; updated on 08.06.2019.
• Faulkner, Steve: The Browser Accessibility Tree, TPGi, 26.01.2015.
• de Vries, Hidde: How accessibility trees inform assistive tech, hidde.blog, 27.06.2019.

Support in Assistive Technologies

• Accessibility Support: a community-driven effort that documents support in assistive technologies. Text and data are available under the terms of the Creative Commons Attribution 4.0 International License. (See a11ysupport.io on GitHub if you want to contribute to this project.)
• Faulkner, Steve: Rough Guide: browsers, operating systems and screen reader support – Updated 23/06/2017, Paciello Group blog, 23.06.2017 (original version, 12.10.2014).
• Creemers, Frederik: How to Make Your Website Accessible to People Who Use a Screen Magnifier, 07.06.2017.
• Watson, Léonie: How to create content that works well with screen readers, Gov.uk Accessibility Blog, 08.02.2017.
  Watson says it probably isn't possible to write content that will work flawlessly for everyone who uses a screen reader and points out that some techniques that one might use for abbreviations can make the text harder to read for other users.
• Watson, Léonie: The difference between keyboard and screen reader navigation, Tink, 25.05.2019.
• Lawson, Bruce: Screenreader support for text-level semantics, Bruce Lawson's personal site, 31.10.2018.
• Faulkner, Steve: Screen Readers lack emphasis, The Paciello Group blog, 28.02.2018.
• Faulkner, Steve: Screen Readers support for text level HTML semantics, TPGi, 23.01.2023.
  This is an updated and expanded version of the blog post “Screen Readers lack emphasis”. As of early 2023, JAWS and NVDA support the elements del, ins and mark. Narrator and VoiceOver do not indicate the presence of these elements in any way. No screen reader indicates the presence of strong, em, b or i by default, but with style reporting enabled, the presence of these elements can be indicated.
• Pyatt, Elizabeth: ARIA for Screen Readers Not Able to Read Symbols, Got Unicode (3.0), 18.11.2014.
• Mosen, Jonathan: Important information for users of Mozilla Firefox Freedom Scientific Blog, 25.10.2017. Firefox Quantum introduces compatibility issues with assistive technology.
• Zehe, Marco: Firefox 57 from an NVDA user’s perspective, Marco Zehe's blog, 07.11.2017.
• Onsman, Ricky: Can I use Firefox with JAWS and/or NVDA?, Intopia, 26.06.2018.
• Creemers, Frederick: How to Make Your Website Accessible to People Who Use a Screen Magnifier, dev.to(), 07.06.2017.
• Should developers work around assistive technology bugs?, Unfettered Thoughts, 08.01.2018.
• Jones, Ryan: A Tale of Two Rooms: Understanding screen reader navigation, The Paciello Group blog, 25.01.2018.
  French translation: Il était une fois 2 pièces: comprendre la navigation avec un lecteur d'écran by Damien Pobel.
• PowerMapper: Assistive technology compatibility tests: test results for compatibility with screen readers such as NVDA, Jaws and VoiceOver.
• Freedom Scientific: VFO-standards-support: issue tracker for Jaws.
• Sethfors, Hampus: Assistive Technologies – The Switch, Axess Lab, 19.02.2018.
• Simons, Bart: Pleidooi van een screenreadergebruiker: overdrijf niet, AnySurfer, 11.07.2018.
• MacDonald, David: Test header and footer, CanAdapt / David MacDonald Accessibility Blog (no date; not earlier than 2015). This blog posts reports on screen reader support for the header element.
• Event Handlers and Screen Readers, Unobfuscated, 22.05.2013.
• Event Handlers and Screen Readers – Unobfuscated Resource, MEJSullivan – Learnings and Links, 08.05.2015. (This resource is based on a blog named Unobfuscated that no longer exists.)
• Egger, Sylvia: Mit Screenreadern testen (1): Zitatauszeichnung, Spungmarker, 28.02.2010.
• Faulkner, Steve: Results from the main landmark survey, Paciello Group blog, 30.01.2018.
• Richards, Melanie: Semantics to Screen Readers, A List Apart, 28.02.2019.
• Faulkner, Steve: Not so short note on aria-label usage – Big Table Edition, HTML Accessibility, 07.11.2020.
• Teh, James: Woe-ARIA: The Surprisingly but Ridiculously Complicated World of aria-label/ledby, Jantrid, 17.12.2015.
  According to Marco Zehe (12.11.2020) this blog post is mainly relevant to screenreaders that rely on virtual buffers.
• Garaventa, Bryan: How Browsers Interact with Screen Readers and Where ARIA Fits in the Mix, Level Access, 02.01.2013.
• Roselli, Adrian: VoiceOver on iOS 14 Supports Description Lists, Adrian Roselli, 20.09.2020.
  VoiceOver for iOS / iPadOS 14 is the first version that supports the dl element.
• Why Keyboard Accessibility Isn’t the Same Thing as Screen Reader Accessibility, Level Access Blog, 22.11.2012, updated on 31.01.2021.

Screen reader detection:

• Watson, Léonie: Thoughts on screen reader detection, Tink, 27.02.2014.
• Zehe, Marco: Why screen reader detection on the web is a bad thing, Marco's Accessibility Blog, 27.02.2014.
• Groves, Karl: “Should we detect screen readers?” is the wrong question KarlGroves.com, 28.02.2014.
• On Detecting Assistive Technology, Joe Dolson Accessibility, 01.03.2014.
• Roselli, Adrian: On Screen Reader Detection, Adrian Roselli, 03.03.2014.
• Developers please dont detect my screen reader, Maxability, 05.08.2015.
• Eric Eggert on Twitter, 01.09.2022, Screen readers must also support web standards.
  This tweet was written in response to another tweet by Birkir Gunnarson, who wrote As far as I know not a single screen reader supports token values for aria-haspopup, despite it having been in the ARIA spec since 2018. I'd be hesitant to add more such aria attributes without user agent guarantee of some kind.

Hiding / Hidden Content

• Faulkner, Steve: Short note on hiding stuff in interactive elements from screen readers, Paciello Group blog, 19.02.2018.
• Giraudel, Kitty: Hiding content responsibly, Kitty Giraudel, 17.02.2021.
• O'Hara, Scott: Inclusively Hidden, scottohara.me, 14.04.2017, updated on 02.03.2023.
• CSS in Action - Invisible Content Just for Screen Reader Users, WebAIM, 25.09.2020.
• Poupard, Gaël: Cache-cache CSS, La vie en #ffoodd, 18.01.2019.
  English translation by Kitty Giraudel: CSS hide-and-seek (13.10.2016).
• Rupert, David: Hide content, The A11Y Project, 15.02.2013.
• Snook, Jonathan: Hiding Content for Accessibility, Snook.ca, 25.02.2011.

Page Structure

• Semantic Structure, WebAIM.
• Swallow, David: Heading off confusion: When do headings fail WCAG?, Paciello Group blog, 17.03.2020.
• Deacon, Dennis: Headings & Accessibility, Paciello Group blog, 24.03.2020.
• Faulkner, Steve: Subheadings, subtitles, alternative titles and taglines in HTML, TPGi, 19.09.2022.
• Ali, Amani: How to structure headings for web accessibility, Nomensa blog, 14.08.2017.
• Bailey, Eric: The Importance of Heading Levels for Assistive Technology, Envato Tuts+, 22.10.2018.
• Roselli, Adrian: The Truth about “The Truth About Multiple H1 Tags”, Adrian Roselli's blog, 23.12.2013.
• Faulkner, Steve: Easy content organisation with HTML5, The Paciello Group, 24.09.2015.
• Roselli, Adrian: HTML Source Order vs CSS Display Order, Adrian Roselli, 25.10.2015 (with several later updates).
• Faulkner, Steve: Computer says NO to HTML5 document outline, HTML5 Doctor, 09.06.2015.
  This article explains that seven years after the introduction of HTML5's document outline, this mechanism cannot be relied upon due to lack of support in browsers and assistive technologies.
• Does illogical or non-sequential heading structure fail WCAG 2.0? Centre for Inclusive Design Blog, 02.01.2017.
  The author finds that WCAG 2.0 does not specify that logical and sequential heading structure is required to comply.
• Lawson, Bruce: Why You Should Choose HTML5 <article> Over <section>, Smashing Magazine, 07.01.2020 (eight-minute read).
• Montoro, Alvaro: Creating Accessible CSS Art, Alvaro Montoro, 08.07.2021.
• Faulkner, Steve: short note on figure and figcaption, HTML Accessibility, 25.08.2022.
• Roselli, Adrian: Be Wary of doc-subtitle, Adrian Roselli, 16.08.2020, updated on 20.07.2022.
• [Discussions] – SEO et hiérarchie de titres <h1>, <h2>…, Atalan, le Blog, 07.03.2016.
• Haunschild, Marc: inclusive Design: Die beste Überschriftenstruktur, haunschild.de, 10.20.2023.
• Lawson, Bruce: Why the HTML Outlining Algorithm was removed from the spec � the truth will shock you! , Bruce Lawson, 07.07.2022.

Images and Other Non-Text Content

Text Alternatives

• Alternative Text, WebAIM (regularly updated; also translated into German and French).
• Images Tutorial, Web Accessibility Initiative (WAI). (This page can be edited on GitHub.)
• Five kinds of ‘alt’ text, Usefocus, 07.02.2011.
• Eggert, Eric: There is no character limit for “alt text”: Myth Debunked!, Eric Eggert, February 2022.
• Heinrich, Alexa: The Alt Text Issue, Accessible Social, 28.06.2022.
• Göransson, Daniel: Alt-texts: The Ultimate Guide, Axess Lab, 15.10.2017.
• Byrne-Haber, Sheri: Context is the most critical aspect of alt-text everyone seems to miss, UX Collective, 01.10.2020.
  This article points out that context affects whether an image needs a text alternative and what that text alternative should look like. The same image may need a different text alternative depending on the context in which it is used.
• Coyier, Chris: Some Things About `alt` Text, CSS-Tricks, 09.03.2018.
• Kettner, Patrick: Creating Responsive Image Maps, Patrick Kettner's blog, 31.12.2017.
• Sollinger, Stefan: Five golden rules for compliant alt text, AbilityNet blog, 14.02.2014.
• Wahlbin, Kathy: Making Images Visible to Blind Users, Interactive Accessibility, 10.10.2012.
• Avila, Jonathan: CSS Background Images and Accessibility, Level Access, 14.06.2011.
• Sharif, Ather: A Picture Says a Thousand Words, But Not Really, 24 Accessibility, 06.12.2019.
• Faulkner, Steve: short note on emoji text alternative variations, HTML Accessibility, 17.01.2022.
• Garaventa, Bryan: How the W3C Text Alternative Computation Works, Level Access, 21.12.2015.
• How to make images accessible for people, Twitter Help Center. This explains how to add text descriptions to images you post on Twitter.
• Lyons, Kim: Twitter rolls out its ALT badge and improved image descriptions, The Verge, 07.04.2022.
• Archibald, Jake: Writing great alt text: Emotion matters, JakeArchibald.com, 04.08.2021.
• A Guide to Writing Accessible Alt Attributes for Images, Infographics and More!, Scribely, 06.04.2020.
• Image ALT Tag Tips for HTML, IT Accessibility Group, Pennsylvania State University (no date; accessed on 20.01.2022).
• Edwards-Onoro, Deborah: 10 Things to Know About Twitter’s Alternative Text for Images, Lireo Designs, 01.06.2020.
• Wold, William: Twitter Required Alt Text, Firefox Browser Add-ons (accessed on 23.07.2021).
  Small extension that will force you to add alt text to images when tweeting.
• Camel casing your hashtags improves accessibility: screen readers announce each word separately. (Jennifer Aldrich citing Deborah Edwards-Oñoro on Twitter, 21.09.2020)
• DiBenedetto, Chase: A guide to writing accessible image captions, Mashable, 24.02.2022.
• Confused by the alt, title and longdesc Attributes of Images?, NUEWeb, 26.07.2021.
  This blog post discusses the attributes alt, title and longdesc but does not mention that longdesc is no longer part of HTML 5, nor does it discuss alternative to longdesc.
• Alt text helps the visually impaired experience the James Webb Telescope images, NPR, 22.07.2022.
  This is not about how to provide text alternatives. NASA had been really thorough in its text alternatives for images from the James Webb Telescope and several accessibility experts on Twitter had commented on this.
• Alexander, Huw: How to write accessible descriptions for interactive charts, Highcharts blog, 2019
• Afbeeldingen, 200 OK - Jules Ernst (no date; accessed on 05.10.2022).
• Alternative text for images, VA.gov Design System, last updated on 30.09.2022.
• Watson, Léonie: Thoughts on screen readers and image recognition, Tink, 02.01.2021.
  Conclusion: So here's the thing - image recognition in screen readers is a massive improvement over the absence of anything better, but it isn't better than a text description provided by a content author who knows exactly what's in the image, why its being used and the context its being used in.

Long Descriptions

Note: some of the articles and blog posts listed below are only of historical interest and document a number of attempts to support long descriptions after the HTML 5 specification deprecated the longdesc attribute. The WHATWG's HTML specifcation lists longdesc among the non-conforming features.

• How to Write Long Descriptions, Metropolitan State University of Denver (no date; accessed on 16.05.2022).
• How to Write Long Text Alternatives, Information Technology Systems and Services, University of Minnesota Duluth (no date; accessed on 01.07.2022).
• Complex Images, Web Accessibility Initiative (WAI), W3C (no date; accessed on 16.05.2022).
• Groves, Karl: Longdesc – Where are the alternatives?, karlgroves.com, 26.08.2014.
• Research: longdesc: a website that was created and maintained by Laura L. Carlson after HTML 5 declared the longdesc attribute obsolete.
• Çelik, Tantek: Disappointed in @W3C for Recommending Longdesc , tantek.com, 26.02.2015.
• Describing Images for Improved Web Accessibility, mediacurrent blog, 04.08.2015.
  Among other things, this blog post links to Dirk Ginader's jQuery Accessible Longdesc Plugin, which has not been updated since 2012.
• Lembree, Dennis: Longdesc & Other Long Image Description Solutions — Part 1: The Issues, SitePoint, 27.04.2011.
• Lembree, Dennis: Longdesc & Other Long Image Description Solutions — Part 2 of 2: The Solutions, SitePoint, 11.05.2011.
• Lawson, Bruce: longdesc in HTML5, Bruce Lawson's personal site, 31.03.2011.
• Surkov, Alexander: Firefox 14: what's new for AT developers, Alex's blog, 11.05.2012.
  This blog post describes a new way to support long descriptions in Firefox 14. It also contains the following comment by Richard Schwerdtfeger: I have had discussions on this with David Bolter, Dominic Mazzoni, and Silvia Pfeifer. What we came to agreement on was that we should have an attribute that takes a URL. We were designing on aria-describedat. When provided, the user agent would provide a visual indicator of its choice. I suggested a an icon with the letter i at the upper right corner of the the element being rendered to indicate that more information was available. We also agreed that author ought to be able to redefine the look of the indicator using a style sheet. Upon either a key command, gesture, etc. (depends on the browser) the user agent would either bring up a menu of choices to choose from (the context menu) that would include a menu item that said "more information" or automatically generate a new window with the content. Once the new window was activated the user agent needs to provide a vehicle (say the escape key) to bring the user back to the place in the original document where they left off.
  This provides real mainstream value add to all users without the need to provide a separate anchor element. Point of sale systems, informational kiosks (museum or library), would be able to make use of this.
  It should be up to the browser to define how the availability of additional information gets rendered, how the information is accessed and how the user returns back to the original document. This is very important. I think the thoughts were that the ARIA spec. people were trying to dictate this functionality in the browser and we are not. In fact, doing so would not make sense.
• Faulkner, Steven: Firefox 14: image long description via link using aria-describedby, TPGi blog, 11.05.2012.
  This article refers to Alexander Surkov's blog post and contains another comment by Richard Schwerdtfeger: I have a very strong opinion that this use of describedby is not a good one. Please see my comments on [Surkov's blog post].
• Configuring Internet Explorer to handle longdesc, Microsoft Accessibility Blog, 25.03.2011.

Accessible SVG

• O'Hara, Scott: Contextually Marking up accessible images and SVGs, scottohara.me, 22.05.2019, 03.09.2022.
  This blog post discusses how to mark up img elements that load SVG files, either on their own or in interactive elements such as links or buttons. It also shows how to mark up inline SVGs. The blog post also contains links to test files and other articles and blog posts.
• How To Make SVG File Accessible For Screen Readers, Amberd, 25.05.2022.
  This article discusses the title and desc elements as direct children of the svg element and the attributes aria-labelledby and aria-describedby, which can (or should) be added to the svg element. It also discusses how to hide text inside SVGs from screen readers. It does not discuss inline SVG.
• Vinkle, Scott: SVG and Emoji Icon Accessibility, Scott Vinkle's blog, 06.12.2018.
• title element (svg), Accessiblity Support, probably last updated in August 2021 (last accessed on 12.12.2022).
  According to tests from 2021, support in Firefox and Safari was lacking or incomplete. The site has no tests for SVG's desc element.
• Coyier, Chris: Simple Patterns for Separation (Better Than Color Alone), CSS-Tricks, 18.11.2017.
  Article about charts in SVG, more specifically about using patterns instead of only solid colours. This is important for people with colour vision deficiencies. (Accessibility for screen reader users is outside the scope of this article.)
• Migliorisi, Heather: Accessible SVGs, CSS-Tricks, 06.07.2016, updated on 28.08.2016.
  In addition to SVG image files in img elements, this article also discusses SVG embedding using object and iframe (which is much less common). In those SVG files, Migliorsi recommends role="group and aria-labeledby on the svg element. The aria-labelledby attribute references the image's title and description, and the author also suggests adding a visually hidden text element for NVDA. The third part of the article discusses SVG icons.
  The fourth part of the article discusses complex SVG images, using a chart created in Adobe Illustrator as an example. The svg element gets the attribute role="group" to make the chart traversible. The title and desc elements are referenced by the attributes aria-labelledby and aria-describedby, respectively. The “list” of bars in the bar chart gets the attributes role="list" and aria-label="bar graph", whereas the individual bars get the attribute role="listitem". According to the author's test with a screen reader, the list items are actually read out. (There are link to screen reader demo videos on YouTube.)
  The fifth part of the article discusses high-contrast mode.
• Watson, Léonie: Accessible SVG tables, Tink, 05.08.2017.
  This article shows a basic table in SVG using ARIA roles such as table, row, columnheader, rowheader and cell.
• Watson, Léonie: Accessible SVG line graphs, Tink, 09.09.2017.
  The line graph described in this article was not fully supported by browsers and screen readers at the time of writing.
• Lembrée, Dennis: SVG, Icon Fonts, and Accessibility: A Case Study, 24 Accessibility, 14.12.2017.
• McCathie Nevile, Chaals: SVG Accessibility, recording of a 50-minute presentation introduced by David Sloan (The Paciello Group, 9 June 2017).
• SA Team: 7 solutions for creating more accessible SVGs, Simple Accessible blog, 16.03.2017. This page generated a security warning on 05.04.2023.
• Souza, Alan: ReactJS: Tips and Tricks to create accessible SVG components, Eventil: video recording of a 30-minute tutorial at JSConf 2016.
• Watson, Léonie: Tips for Creating Accessible SVG, SitePoint, 06.05.2014.
• Watson, Léonie: Using ARIA to enhance SVG accessibility, The Paciello Group blog, 19.12.2013.
• Veyfeyken, Gijs: Scalable Vector Graphics (SVG), AnySurfer, 13.07.2018. This article is no longer available (checked on 05.04.2023).
• Fisher, Carie: Accessible SVGs: Perfect Patterns For Screen Reader Users, Smashing Magazine, 26.05.2021 (seven-minute read).
  This article discusses both img elements and inline SVG. The author's recommendations for SVG in img elements are different from what one may expect, i.e. adding an alt attribute is not recommended. For inline SVG, relying only on SVG's built-in features is not sufficient either.
  This article does not discuss how to make graphical or other content inside the svg accessible (other than the title and desc as children of the svg element).
• Hund, David: Figuring out the most robust, accessible markup for SVG Sprite Icons, davidhund on GitHub, September 2015.
• Faulkner, Steve: HTML5 Accessibility Chops: SVG text alternative example, Paciello Group blog, 17.08.2011.
  At the time when this blog post was written, SVG support in assistive technology was almost non-existent.

Mathematical and Scientific Formulas

• Gillen, Mary: MathML: Tutorials for Accessible Math Markup, <accessible-website-services>, 21.08.2017.
• Beautiful and accessible math in all browsers, CssRepo, 05.07.2022.

canvas Accessibility

• Faulkner, Steve: HTML5 canvas sub DOM – updated 29th March 2020, TPGi, 06.02.2015, updated on 29.03.2020.
• Sadecki, Mark: Canvas Accessibility - Past, Present and Future, World Wide Web Consortium, 15.05.2014.

Hyperlinks and Navigation

Hyperlinks

• Roselli, Adrian: On Link Underlines, Adrian Roselli's blog, 15.06.2016.
• Wachs, Maggie: Accessible Links Re:visited, Filament Group, 06.12.2017.
• How to make "Read more" links accessible, Vision Australia (no date; accessed on 03.01.2023).
• Dolson, Joe: Contemplating “read more” links, Accessible Web Design blog, 17.07.2014.
• Sherwin, Katie: “Learn More” Links: You Can Do Better, Nielsen Norman Group, 13.12.2015.
• Cullen, Chip: The Contrast Triangle and The Contrast Triangle (blog post) (11.02.2020).
  About the three-way constraint that arises from the requirement that links that are not underlined need to provide sufficient contrast both with the background and the surrounding text.
• Watson, Léonie: Using the aria-current attribute, Tink, 14.01.2017. About the aria-current attribute, which was included in the WAI-ARIA 1.1 specification (14.12.2017). See also the aria-current design patterns on the same website.
  See also aria-current attribute (aria) on Accessibility Support (accessed on 23.02.2023). At the time when the support data were compiled, aria-current was not supported by Narrator with Edge and by Orca with Firefox.
• Panchang, Sailesh: Text Links: Best Practices for Screen Readers, Degue blog, 06.01.2020.
• Pickering, Heydon: The Accessible Current Page Link Conundrum, HeydonWorks, 14.02.2014.
• McCloskey, Marieke: Writing Hyperlinks: Salient, Descriptive, Start with Keyword, Nielsen Norman Group, 09.03.2014.
• Wild, Gian: Making Accessible Links: 15 Golden Rules For Developers, SitePoint blog, 20.02.2014.
• Wild, Gian: Links and accessibility, AccessibilityOZ (no date).
  Partly republished on SitePoint (20.02.2014).
• Smith, Matt: Phone number links and accessibility, Matt Smith, 29.01.2018.
  Note that at least one of the commenters advises against using the technique presented in this blog post: A quick warning: I hope no one reading this, decides to follows the advice in this article, I'm sure the author had the best intentions with sharing this technique, but if I where him, I would take this article down or at least add a warning (not everyone reads the comments). People stumbling across this article who follow this advice, will make their website *less* accessible.
• Bird, Daisy: How to write better link text for accessibility, The Big Hack, 17.11.2021.
• Accessibility and phone number formatting, That Dev Girl, 02.11.2016.
  This blog post recommends using an aria-label attribute.
• Roselli, Adrian: Block Links, Cards, Clickable Regions, Rows, Etc., Adrian Roselli, 17.02.2020, last updated on 19.04.2021.
• Strohmeier, Joel: How to build accessible cards–block links, Nomensa, 11.08.2020.
• How Many Hyperlinks Are Too Many for Accessibility?, Bureau of Internet Accessibility blog, 02.03.2022.
  Quote: As recently as 2008, Google’s guidelines page recommended "fewer than 100" hyperlinks per web page. While that’s a useful rule of thumb, some websites (for instance, large ecommerce sites) might have legitimate reasons to publish pages with a greater number of links.
• Nee, 'klik hier' is geen goede link, Wablieft, 10.01.2023 (three-minute read).
• Smith, Jared: WCAG 2.0 and Link Colors, WebAIM, 22.07.2009.

Skip Links

• Sethfors, Hampus: Your skip links are broken, Axess Lab, 21.06.2018.
• What Is a Skip Link and How Does It Work?, Bureau of Internet Accessibility blog, 08.12.2020.
• Des liens d’évitement astucieux, Atalan, le Blog, 22.11.2012.

Breadcrumb Trails

• How Can I Make Breadcrumbs Accessible for People with Disabilities?, Bureau of Internet Accessibility blog, 07.04.2022.
• Nielsen, Jakob: Breadcrumb Navigation Increasingly Useful, Nielsen Norman Group, 10.04.2007.
• Meiert, Jens Oliver: The Curious Case of Breadcrumbs in HTML, Meiert.com, 03.10.2013, revised 12.12.2016.

Landmarks

• Hellbusch, Jan: Landmarks mit ARIA und HTML, hellbusch.de, 22.07.2016.
• O'Hara, Scott: Accessible Landmarks, scottohara.me, 03.03.2018, updated on 09.05.2022.
• Landmarks (Web Accessibility Checklist), Deque University (no date; accessed on 16.11.2022).
• Implementing Web Accessibility: A Guide to Aria Landmarks, UsableNet blog, 18.11.2020.
• Watson, Léonie: Using navigation landmarks, Accessibility in government blog, 27.05.2016.
• Faulkner, Steve: Using WAI-ARIA Landmarks – 2013, The Paciello Group Blog, 12.02.2013.

Navigation Menus and Fly-Out Menus

• Adobe Accessibility: Accessible Mega Menu: A demonstration of how to implement a keyboard and screen reader accessible mega menu as a jQuery plugin. See also Accessible Mega Menu on GitHub (Apache 2.0 licence).
• Thompson, Terrill: Accessible Dropdown Menus Revisited, Terrill Thompson, 02.12.2013.
• Fly-out Menus, Web Accessibility Initiative: Web Accessibility Tutorials, last updated on 23.08.2018.
• Garaventa, Bryan: Creating Accessible Menus and Mega Menus, Level Access, 09.02.2018.
• Kravets, Una: Solved with CSS! Dropdown Menus, CSS Tricks, 01.05.2018.
  The CSS code in this article relies on the pseudo-class :focus-within in the Selectors Level 4 specification, which was only a draft specification at the time of writing. See Marcy Sutton's comment on the additional work that is required for accessibility. See also Andrea Fercia's comment about issues with tabbing backwards.
• Saucier, Adam: Accessible Keyboard Navigation, Adam Saucier's website, 13.06.2018.
  This article takes Marcy Sutton's comments on Una Kravets' article into account.
• Coyier, Chris: Wrapup of Navigation in Lists, CSS-Tricks, 04.02.2013.
  An earliler article by Chris Coyier about lists provoked a respose from Dennis Lembree: Leave Accessibility to the Experts Please (01.02.2013).
• Zehe, Marco: WAI-ARIA menus, and why you should generally avoid using them, Marco's Accessibility Blog, 22.09.2018.
• 4 Reasons Your Website Drop-Down Menu Has to Die (and What to Do Instead), Gill Andrews, 04.01.2019.
• Evans, Alicia: Let’s Focus on Slide-Out Navigation, Knowbility Blog, 26.03.2020.

Form Accessibility

Labelling Form Controls

• Swallow, David: Labeling the point: Scenarios of label misuse in WCAG, TPGi, 06.01.2022.
• Faulkner, Steve: Short update on multiple labels for , steve faulkner on CodePen, 22.08.2019.
  Conclusion: Do not provide multiple labels for a control using the label element. Although it has been possible, as per the HTML specification, for many years, this technique is simply not well supported and may never be. As an alternative to using multiple labels, you can wrap the label element around the form control or use the aria-labelledby attribute.
• The <label> element, Max Design, 23.11.2022.
• Clarification on 3.3.2: Labels or Instructions with regard to required fields and Sufficient Techniques, WCAG issues (on GitHub), submitted on 05.05.2022.
  Question about the ambiguity whether WCAG requires indicating that form fields are required.
  Based on the discussion of this issue, it is not clear that WCAG requires required fields to be identified. (Note also that required fields are so common that failing to identify them as such would be documented as a common failure for SC 3.3.2.)

required and aria-required

• O'Hara, Scott: Required attribute requirements, The Paciello Group blog, 13.02.2019.
  This blog posts says that HTML 5's required attribute is well supported by TalkBack on Android. For some screen readers, form elements using the required attribute also need the attribute aria-invalid="false" in order to prevent screen readers from claiming that the field is “invalid”.
• Peri, Raghavendra Satish: The Anatomy of Accessible Forms: Required Form Fields, Deque blog, 11.06.2019.
• Panchang, Sailesh: Aria-required=true: WCAG 2 Compliance versus Best Practice, Deque blog, 05.12.2013.

Form Field Validation and Error Messages

• Roselli, Adrian: Avoid Default Field Validation, Adrian Roselli, 20.02.2019, updated on 05.05.2022.
  This blog post identifies various issues with browser validation of required fields. When a field for an e-mail address that needs to fit a certain pattern is validated, the pattern is not communicated to the user by screen readers (nor to any other users). This is a failure of success criterion 3.3.5 (Error Suggestion). If error identification relies on a change of colour in the field's border or outline, it fails success criterion 3.3.1 (Error Identification) and, according to Roselli, also success criterion 4.1.2 (Name, Role, Value). (Success criterion 4.1.2 is not limited to content implemented using markup languages, so it applies to the browsers status and error messages as well.) It is not clear from Roselli's blog post whether status and error messages generated by the browser expose their name, role and value to assistive technologies; if they don't, they fail success criterion 4.1.2. In the end, writing your own validation is best for accessibility, even though it is not easy.
• Genovese, Greg: Form Errors Screen Readers Can Acces, Cantina blog, 29.03.2017.
• Avila, Jonathan: How to Provide Accessible Form Error Identification, Level Access, 04.08.2014.
• Creating accessible input errors and help text, Pulsar (on Medium), 16.05.2018 (four-minute read).
  This blog post is about helpers in the Twig templating engine.

Grouping Form Controls (fieldset, legende

• Watson, Léonie: Using the fieldset and legend elements, Accessibility in government blog, 22.07.2016.
• Pieters, Simon: The state of fieldset interoperability, The WHATWG Blog, 19.09.2018.
• Fairchild, Michael: legend element (html), Accessibility Support, October 2019 (Creative Commons).
  According to this page, screen reader support for the elements fieldset and legend is still not ideal.
• Faulkner, Steve: Fieldsets, Legends and Screen Readers, Paciello Group blog, 22.11.2007.
  This is a very dated blog post about support for the elements fieldset and legend by the screen readers JAWS 8 and Window-Eyes 5.5 combined with the browsers Internet Explorer 7 and Firefox 2.
• How to group form inputs accessibly without a fieldset? — a question on StackOverflow.

The placeholder Attribute

• Faulkner, Steve: placeholder - the piss-take label, CodePen, last updated 23.05.2019.
  Using the placeholder attribute as the only visible label for a control that requires user input fails Success Criterion 3.3.2 Labels or Instructions.
• Faulkner, Steve: aria-placeholder test, codepen.io. See Steve Faulkner's tweet from 19.10.2020: aria-placeholder does not provide a fallback accessible name for either custom or native inputs.
• Bailey, Eric: Don’t Use The Placeholder Attribute, Smashing Magazine, 20.06.2018.
• Sherwin, Katie: Placeholders in Form Fields Are Harmful, Nielsen Norman Group, 11.05.2014, updated 10.09.2018.
  The articles provides the following summary: Placeholder text within a form field makes it difficult for people to remember what information belongs in a field, and to check for and fix errors. It also poses additional burdens for users with visual and cognitive impairments.
  The article lists seven usability-related reasons why using placeholders instead of proper labels is bad. It goes on to point out that using placeholders can still cause the same seven issues, even though they would be less severe. It also gives three reasons why placeholder text is generally bad for accessibility.
• Faulkner, Steve: re-upped: placeholder – the piss-take label, HTML Accessibility, 14.02.2021.
• Silver, Adam: 11 reasons why placeholders are problematic, Simple = Human (on Medium), 16.06.2016.
• MacDonald, David: Is placeholder text a sufficient accessible label for form fields, David MacDonald Web Accessibility Blog (no date, probably 2018).
• placeholder et accessibilité, Atalan, le Blog, 26.11.2015.
• Does placeholder text need to meet color contrast requirements?, Accessible Web, (no date; accessed on 23.02.2023).
  The placeholder test must meet the same contrast requirements as normal text.
• Placeholder Research, Low Vision Accessibility Task Force wiki (W3C), last updated in June 2016 (accessed on 23.02.2023).

Other Aspects of Forms

• Johansson, Roger: Accessible custom checkboxes and radio buttons, 456 Barea Street, 16.11.2012.
• Bhandari, Aditya: Pure CSS: Accessible Checkboxes and Radios Buttons, Clarity Design System on Medium, 03.02.2017 (four-minute read).
• Coyier, Chris: Overriding Default Button Styles, CSS-Tricks, 09.05.2018.
• Rockowitz, Jacob: Caring about webform accessibility, Jacob Rockowitz, 06.08.2018.
• O'Hara, Scott: Short note on the accessibility of styled form controls, The Paciello Group blog, 31.07.2018.
• O'Hara, Scott: Unbuttoning Buttons, scottohara.me, 03.10.2018.
• Grigsby, Jason: An HTML attribute potentially worth $4.4M to Chipotle, Cloud Four, 19.09.2019.
• Roselli, Adrian: An HTML Element Potentially Worth $18M to Indiegogo Campaigns, Adrian Roselli, 24.09.2019.
• Faulkner, Steve: Short note on fieldset and legend semantics, CodePen, last updated 01.05.2019.
• Create custom keyboard accessible checkboxes, a11y with Lindsey, 27.11.2018.
• Accessible Styled Form Controls, Scott O'Hara, 26.07.2018, updated on 16.12.2018.
• Caspers, Thomas: Reine Formsache, Einfach für Alle (no date).
  This is the first part of a series of articles about accessible forms.
• Caspers, Thomas: Formulardesign, Einfach für Alle (no date).
• Caspers, Thomas: Technik: HTML & CSS für Formulare, Einfach für Alle (no date).
• Klare Formulare, Barrierefreies Webdesign (no date).
• Zehe, Marco: Easy ARIA tip #8: Use aria-roledescription to selectively enhance the user experience, Marco Zehe, 05.07.2018.
• Watson, Léonie: Using the aria-roledescription attribute, Tink, 13.12.2018.
• Verou, Lea: What is the best way to mark up an exclusive button group?, Lea Verou, 14.07.2022.
• Rendle, Robin: Customise radio buttons without compromising accessibility, CSS-Tricks, 10.09.2018, updated on 28.02.2019.
• Soueidan, Sara: Inclusively Hiding & Styling Checkboxes and Radio Buttons, Sara Soueidan, 16.06.2020.
• Les formulaires HTML, Ronan HELLO (no date; accessed on 04.05.2023).
  This is a general introduction to forms that does not focus specifically on accessibility.

Tables

• Watson, Léonie: How screen readers navigate data tables, Tink, 28.09.2020.
• Roth, Franklyn: Create accessible data tables, The A11y Project, 05.03.2016.
• Roselli, Adrian: Hey, It’s Still OK to Use Tables, Adrian Roselli's blog, 01.11.2017.
• Pickering, Heydon: Data Tables, Inclusive Components, 31.03.2018. (This article also discusses responsive tables.)
• Creating Accessible Tables — Page 2: Data Tables, WebAIM, last updated on 18.09.2017. (This article does not cover responsive tables.)
• Rizzo, Davide: Accessible, Simple, Responsive Tables, CSS-Tricks, 10.04.2017. (This article does not cover row-oriented tables that have column headers.)
• Faulkner, Steve: Short note on scoping mechanisms, Paciello Group Blog, 07.01.2019. This short blogpost shows that the scope attribute is not needed on simple data tables with one row or column with th elements or with both one row and one column with th elements.
• Caspers, Tomas: Benimmregeln für Datentabellen, Barrierefreies Webdesign, 2008.
• Responsive tables, ESDC / IT Accessibility office (Government of Canada), last updated 23.08.2022.
• Boudreau, Denis: Use aria-describedby to provide an overview of data tables, a11yTips, 05.03.2014.
• Caption & Summary , Tables Tutorial, Web Accessibility Initiative (no date; accessed on 03.01.2023).

CSS-Generated Content (Including Counters)

• Groves, Karl: CSS generated content is not content, Karl Groves, 26.08.2013.
  Note that screen readers started adding support for CSS generated content in the years after this blog post was written.
• CSS content and screen readers (JAWs), a question posted on Stack Overflow in June 2016.
• Northup, John: Screen Readers and CSS: Are We Going Out of Style (and into Content)?, WebAIM blog, 28.08.2017.
• CSS content: property: Screen reader compatibility, PowerMapper, 20.05.2018.
• Roselli, Adrian: F87: CSS Generated Content and WCAG Conformance, Adrian Roselli, 24.02.2019.
• Faulkner, Steve: Super short note on CSS text, CodePen, 22.07.2019.
• Roselli, Adrian: Alternative Text for CSS Generated Content, Adrian Roselli, 13.10.2020, last updated on 09.06.2022.
  The September 2020 draft of CSS Generated Content Module Level 3 allows authors to specify a text alternative for an image inserted as CSS-generated content. This relies on code such as .oneStar::before { content: url(./img/star1.gif) / "One star!"; }. Mid October 2020, browser support for this mechanism is only available in Chrome and other Chromium-based browsers. By December 2021, browser and screen reader support was still insufficient to justify providing alternative text in CSS-generated content.
• How is CSS pseudo content treated by screen readers?, Accessible Web, 12.09.2019, updated on 04.09.2020.
• Test: CSS generated content with alt text, Accessibility Support, last updated on 29.07.2021.
  At the time of the last update, text alternatives provided by means of CSS-generated content was not supported by Firefox and Safari. (Orca was only tested with Firefox.)
• Judis, Stefan: The CSS "content" property accepts alternative text, Stefan Judis Web Development, 29.04.2020, laste updated on 13.12.2021.
  This article discusses browser support but not screen reader support.

Other CSS-Related Topics

• Verou, Lea: Custom properties with defaults: 3+1 strategies, Lea Verou, 15.10.2021.
• Joco: The effect of CSS on screen readers, Use Less Divs, 02.09.2021.
• Myers, Ben: CSS Can Influence Screenreaders, Ben Myers, 11.02.2020.
• Montoro, Alvaro: Creating Accessible CSS Art, Alvaro Montoro's blog, 08.07.2021.

CAPTCHA

Issues with CAPTCHA

• Hollier, Scott; Sajka, Janina; White, Jason; Cooper, Michael: Inaccessibility of CAPTCHA: Alternatives to Visual Turing Tests on the Web, W3C Working Group Draft Note 16 December 2021.
• May, Matt: Inaccessibility of CAPTCHA: Alternatives to Visual Turing Tests on the Web, W3C Working Group Note 23 November 2005 (outdated).
• Watson Hyatt, Glenda: Do CAPTCHAs Block Spam or Your Readers?, Blog Accessibility, 21.10.2010.
• Google CAPTCHAs Nearly Blocked Me from Completing Work Blog Accessibility, 13.11.2010.
• Kadlec, Tim: Death to Captchas, TimKadlec.com, 04.01.2011.
• Brignull, Harry: F**K CAPTCHA, 90 Percent of Everything, 25.03.2011.
• CAPTCHAs shown to yet again impede accessibility, Media Access Australia, 06.06.2011.
• Hess, Michael: The Worst Thing to Put on Your Company Website, CBS News, 05.10.2011.
• Wasserman, Todd: Stanford Researchers Crack Captcha Code, Mashable, 02.11.2011. This article is not about inaccessibility issues for people with disabilities but the the software discussed in the article (Decaptcha) but gave accessibility advocates the argument that CAPTCHAs will turn out to be better at keeping out people with disabilities than at keeping out spam bots.
• Foliot, John: Not The Blog Post I Was Going To Write Today, Unrepentant, 05.11.2011. (Licence: CC-BY-NC-SA.)
• Christopherson, Robin: Why are disabled people treated like spammers?, UsabilityNet, 08.10.2012.
• Cluley, Graham: Chess CAPTCHA – a serious defence against spammers?, Naked Security (Sophos blog), 12.03.2013.
• CAPTCHA Hall of Shame.
• Danchev, Dancho: Report: Google's reCAPTCHA flawed, ZDNet, 15.12.2009.
• Lardinois, Frederic: Video CAPTCHAs Promise Better Security, Less Frustration, ReadWrite, 30.06.2010. Discusses the adaptive CAPTCHA challenges by the company NuCaptcha; which also offer voiceover audio as an accessibility feature. (This would still be inaccessible to deaf-blind users.)
• Petition | (Wayne Hawkins) It's time to finally kill CAPTCHA, Change.org.
• Eden, Terence: CAPTCHAs don't prove you're human - they prove you're American, Terence Eden’s Blog, 27.11.2017.
• CAPTCHA and accessibility, NZ Digital government, last updated on 10.08.2020.
• balcilar / Audio-Captcha-Recognition: a GitHub repository by Muhammet Balcılar containing research data showing that statistical techniques for extracting all of the digits from an audio CAPTCHA can reach 89% accuracy. (According to the research project Usable Audio CAPTCHAs at the University of Washington (Seattle), sighted users have less than 50% success rate for the most common Audio CAPTCHAs.)
• Wild, Gian: CAPTCHA: Inaccessible to Everyone, Sitepoint, 07.02.2013.
• Krishnan, Gautam: Accessibility vs Security: Breaking CAPTCHAs by exploiting their accessibility features, UX Planet, 05.03.2019 (seven-minute read).
• Sethfors, Hampus: Captchas Suck, Axess Lab, 02.11.2017.
• Captcha Alternatives and thoughts, WCAG Working Group wiki, last updated on September 2020. (Accessed on 18.03.2023.)
  This wiki page represents research done until 2015 is no longer being updated.
• CAPTCHA Usage Distribution in the Top 1 Million Sites, Built With (no date; accessed on 18.03.2023).
  This is not about accessibility but instead shows that Google's reCAPTCHA has 97% of the “market share” for CAPTCHAs.

Accessible CAPTCHAs and CAPTCHA Alternatives

• Marion, Frank: A Very Simple And Effective Captcha, evolt.org, 07.03.2008.
• Bushell, David: In Search Of The Best CAPTCHA, Smashing Magazine, 04.03.2011.
• Garaventa, Bryan: The importance of covering all bases when implementing Captcha, Level Access, 12.01.2012. (Originally posted on the SSB BART Group's blog on 12.01.2012.)
• Groves, Karl: CAPTCHA-less Security, Karl Groves (blog), 03.04.2012.
• Roselli, Adrian: ReCAPTCHA Reboot, Adrian Roselli (blog), 05.12.2014.
• Captcha en andere anti-spamtechnieken, AnySurfer (no date).
• Earl, Crista: Can CAPTCHAs Be Made Accessible? , American Foundation for the Blind (AFB) blog, 21.08.2014.
  At the time of publication, the blog post had a comment function that required passing a CAPTCHA that was deemed accessible for most people. The comment function is no longer enabled, so the CAPTCHA can no longer be seen. (Accessed on 18.03.2023.)

Colour and Contrast

• Henke, Anika: How users change colours on websites, Accessibility in government blog (Gov.uk), 27.03.2017 (accessed on 20.01.2023).
• Designing for Color Contrast: Guidelines for Accessibility, Bureau of Internet Accessibility blog, 21.10.2021.
• Sethfors, Hampus: Colorblind Accessibility on the Web – Fail and Success Cases, Axess Lab, 06.09.2017.
• Stribley, Mary: Website Color Schemes: The Palettes of 50 Visually Impactful Websites to Inspire You, Canva Learn blog, 26.01.2016.
• Nelson, Nick: Colour and contrast — the 2 essential ingredients of accessible design, Australian Government – Digital Transformation Agency blog, 19.01.2018.
• Baker, Justin: The Science of Color Contrast — An Expert Designer’s Guide, Muzli (Medium), 24.01.2018 (four-minute read).
• Campbell, Alastair: Oddities in color perception, AlastairC, 04.04.2019.
  This blog posts contains examples of white and black text on a white backgroud and points out that the comparative readability of both texts depends on their context.
• Coady, Geri: Colour Accessibility, 24 Ways, 04.12.2012.
• Sutton, Marcy: Clarifying Color Contrast & Font Size Guidelines, Testing Accessibility, 20.09.2022.
  An article about WCAG success criteria 1.4.3 and 1.4.11.
• Le guide de conception d'interfaces accessibles aux daltoniens, Visionary (no date; accessed on 08.09.2022).
• Stopping the bots with Javascript, CANAXESS, 13.09.2020.
• Weckenmann, Sonja: Barrierefreie Kontraste, Tollwerk, 17.11.2020.
• Abrams, Doug: An argument against CSS opacity, TPGi, 30.08.2022.
• Lloyd, Ian: Well Color Us Surprised—This SC Can Be a Tricky Customer, TPGi, 13.04.2022.
• Harley, Aurora: Ensure High Contrast for Text Over Images, Nielsen Norman Group, 18.10.2015.
• Lyonnais, Sheena: Accessibility Design 101: Color Contrast Considerations for UX Designers, Adobe Xd Ideas, 22.04.2020.
• Woodhouse, Pete: Unexpected benefits of colour and contrast standards, Ingeniously Simple (on Medium), 20.11.2017.
• Baldwin, Nate: Accessible color for design systems just got easier, Nate Baldwin on Medium, 09.05.2022 (six-minute read).
  This blog post is about the online tool Leonardo. (See also the Leonardo repository on GitHub, where the tool's code is available under the terms of the MIT licence.
• Somers, Andrew: The Realities And Myths Of Contrast And Color, Smashing Magazine, 06.09.2022 (26-minute read).
• Accessible Color Best Practices, University of California San Francisco (no date; accessed on 23.02.2023).
• Walter, Stéphanie: Accessibilité et couleurs : outils et ressources pour concevoir des produits accessibles, Stéphanie Walter, last updated in February 2023 (accessed on 18.05.2023).
• Web Accessibility: Understanding Colors and Luminance, MDN WebDocs (no date; accessed on 04.05.2023).
• Silver, Adam: Improving The Color Accessibility For Color-Blind Users, Smashing Magazine, 21.06.2016 (eight-minute read).
• Gupta, Manisha: Why is color accessibility important?, Adobe Blog, 20.05.2021.
• Babich, Nick: Accessibility for Visual Design, UX Booth, 27.06.2017.
• Why APCA as a New Contrast Method?, APCA (Myndex Research) (no date; accessed on 25.03.2023).
  This article discusses the Accessible Perceptual Contrast Algorithm (APCA) as a potential (or likely) contrast algorithm for WCAG 3.0. The contrast ratio algorithm in WCAG 2.0 has several weaknesses, especially for ensuring good contrast in dark mode.
  See also WCAG 2 vs APCA Contrast Shootout.
• MacWright, Tom: Accessibility: Color contrast is a problem, macwright.com, 30.03.2019.
• O'Connor, Ericka: Orange You Accessible? A Mini Case Study on Color Ratio, Bounteous blog, 22.03.2019.
• anthony: The Myths of Color Contrast Accessibility, UX Movement, 16.10.2019.
• Nichols, David: Coloring for Colorblindness, David Nichols (no date; accessed on 18.05.2023).
• Ferreira, CR: Two Simple Steps to Create Colorblind-Friendly Data Visualizations, Towards Data Science, 26.04.2020 (eight-minute read).
• Inclusive Design: Colour Accessibility, KOMODO Digital, 19.04.2021, updated on 25.03.2022.
• Creating accessible charts and graphs, Harvard University Information Technology, 12.10.2022.
• Accessible data visualizations, UW–⁠Madison Information Technology, 25.08.2021.
• Gaskin, Jennifer: Color Blind Design Guidelines: How to Convey Meaning to Everyone [With Examples & Templates], Venngage blog, 13.01.2023.
• Cravit, Rachel: How to Use Color Blind Friendly Palettes to Make Your Charts Accessible, Venngage blog, 30.11.2022.
• Design Glossary: Basic Color Terminology, Design4Users (no date; accessed on 04.05.2023).

Dark Modes, Dark Themes and High Contrast

It is important to distinguish high-contrast dark modes from dark modes for people with light sensitivity (and for dark environments). In high-contrast dark modes, which usually have white text (or sometimes yellow text) on a black background, users with light sensitivity find that letters get blown out. Unfortunately, most operating systems that provide high contrast modes don't provide an alternative dark mode for people with light sensitivity.

• Styling for Windows high contrast with new standards for forced colors, Microsoft Edge Blog, 17.09.2020.
• Roselli, Adrian: WHCM and System Colors, Adrian Roselli, 10.02.2021, updated on 13.07.2022.
• Roselli, Adrian: OS: High Contrast versus Inverted Colors, Adrian Roselli, 11.08.2022, updated on 24.11.2022.
• Byrne-Haber, Sheri: Dark UI themes are new and cool — but are they accessible?, UX Collective, 16.09.2019 (4-minute read).
• Dark Mode Can Improve Text Readability — But Not for Everyone, Bureau of Internet Accessibility blog, 07.07.2021.
• Diaz, Cristian: The Guide To Windows High Contrast Mode, Smashing Magazine, 15.06.2022.

Web Applications and WAI-ARIA

WAI-ARIA: Introductions and Overviews

• Kalcevich, Kate: Making Sense Of WAI-ARIA: A Comprehensive Guide, Smashing Magazine, 13.09.2022 (fourteen-minute read).
  This is a good introductory article for anyone who knows HTML, CSS and a little bit of JavaScript.
• Zehe, Marco: What is WAI-ARIA, what does it do for me, and what not?, Marco's Accessibility Blog, 27.03.2014.
  This introduction was written one week after WAI-ARIA 1.0 was published as a W3C recommendation.
• Lemon, Gez: Introduction to WAI ARIA, Dev.Opera, 01.08.2008. German translation: Einführung in WAI ARIA (German translation by Stefan Walter).
  Note that the article has not been updated since 2009.
• Watson, Léonie: Short note on progressive ARIA, Paciello Group Blog, 26.06.2018.
  Intro: When we talk about Progressive Enhancement (PE), we usually focus on HTML, CSS, and JavaScript, and often forget about ARIA. But when ARIA is hard-coded into HTML it can have unintended consequences if/when the JavaScript fails to deliver the expected functionality. One example is repurposing a link as a button: a link is activated using the Enter key, whereas a button is activated by either Enter or the space bar. Without a specific keyboard listener for the space character, the “button” will behave as a link. Another example discussed in the blog post are tables with sorting functionality. Watson concludes: if you use JavaScript to provide functionality and/or any form of interaction, then the ARIA should be applied progressively (using JavaScript) too. In other words, let the accessibility degrade as gracefully as the rest of your code.
• Watson, Léonie: Short note on ARIA support, Paciello Group Blog, 27.07.2018.
  Quote: Of all the available Assistive Technologies (AT), only screen readers (Jaws, Narrator, NVDA, TalkBack, and VoiceOver) properly support ARIA. Recent versions of Dragon also support a limited number of ARIA attributes, so speech recognition users don't benefit greatly from ARIA. Documentation on screen reader support for ARIA is also relatively scarce. Before a new ARIA specification is release by the W3C, support is checked only in accessibility APIs, not in screen readers!
• Watson, Léonie: Using the aria-current attribute, Tink, 14.01.2017.
• Roselli, Adrian: Accessible Description Exposure, Adrian Roselli, 04.04.2022; updated on 18.04.2022.
• MacDonald, David: Demystifying WAI-ARIA: 19 WAI-ARIA attributes that every web developer should know, CanAdapt blog, updated January 2020.
• Ogston, Gavin: Single page applications, Angular.js and accessibility, Simply Accessible, 03.03.2015.
• Damera, Suman: Top 5 Rules of ARIA, Deque blog, 16.07.2019.
  Quote: Rule #1: Don’t use ARIA, use native HTML instead
• Rietveld, Rian: The first rule for using ARIA, The A11Y Collective, 05.08.2021.

Tab Panel

• Hoffmann, Nicolas / Van11y: Accessible tab panel using ARIA. The source code is available under the MIT licence.
• Zehe, Marco: Advanced ARIA tip #1: Tabs in web apps, Marco's Accessibility Blog, 02.02.2013.
• Smith, Jeff: Danger! ARIA tabs, simply accessible, 14.04.2016.
• Adam, Paul J.: ARIA Tab Panel Accessibility: A11y Support Series, Deque blog, 06.07.2016.

Sliders

• Using the slider role, MDN web docs.
• Neethling, Schalk: Accessible Rich Internet Applications - ARIA Slider, DZone, 23.06.2008.
• Hillen, Hans: ARIA Slider, Part 1, The Paciello Group blog, 29.05.2008.
• Hillen, Hans: ARIA Slider, Part 2, The Paciello Group blog, 16.06.2008.
• Hillen, Hans: ARIA Slider, Part 3, The Paciello Group blog, 20.06.2008.

Carousels

• Accessible carrousel using ARIA, Van11y (no date).
• Pickering, Heydon: A Content Slider, Inclusive Components, 22.11.2017.
• Bootstrap 3.3 Carousel Accessibility Examples, jongund (Jon Gunderson (University of Illinois) on GitHub.
• Auto-Rotating Image Carousel Example, WAI-ARIA Authoring Practices 1.2 (W3C on GitHub).
• ARIA carousel example, Accessibility at Athena ICT.
• Carousel Concepts, W3C Web Accessibility Tutorials.
• Wild, Gian: The Unbearable Inaccessibility of Slideshows, Sitepoint, 23.02.2015.
• Accessibility expert warns: stop using carousels, Creative Bloq, 10.07.2013.

Modal and Non-Modal Dialogs

• Modal dialogs, Access & Use, last updated on 13.01.2023 (accessed on 20.01.2023; Creative Commons licence).
• Non-modal dialogs, Access & Use, last updated on 22.09.2020 (Creative Commons licence).
• ARIA Non-Modal Dialog Example, Athena Technologies (no date).
• Hellbusch, Jan: Abgedunkelte Inhalte muss keiner lesen, Webkrauts, Jan. 2018. Article about accessible modal dialogs using WAI-ARIA 1.1.
• O'Hara, Scott: The current state of modal dialog accessibility, Paciello Group blog, 29.06.2018.
• O'Hara, Scott: Having an open dialog, scottohara.me, 05.03.2019, updated on 15.03.2022.
  When the first version of this blog post was written, support for the dialog element was insufficient and it has accessibility issues. By March 2022, support and accessibility had improved but not all issues had been resolved.
• Beattie, Allan: Making an Inclusive Progressively-Enhanced Feedback Form in a Modal Dialog, Allan Beattie's blog, 10.12.2017.
• MODALZ MODALZ MODALZ.

The inert Attribute

• Twersky, Emma: Introducing inert, Chrome Developers, 28.04.2022.
  In Chrome, inert is supported since version 102. When an element has the inert element, neither the element itself nor its descendants can receive focus or be clicked. This gives developers a simpler way to suppress elements from the tabbing order than before, especially for elements to which the attribute aria-hidden="true" has been added to hide from AT. The article describes two major use cases for the inert attribute: (1) when an element is a part of the DOM, but offscreen or hidden and (2) when an element is a part of the DOM, but should be non-interactive. The article also explains that inert content should be identified visually; the inert attribute can be used as in an attribute selector in CSS.
• Bailey, Eric: Focus management and inert, CSS-Tricks, 19.10.2020, updated on 02.02.2022.
  This article points out that on most web content, developers should not modify the focus order. It then discusses focus management, using modal dialogs as an example. Managing focus using JavaScript is complicated but essential for accessibility. The discoverability of interactive elements for assistive technologies can be suppressed via aria-hidden="true", but this does not suppress interactivity. The article gives an example in which a modal dialog is coded as a div element as a child of the body element; while the modal dialog is displayed, the main element, which is its next sibling, is inactive due to the presence of an inert attribute. When the modal dialog is dismissed, the inert attribute is removed from the body element. The last part of the article discusses browser and device support for inert and the cost of using a polyfill.
• Newman, Stephany: Why you should start using the inert attribute when coding your next modal window, Stefany Newman on Medium, 07.01.2023 (seven-minute read).
  The inert attribute can be passed like a football between the modal dialog and the main element. In January 2022, inert was supported by all major desktop and mobile browsers except Firefox (which still did not support it in January 2023). Even though polyfills slow down websites, Stephany Newman argues that [the inert] attribute prevents so many developer mistakes and makes coding faster. Every time I start a new job as an accessibility engineer at a company, the number of bugs I encounter concerning focus in modal dialogs are usually in the hundreds, since it is very difficult to make them accessible. The article's conclusion points out that inert can also be used elsewhere, for example for hamburger menus, off-canvas navigation and modal drop-down dialogs. The attribute is also animatable, unlike display: none.
• WICG/inert: Polyfill for the inert attribute and property, WICG on GitHub (accessed on 21.01.2023).

Other User Interface Components or Widgets

• Inclusive Components by Heydon Pickering is [a] blog trying to be a pattern library. All about designing inclusive web interfaces, piece by piece. Some of the components are also listed below. (See also ARIA Examples, which contains older examples written in jQuery.)
• Wright, Tim: Upgrading DOM Hierarchy for Accessibility with Aria-owns, csskarma blog, 15.10.2017.
• Hausler, Jesse: 4 Major Patterns for Accessible Drag and Drop, Salesforce UX blog, 01.11.2017.
• Sutton, Marcy: Radically Accessible Internet Applications, 48-minute presentation at the Beyond Tellerand conference, Munich, 15–17 January 2018.
• Schneiderman, Harris: Enter The Dragon (Drop): Accessible List Reordering, Smashing Magazine, 30.01.2018.
• Roselli, Adrian: Stop Using ‘Drop-down’, Adrian Roselli, 01.03.2020.
• Faulkner, Steve: HTML5 Accessibility Chops: Just use a (native HTML) button, Paciello Group blog, 19.04.2011.
• Sethfors, Hampus: Disabled buttons suck, Axess Lab, 07.07.2017.
• Higley, Sarah: Playing with state, Sarah Higley, 04.11.2019.
  This article discusses the play/pause toggle button, which one would expect to have a aria-pressed attribute that gets updated when the button is pressed. After some research, however, Sarah Higley comes up with the following recommendation: Change the name, but not the state, of play/pause buttons. Use state for all other toggle buttons.
• Roselli, Adrian: Links, Buttons, Submits, and Divs, Oh Hell, Adrian Roselli's blog, 23.01.2016.
• Ramon, Johan: Datepicker et accessibilité, Atalan, le blog, 02.01.2018.
• Pickering, Heydon: Notifications, Inclusive Components, 27.02.2018.
• Dodson, Rob: Managing focus for accessibility, dev.to, 22.05.2018. This article answers the question, If I'm building a single page web app, what should happen to focus when the user clicks some navigation? When dynamically adding new content to a page, Dodson recommends including a heading with the attribute tabindex="-1" and directing focus to it. This technique should not be used when a user first arrives at the site.
• Lacerda, Filipa: How to Create an Accessible Autocomplete Component with Vue.js, Alligator.io, 28.02.2018.
• IBM: Vue A11Y Calendar (open-source component available on GitHub).
• Whitehouse, Luke: Building an accessible Modal component with React Portals: Part 1, Assortment, 31.05.2018.
• Whitehouse, Luke: Building an accessible Modal component with React Portals: Part 2, Assortment, 07.06.2018.
• Leventhal, Aaron; Dodson, Rob: Why authors should avoid aria-relevant, Dev Channel (Medium), 11.04.2018.
• Roselli, Adrian: Under-Engineered Toggles Too, Adrian Roselli, 07.08.2019.
• WAI-ARIA: aria-current (State), Digital A11Y, 29.08.2018.
• Watson, Léonie: Screen reader support for ARIA live regions, The Paciello Group blog, 17.04.2014.
• Provide helpful error messages, Digital Accessibility, Harvard University (no date).
• Faulkner, Steve: Notes on use of multiple ARIA role attribute values, The Paciello Group blog, 15.10.2015.
• Armfield, Graham: My favourite accessible accordion pattern, Hassell Inclusion blog, 12.12.2018.

Cookie Banners and Overlays

• Herrmann, Marcus: The Potentially Dangerous Non-Accessibility Of Cookie Notices, Smashing Magazine, 24.04.2023 (12-minute read).
• Byrne-Haber, Sheri: Cookie banners and accessibility, Sheri Byrne-Haber's Blog, 25.08.2020.
• Cerovac, Bogdan: Cookie consent banners and overlays – thoughts on accessibility, usability and SEO, Bogdan on Digital Accessibility (A11y), 22.07.2020.
• Caccavello, Fabrizio: Consenso dei cookie: come crearlo accessibile, Webaccessibile.org, 30.03.2021 (accessed on 29.04.2023).
• Caccavello, Fabrizio: Linee guida Garante Privacy e accessibilità, Webaccessibile.org, 27.11.2021 (accessed on 29.04.2023).
  This article refers to an offical guideline on cookie consent accessibility from June 2021 and to an earlier articles on Consenso dei cookie: come crearlo accessibile.

Abbreviations and Acronyms

• Faulkner, Steve: The title attribute – what is it good for? (resurrected), The Paciello Group blog, 12.02.2008.
• Faulkner, Steve: Using the HTML title attribute – Updated March 2020, The Paciello Group blog, 02.11.2010.
• Faulkner, Steve: Short note: The abbreviation appreciation society, The Paciello Group blog, 12.03.2019.
  This blog post points out that support for the abbr element's title attribute is not what people assume: JAWS and NVDA don't announce it by default; VoiceOver does not announce it at all. Moreover, it is only available to mouse users. Instead, authors should provide the abbreviation expansion in plain text.
• Roselli, Adrian: Accessible Emoji, Tweaked, Adrian Roselli, 30.12.2016.
  This blog post is not about abbreviations, but is referenced in Roselli's comment on an article about “Making the abbr element work for touchscreen, keyboard, and mouse”.
• Leadbetter, Tom: The abbr element, HTML5 Doctor, 30.11.2010.
• Day, Alexander: Abbreviations – accessibility for web writers, 4 Syllables, 10.11.2011.
• Lieberman, Colin: The Accessibility Hat Trick: Getting Abbreviations Right, A List Apart, 17.01.2006. At the time when this article was written, WCAG 2.0 was not yet a recommendation, XHTML 2.0 was still under development (and had added the full attribute to the abbr element) and the first draft of HTML5 had not yet been published. The acronym element, which had already been deprecated in XHTML 2.0, is listed as a non-conforming feature in HTML 5.2.

Readability (Language)

• Our tone of voice, Monzo (no date; last accessed on 22.04.2023).
• Measure clarity with readability formulas: How to use Flesch-Kincaid, Gunning Fog indexes, Wylie Communications (no date).
• Easy-to-Read: European Easy-to-Read Guidelines.
• Metts, Michael J.; Welfle, Andy: Standards for Writing Accessibly, A List Apart, 23.01.2020.
• Vincent, Sara: Sentence length: why 25 words is our limit, Inside GOV.UK, 04.08.2018.
• Passive Voice Detector, Datayze (no date; accessed on 22.04.2023).
• Easy Reading: This is a EU-funded project that developed an add-on for Firefox and Chrome to support cognitive accessibility for web content.
• Content principles, Stack Overflow (accessed on 16.03.2021).
  This is a set of guidelines for Stack Overflow employees. Among those guidelines is the following: Write for a 7th grade reading level. Stack Overflow users are busy people with limited time and attention. They’re also located all over the world with different levels of English fluency. You can help everyone follow along by choosing simple, consistent words and phrases, and being careful about jokes and cultural references.
• Moynat, Julie: 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, 05.08.2022, updated on 02.09.2022.

Readability of web content in German:

• Bundesministerium für Arbeit und Soziales: Leichte Sprache - Ein Ratgeber (April 2014).
• Kellermann, Gudrun: Leichte und Einfache Sprache – Versuch einer Definition, Bundeszentrale für politische Bildung, 19.02.2014.
• Fass, Simone: Leichte Sprache: Grundlagen und Diskussion Simone Fass, 07.06.2017.
• Morsbach, Jörg: Leichte Sprache – schwere Sprache, Fronta11y, 16.05.2019.
• Bauer, Wacki: Lesbarkeits-Test: Wie eingängig sind meine Texte?, Philognosie, 26.06.2013.
• de Oliveira, Domingos: Leitlinien/Regeln der einfachen Sprache, netz-barrierefrei.de, 16.06.2016, updated 07.09.2019.
• Praxishilfen: Leichte Sprache, Bundesfachstelle Barrierefreiheit (no date).
• Designforschungsprojekt Leichte Sprache.
• Forschungsstelle Leichte Sprache.
• „Einfach Surfen“ / „Facile à surfer“, EinfachSurfen.ch: Ein Leitfaden zur Gestaltung von einfachen Internet-Benutzeroberflächen für Menschen mit kognitiven Beeinträchtigungen.
• Halbritter, Andrea: Welche Label für Leichte Sprache gibt es?, Côté Langues, 03.03.2022.
• Boudreau, Denis: Ten steps to a more inclusive copy using plain language, Inklusiv Communication, 01.12.2022.
• ( Jouw teksten in duidelijke taal, Wablieft (no date; accessed on 23.02.2023).)

Legibility (Fonts and Design)

• Latin, Matej: 5 Keys to Accessible Web Typography, Better Web Type, 16.06.2019 (14-minute read).
  This article offers several pieces of advice:
  1. Set your base font size in relative units. (The author starts with setting html { font-size: 100%;} and uses rem sizes for other elements. Setting the default font size in pixes is a bad idea because this overrides the browser's default font size.)
  2. Check the colour of your type and only then its contrast. (Since light fonts can be hard to read, it is insufficient to check foreground and background colours in a contrast checking tool. The contrast needs to be high enough optically. The author also discusses the risks of font smoothing.)
  3. Use highly legible fonts. (Legibility is about how easy it is to distinguish one letter from another and readability is about how easy a block of text is to read. Helvetica is notoriously bad at legibility and should be avoided. The author also advises against the use of Arial. Humanist style fonts and serif fonts have fewer legibility problems.)
  4. Shape your paragraphs well. (Line height, line length and font size should not be chose independently but need to be in perfect balance. The ideal line length is between 45 and 75 characters, and longer line lengths should be combined with greater line height. One should also avoid justifying or centre-aligning paragraphs. For more details, see the author's article The Equilateral Triangle of a Perfect Paragraph or his book Better Web Typography for a Better Web.)
  5. Correctly use the heading levels.
• Veroniiiica: My Eight Favorite Free Fonts for Print Disabilities, Perkins eLearning blog, 14.08.2018.
  This blog posts discusses Arial, Helvetica, Bebas Neue (only capitals, can be used for headings), Calibri (high legibility), APHont (specifically designed for low-vision users), Comic Sans (formerly often used as a dyslexia-friendly font), Lavanderia (a cursive font that seems appropriate for people with low vision or dysgraphia) and OpenDyslexic (specifically designed for people with dyslexia).
• Cannon, Cara: Study Shows Personalized Fonts Speed Up Reading, Maintain Comprehension, University of Central Florida News, 06.07.2022.
  Subtitle: Researchers found that changing the font to one better suited to an individual resulted in a 35% increase in reading speed while maintaining comprehension.
• Best Fonts To Use for Website Accessibility, Bureau of Internet Accessibility (BOIA), 20.03.2017.
  Quote: Designers who are looking to maximize the legibility of their websites should investigate fonts that have been created with readers with dyslexia or visual impairments in mind, such as Read Regular, Lexie Readable, and Tiresias. (Whether everyone wants to read content set in Read Regular or Lexie Readable is doubtful.) Quote: When all else fails, the best option for an accessible website is a popular font with a clean, sans serif aesthetic. Some of the most appropriate fonts in this regard are Arial, Helvetica, Lucida Sans, Tahoma, and Verdana. (Arial and Helvetica have poor legibility, as pointed out by Matej Latin.)
• The Readability Group and Gareth Ford Williams: A Guide to Understanding What Makes a Typeface Accessible, UX Collective blog, 14.08.2020.
  The Readability Group created the font faces BBC Reith and Qalam based on research that included people with dyslexia and various types of vision impairments. BBC Reith outperformed Helvetica, Arial, Gill Sans and Tiresias. The articles provides the following guidelines for the choice of font faces:

  1. Use a font style that is appropriate to your audience.
  2. Minimise the occurrence of imposter letter shapes that are designed to be very similar to other letter shapes as part of the typeface’s visual style.
  3. Minimise the occurrence of mirroring letter shapes.
  4. Letters should be easily distinguishable from one another.
  5. Humanist typefaces are generally more legible at smaller sizes than grotesque typefaces.
  6. Ensure the typeface has adequate letter spacing.
  7. There should be a visible difference between capital height and ascenders.
  8. Test the suitability of any typeface/font in context.

  (The Readability Group's website uses the font face Lustria.)
• Don’t Believe The Type! - axe-con 2021 (Deque Systems on YouTube, 50 minutes, 04.11.2022).
  This is a recording of a presentation by three persons who were involved in the creation of the BBC Reith family, the BBC’s corporate accessible typeface. In early November 2022, one of the three members of this Readability Group, Gareth Ford Williams, posted a summary of findings from the study presented in the presentation: 20 fonts tested with 2022 users, over 250 with strong dyslexic traits, every font viewed over 16,000 times within around 7,000 hours of testing. All fonts where balanced using x-height and not pt or pixels, so participants didn't just choose the largest. The study was run on multiple device types that belonged to the users so they were familiar with the devices and settings. (…) The worst performing fonts for the dyslexic group were the ones that were 'designed' for their benefit. Open Dyslexia, Dyslexia and Comic Sans. Which opens up questions about the hypotheses behind them. (…) Fonts in the top ten fonts for dylexics include the following: BBC Reith Sans, SF Pro, Verdana, Segoe UI, Roboto and Calibri.
• Typefaces and Fonts, WebAIM, last updated 27.10.2020.
• Fass, Simone: Mehr Barrierefreiheit im Grafikdesign, Simone Fass, 22.04.2018. The article mentions a few font faces that are good for accessibility: Open Sans, Fira Sans and Neue Frutiger 1450.
• Haley, Allan: It’s About Legibility, Fonts.com (no date).
• Beier, Sofie: Typeface Legibility: Towards defining familiarity, Sofie Beier (no date). This blog post is about Sofie Beier's PhD thesis at the Royal College of Art, submitted in 2009.
• Beveratou, Eleni; Maag, Dalton: The effect of type design and typesetting on visually impaired readers, April 2016 (hosted on ResearchGate)
• Schriftgröße, Leserlich.info (no date; accessed on 11.03.2022).
• Garnham, Phil: Get to grips with accessible web typography, Creative Bloq, 12.10.2017.
• DTALE Design Studio: 10 Best fonts for improving reading experience, The Productivity Revolution on Medium, 31.01.2017 (four-minute read).
  The typefaces listed in this blog post were mostly developed for use on screens; some of them can also be read well in small sizes. However, they were not chosen to improve legibility for people with dyslexia or a vision impairment. The authors chose the following fontfaces: Merriweather, Montserrat, Pluto Sans, Tisa, Droid Sans, Playfair Display, Minion, Open Sans, Bookerly and Literata.
• Reddy, Michael: ADA Compliance: How the Wrong Font Size Can Get You Sued, Digital Authority Partners, 11.12.2019.
  (This article does not constitute design advice. For example, it describes the following typefaces as ADA-friendly: Tahoma, Calibri, Helvetica, Arial, Verdana and Times New Roman.)
• Soueidan, Sara: Design for reading: tips for optimizing content for Reader modes and reading apps, Sara Soueidan's blog, 10.05.2021.
• Atkinson Hyperlegible Font, Braille Institute of America, 2021.
• The Font That Makes Everyone Read Faster - Cheddar Explains (Cheddar on YouTube, 7 minutes, 25.09.2019).
  This is a video about the Lexend fonts developed by Bonnie Shaver-Troup. Note that the video discusses a comparison of reading speeds for Lexend with Times New Roman and only for texts in English, which limits the validity of the claim in the video's title.
• Willliams, Gareth Ford: What’s in a Word?, The Readability Group (on Medium), 22.04.2021.
• Simons, Bart: Welk lettertype is het best leesbaar?, AnySurfer blog, 25.11.2014.

Pixels versus Relative Font Sizes

• Williams, Simon: EM vs REM vs PX – Why you shouldn't “just use pixels”, engage blog, 04.01.2017.
• Galante, Andrés: Accessible Font Sizing, Explained, CSS-Tricks, 23.04.2020.
• Vinkle, Scott: Text Zoom Accessibility Tips, Scott Vinkle, 14.06.2019.
• Savchenko, Ian: Designing for Accessibility: How Text Resizing Works in Different Web Browsers, The PayPal Technology Blog on Medium, 25.01.2022.
• McMahon, Kathleen: Pixels vs. Relative Units in CSS: why it’s still a big deal, 24 Accessibility, 23.12.2019.
• Hoizey, Nicolas: People don't change the default 16px font size in their browser (You wish!), Nicolas Hoizey, 02.03.2016, updated on 15.06.2018..
• Severien, Tim: Stop Maiming Bodies: The Perils of Pixel Font-Size, SitePoint, 04.05.2016.
  This article contains a section that points out the difference between zooming and setting the font size in the browser. Some people only need a bigger font size, not an overall zoom. Setting an absolute font size or base font size in the stylesheet works against this.
• Gil, Austin: Just Use Rem: Choosing between Pixels and Rems in CSS, HackerNoon, 08.12.2022.
• Campbell, Alastair: Pixels vs Ems commentary, AlastairC, 16.08.2018.
• Comeau, Josh W.: The Surprising Truth About Pixels and Accessibility, Josh W Comeau, last updated on 29.11.2022.
• Frain, Ben: Just use pixels, Ben Frain's blog, 20.04.2015.
  This blog post does not take into account that users may set a different font size in the browser.
• Clarence, Theodorus: Back to Basic: Should we use Rem, Em or Pixel?, theodorusclarence.com, 11.03.2021.
• Hovhannisyan, Aleksandr: Use Rems for Font Size to Respect User Preferences, Aleksandr Hovhannisyan, 10.05.2022, updated on 21.05.2022.
• Hovhannisyan, Aleksandr: The 62.5% Font Size Trick, Aleksandr Hovhannisyan, 11.07.2021.

Viewport Width

• Roselli, Adrian: Responsive Type and Zoom, Adrian Roselli, 06.12.2019; updated on 27.09.2022.
• Wright, Tim: Accessibility in Resizing Text, 24 Accessibility, 08.12.2017.

Web Design for Dyslexia

• The Yale Center for Dyslexia & Creativity: this website does not explain how to create content that is easier to process for people with dyslexia, but provides information about the impairment.
• Dawood, Sarah: Designing for dyslexia: a style guide to make reading easy for everyone, Design Week, 22.05.2018.
• Anderson, Shaun: How To Design Websites For Blind/Visually Impaired, Deaf, Disabled & Dyslexic Visitors, Hobo UK SEO Services, 04.04.2018.
• Zusman, Andrew: Designing for Dyslexia, Part 1, UX Booth, 21.10.2014.
• Zusman, Andrew: Designing for Dyslexia, Part 2, UX Booth, 20.01.2015.
• Enigk, Erika: Writing for Dyslexic Readers, QuickAndDirtyTips.com, 08.11.2012.
• Anthony: 6 Surprising Bad Practices That Hurt Dyslexic Users, UX Movement, 23.01.2011.
• Rochford, John: Web Site Design Suggestions for People with Dyslexsia, Clear Helper, 14.12.2009.
• Barstow, John C.: Adding A Dyslexia-Friendly Mode To A Website, Smashing Magazine, 23.11.2021 (twelve-minute read).
• Hassell, Jonathan: Dyslexia Barriers: presentation at the Scripting Enabled conference in September 2008 (slides hosted on SlideShare).
• Chen, Chwen Jen; Keong, Melissa Wei Yin: Affording inclusive dyslexia-friendly online text reading (PDF), Universal Access to the Information Society, 16 (2017): 951–965.

Font Faces for People with Dyslexia

• Rello, Luz; Baeza-Yates, Ricardo: Good fonts for dyslexia, ASSETS '13: Proceedings of the 15th International ACM SIGACCESS Conference on Computers and Accessibility, Article No. 14.
  Abstract (published by ACM):

  Around 10% of the people have dyslexia, a neurological disability that impairs a person's ability to read and write. There is evidence that the presentation of the text has a significant effect on a text's accessibility for people with dyslexia. However, to the best of our knowledge, there are no experiments that objectively measure the impact of the font type on reading performance. In this paper, we present the first experiment that uses eye-tracking to measure the effect of font type on reading speed. Using a within-subject design, 48 subjects with dyslexia read 12 texts with 12 different fonts. Sans serif, monospaced and roman font styles significantly improved the reading performance over serif, proportional and italic fonts. On the basis of our results, we present a set of more accessible fonts for people with dyslexia.

• Bigelow, Chuck: Typography & Dyslexia, Bigelow & Holmes, November 2014.
• Gonzalez, Robbie: A Special Font to Help Dyslexics? More Like Snake Oil., Gizmodo, 13.01.2015.
• What is the most dyslexia friendly font?, User Experience Stack Exchange, 20.01.2015.
• Roselli, Adrian: Typefaces for Dyslexia, Adrian Roselli's blog, 14.03.2015.
• Roselli, Adrian: Variable Fonts and Dyslexia, Adrian Roselli's blog, 19.08.2018.
• Gifford, Mike: Dyslexia, Fonts & Open Source, OpenConcept, 27.07.2011.
• Gabriel, Robert James: Research into Web Accessibility for Dyslexics and Dyslexia-focused fonts such as OpenDyslexia, Robert J. Gabriel on Medium, 23.02.2017 (fourteen-minute read).
• Typefaces for Dyslexia, dyslexic.com (no date). This article describes several font faces that are recommended and used by dyslexic people. It discusses Read Regular (by Natascha Frensch), Lexie Readable, Tiresias (designed for visual impairment but not specifically for dyslexia), Century Gothic, Calibri, Sassoon, Myriad Pro and a few other fonts.
• Penney, Lynette: Typefaces for Dyslexia, iansyst, 18.10.2012. (Same text as above)
• Typefaces for dyslexia, British Dyslexia Association (no date, presumably January 2012; accessed 01.03.2021).
• D'Anna, Vincianne: Quand les livres numériques atténuent la dyslexie, Lettres numériques, 05.09.2013.
• OpenDyslexic: this font face is free to use; it uses the SIL-Open Font License (OFL).
• Lexie Readable, K-Type. This font face was formerly known as Lexia Readable. It is free for personal, educational and charity use; other users should buy a licence.
• Read Regular: a font face developed by Natascha Frensch.

Cognitive Accessibility

• Adegbite, Tolu: Designing for cognitive disabilities: Things we’re doing (and aiming for) at Shopify, Shopify UX, 19.05.2021.
• Onsman, Ricky: Introduction to Cognitive Disability and Accessibility Testing, TPGi, 21.12.2021.
• How to make your site accessible to people with learning disabilities, Audioeye blog, 13.01.2022.
• Jones, Gareth: The Ultimate Guide to Autism Friendly Colours, Experia, 25.04.2021.
• McNamara, Lē: Beyond WCAG: Losing Spoons Online, TPGi, 20.04.2022.
• Baltès, Camille: Des contenus accessibles pour les troubles DYS, Nell & associés, 08.02.2021.

Accessibility for Older Users

• Developing Websites for Older People: How Web Content Accessibility Guidelines (WCAG) 2.0 Applies, W3C (created in 2010 and updated several times).
• Arch, Andrew; Abou-Zahra, Shadi; Henry, Shawn Lawton: Older Users Online: WAI Guidelines Address the Web Experiences of Older Users, User Experience Magazine, March 2009.
• The Elderly and Web Accessibility – Accommodating Aging Web Users, Global Accessibility News, 12.10.2018.
• Trzepla, Szymon: UX accessibility for elderly — 12 principles, UX Planet on Medium, 28.07.2019.
• Hassell, Jonathan: Dos and don’ts on designing for older people (POSTER), Hassell Inclusion blog, 30.09.2020. (The poster is available under the terms of a Creative Commons licence.)

Lists

• Paladugula, Rakesh: HTML Lists & Accessibility, Maxability
• List Overview, ICITA (no date).
• Watson, Léonie: Using HTML lists, Humanising Technology Blog, 08.03.2011.
• Rutter, Richard: Lists, lists & more lists, Clagnut, 27.01.2003.
  This blog post is interesting from a “historical” point of view because it contains screenshots of AvantGo on a Palm Vx.

Animations and Motion

• Webb, Eileen: Your Interactive Makes Me Sick, Source, 01.03.2018.
• Bailey, Eric: An Introduction to the Reduced Motion Media Query, CSS-Tricks, 10.02.2017, updated 17.06.2017.
  See also the support tables for prefers-reduced-motion on CanIUse.com and prefers-reduced-motion on MDN.
• Craig, James: Responsive Design for Motion, Webkit blog, 15.05.2017.
• Ravenhall, Allison: Firefox Adds Support for CSS prefers-reduced-motion, Intopia, 09.11.2018.
  This article also mentions the relevant settings in Windows 10 (Settings > Ease of Access > Display > Show animations in Windows) and iOS 12 (Settings > Safari > Advanced > Experimental Features > Web Animations and CSS Integration & Web Animations).
• Bailey, Eric: Revisiting prefers-reduced-motion, the reduced motion media query, CSS-Tricks, 30.04.2019.
• Lauke, Patrick H.: Short note on prefers-reduced-motion and puzzled (Windows) users, The Paciello Group blog, 21.05.2019.
• Lindsey: Reducing Motion to Improve Accessibility, a11y with Lindsey, 13.08.2019.
• Head, Val: Accessible Web Animation: The WCAG on Animation Explained, CSS-Tricks, 22.09.2020.
• Head, Val: Designing With Reduced Motion For Motion Sensitivities, Smashing Magazine, 08.09.2020 (17-minute read).
• Head, Val: Designing Safer Web Animation For Motion Sensitivity, A List Apart, 08.09.2015.
• Finni, Ryan: Reducing Motion in Animations, Let's Build UI, 20.12.2020.
• Krasimir: Stop autoplaying your Gifs, Blog of Krasimir Tsonev, 19.06.2014.
  See also the associated Gifffer Example.
• Tarnoff, Nat: Animation Switch, CodePen (accessed on 06.05.2021).
• Hart, Callum: Using Animation to Enhance UX, Callum Hart's blog, 12.07.2016.
  This blog post is not about accessibility; it gives examples of how animations can be used in meanngful ways.
• Heinzman, Andrew: Does Looking at Your Phone Make You Dizzy? Disable Animations, How-To Geek, 20.05.2019.
• Jacobsen, Jens: Karussells & Bildbühnen, die Nutzer erfreuen, nicht verwirren, Usabilityblog.de, 13.08.2015.

Web Accessibility Books

The books below are listed by date of publication. Most of them are already out of date.

• Thatcher, Jim; Bohman, Paul; Burks, Michael; Henry, Shawn Lawton; Regan, Bob; Swierenga, Sarah; Urban, Mark D.; Waddell, Cynthia: Constructing Accessible Web Sites. glasshaus, 2002. (415 pages) ISBN 978-1-59059-148-2.
• Clark, Joe: Building Accessible Websites. Indianapolis, Indiana: New Riders, October 2002. (425 pages) ISBN 0-7357-1150-X.
  See also the online version of Building Accessible Websites.
• Horton, Sarah: Access by Design: A Guide to Universal Usability for Web Designers. Berkeley, California: New Riders, 2006 [actually 2005]. (264 pages) ISBN 0-321-31140-X.
• Duckett, Jon: Accessible XHTML and CSS Web Sites: Problem - Design - Solution. Indianapolis, Indiana: Wiley, 2006 [actually 2005]. (458 pages) ISBN 0-7645-8306-9.
• Rutter, Richard, et al: Web Accessibility: Web Standards and Regulatory Compliance. Friends of Ed, 2006. ISBN 978-1-59059-638-8.
• Henry, Shawn Lawton: Just Ask: Integrating Accessibility Throughout Design. Lulu.com, 2007. (200 pages) ISBN 978-1430319528.
• Craven, Jenny (editor): Web Accessibility: Practical Advice for the Library and Information Professional. London: Facet Publishing, 2008. (168 pages) ISBN 978-1-85604-625-1.
• O'Connor, Joshue: Joomla! Accessibility. Packt Publishing, 2008. ISBN 978-1-847194-08-4.
  The book's preface does not state which Joomla! version it is based on but the few references to Joomla! versions are mostly to version 1.5, which is now outdated.
• Hellbusch, Jan Eric; Probiesch, Kerstin: Barrierefreiheit verstehen und umsetzen. Webstandards für ein zugängliches und nutzbares Internet. dpunkt.verlag, 2011. (812 pages) ISBN 978-3-89864-520-1.
  See also Hellbusch' webpage about the book.
• Altinier, Armony: Accessibilité Web: Normes et bonnes pratiques pour des sites plus accessibles. Paris: Eyrolles, 2012. (331 pages) ISBN 978-2-212-12889-5.
• O'Connor, Joshue: Pro HTML5 Accessibility: Building an Inclusive Web. Apress, 2012. (365 pages) ISBN 978-1-4302-4194-2.
• Narayanan Palani: Advanced Selenium Web Accessibility Testing: Software Automation Testing Secrets Revealed. Momentum Press, 2019. (121 pages) ISBN 9781949449433.
• Firth, Ashley: Practical Web Inclusion and Accessibility: A Comprehensive Guide to Access Needs. Apress, 2019. ISBN 978-1-4842-5451-6.
  From the publisher's book description: Going beyond advice tailored solely for developers, this book offers potential improvements for designers, developers, user experience professionals, QA and testers, so that everyone involved in building a website can engage with the concepts without the need to understand how to code.
• Dowden, Martine; Dowden, Michael: Approachable Accessibility: Planning for Success. Apress, 2019. (120 pages) ISBN 978-1-4842-4880-5.
  From the publisher's book description: This book makes the topic of web accessibility as approachable as possible to help every web professional become an accessibility advocate at their companies, on their projects, and in their communities.
• Digital Education Strategies, The Chang School: Web Accessibility for Developers: Essential Skills for Web Developers.
  Published in November 2019 and available under the terms of the Creative Commons Attribution ShareAlike licence.
• Web Accessibility Books, Web Axe, 26.11.2017.

Failures and Anti-Patterns

• Rupert, Dave: HTML: The Inaccessible Parts, daveruppert.com, 28.02.2020.
  This blog posts lists a number of elements that are natively not as accessible or usable as one would expect. This includes various input types (e.g. <input type="date">, <progress>, <details><summary> and <video>.
• Koss, Hal: Infinite Scroll: What Is It Good For?, Built In, 21.12.2020.
  Tweeted by The Paciello Group, 22.12.2020: Infinite scroll is an accessibility risk & questionable UX practice, and these experts agree: (…)
• CSS: pointer-events:none on a label element. See Patrick Lauke's tweet from 05.02.2021: second time i've seen this recently, so to save others a lengthy bug-hunt: if you have a properly associated <label>, but clicking/tapping it doesn't set focus to its correctly associated <input>/<form> element... check if for some reason the <label> has pointer-events:none in CSS.
• Accessibility options panels:
  • ATbar. This open-source tool, developed at the University of Southampton in the UK, can be embedded into websites and is designed for those who may not have their assistive technologies to hand and need a quick way of accessing text on the screen with magnification and/or text to speech etc. It can help those with low vision, dyslexia and other reading difficulties, as well as those who may wish to just reduce the glare of black text on bright white backgrounds. It is not designed for regular screen reader users who need their assistive technology to access the computer as well as their browser. See also the YouTube video ATbar: a free cross-browser toolbar providing accessibility tools (3 minutes, 29.08.2013).
  • Fluid UI Options / Preferences Editor. This open-source tool, developed at OCAD University in Toronto, Canada, can be embedded into websites. See also the YouTube video Introduction to User Interface Options (4 minutes, 15.09.2017). For source code, see the Infusion repository on GitHub.
    For examples of sites that uses this, see Raising the Floor and GPII.
  • Able to Include's accessibility-layer.
  • Easy Reading: Easy Reading is a software tool supporting cognitive accessibility of web content. We want to enable people with cognitive disabilities to better read, understand and use all webpages. Our objective is to make webpages more accessible for everyone. (Accessed on 11.06.2022).
  • SkipTo by the PayPal Accessibility Team combines skip link with table of contents. (It is strictly speaking not an accessibility options panel like the above.)

Overlay Tools

Overlay Tools: Articles

Overlay products are sold as tools that magically solve a website's accessibility issues.

• Overlay Fact Sheet: created by Karl Groves in March 2021 and signed by dozens of accessibility advocates and experts.
• Spellacy, Michael: Should I Use An Accessibility Overlay?
• Kornmeier, Tony: Not All Accessibility Overlays Are Created Equal, Deque blog, 06.04.2020.
• Groves, Karl: Can Assistive Technology Make a Website Accessible? , Karl Groves, 19.04.2012.
• Groves, Karl: When the treatment is worse than the disease , Karl Groves, 13.11.2015.
• Groves, Karl: On Overlays as a means of resolving website accessibility issues, Karl Groves, 07.01.2016.
• Web Accessibility Overlays Do Not Work: a website created by Karl Groves that demonstrates and explains a number of accessibility problems that generic overlay tools cannot repair. The source code for this page is available on GitHub. The GitHub repository also contains a wishlist of ideas that others can contribute to.
• Truth in advertising does not exist for overlay vendors: another website by Karl Groves.
• Henry, Brad: Accessibility Overlays in Digital Content, TPGi blog, 13.05.2020.
• Byrne-Haber, Sheri: Overlays are not the solution to your accessibility problem, Medium, 14.01.2020 (4-minute read).
• Ruh, Debra: Should Accessibility Overlay Tools Be Used as a Strategic Part of your Accessibility Efforts, Huffington Post, 04.01.2016.

  Debra Ruh writes that some overlay tools appear to have become robust enough to become part of an organizations accessibility roadmap and plan. However, the article appears to lump together two types of web-based tools: on the one hand, widgets that can be embedded into websites in order to provide users with tools that change certain characteristics of a website (font size, contrast, etcetra), and developer tools on the other hand.
  sitecues is a SaaS accessibility product that builds zoom and speech capabilities right into websites, so people with low vision other visual and print difficulties can more easily see and hear content. This sounds much more modest than Debra Ruh's description of sitecues as a software-as-a-service technology that can make any website more accessible and usable.
  Access Alchemy can be used as a test and repair tool by web content authors; as Level Access writes under the heading “Don’t bug the dev team”, Fix the most common and high-priority issues with no changes to source code, page functionality, appearance, or load time. Repairs can now be done by any web-savvy member of your team, regardless of whether they can read or write code. Access Alchemy is clearly not an overlay tool for end users.
  In August 2018, User1st's offer consisted of a tool for users, uRemediate, and two tools for the website owner or developer, namely, uTester and uMonitor. This offer has changed since then.
  Debra Ruh does not mention that most accessibility issues cannot be detected, let alone repaired, by automated tools, although she should be aware of this.

• Lennartsson, Carin: Accessible websites by Dixerit, Accessible websites by Dixerit, 04.02.2009.

  Lennartson writes: For visually impaired and partially sighted users, w3c compliance alone is often not enough to successfully navigate and use your website. Enabling Dixerit Plus allows those with visual impairments or low reading ability to access your website quickly and easily. Using highest quality online text to speech conversion and other tools for magnification and contrast overlays your website can reach the largest possible audience. See also the YouTube video Contrast website overlay tool helps dyslexic users - from Dixerit (4 minutes, 04.02.2009). The blog and the YouTube channel have not been updated since 2009.

• Hunt, Richard M.: Is there a silver bullet for ADA website accessibility? Sorry, but the answer is no., Accessibility Defense, 31.03.2020. (The point of view of a lawyer.)
• Groves, Karl: What would an ethical overlay look like?, Tenon blog, 10.07.2020.
• Honor the ADA void Web Accessibility Quick-Fix Overlays, Law Office of Lainey Feingold, 10.08.2020.
• Roselli, Adrian: #accessiBe Will Get You Sued, Adrian Roselli, 29.06.2020. See also the update accessiBe May Have Lied about JAWS (9 March 2021) (09.03.2021).
• Overlay Accessibility Solutions Fail ADA Website Compliance, Propeller blog, 24.10.2020.
• The Many Pitfalls of Accessibility Overlays, eSSENTIAL Accessibility, 27.11.2020.
• Dolson, Joe: AccessiBe & the fake WordPress plug-in reviews, Joe Dolson Web Accessibility blog, 17.01.2021.
• Should I use an accessibility overlay?, The A11Y Project, 08.03.2021.
• Feathers, Todd: People With Disabilities Say This AI Tool Is Making the Web Worse for Them, Vice, 17.03.2021.
  This article is mainly about AccessiBe. Quote: “It’s not fair to put AccessiBe in the category of tech designed for disabled people given everything disabled people and allies have shared,” Haben Girma, a human rights lawyer and the author of the book “Haben: The Deafblind Woman Who Conquered Harvard Law,” told Motherboard. “You can take the time to learn to make your website accessible. You absolutely can do it, it’s a matter of time.”
• Roselli, Adrian: My Cease & Desist from AudioEye, Adrian Roselli, 15.04.2022.
• Altinier, Armony: Koena mise en demeure par FACIL’iti, Koena, 22.04.2021.
  See also the two relevant tweets: (…) NON, @FACIL_ITI ne permet pas de rendre #accessible son #site aux personnes en situation de #handicap, mais modifie seulement l’apparence des pages ! (…),
  Donc pour être clair, @FACIL_ITI ne rend pas #accessible des #formulaires, #images cliquables ou autres obstacles rencontrés par les #internautes en situation de #handicap, et n’assure pas non + la conformité au #RGAA! Ce n'est pas une solution miracle d'#AccessibilitéNumérique!.
  See also French Overlay Company Sues Advocates for Their Role in the Global Overlay Conversation (Law Office of Lainey Feingold, November 2021), where this is referred to as a SLAPP suit: a Strategic Lawsuit Against Public Participation.
• Stephen Clower: AccessiBe Gone: Instructions for blocking AccessiBe and similar intrusive overlays.
• Avoid AccessiBe & other companies claiming quick & easy AI accessibility (Haben Girma on YouTube, 3 minutes, 05.05.2021).
  Haben Girma is deafblind disability rights advocate.
• Glaser, April Blind people, advocates slam company claiming to make websites ADA compliant, ABC News, 09.05.2021.
  Quote: In recent months, blind people and disability advocates have been speaking out on social media and suing companies that use AccessiBe. Blind people say AccessiBe, which is supposed to automatically make websites more compatible with the screen readers blind people rely on to access the internet, has prevented them from all sorts of normal activities online, like paying rent, teaching a class or buying Christmas gifts.
  AccessiBe is the largest automated accessibility company on the market, according to Lucy Greco, who is blind and the head of web accessibility at the University of California, Berkeley.
• Byrne-Haber, Sheryl: Concerns with Accessibe joining W3C, Web Accessibility Initiative (WAI) Interest Group (IG) Discussion list, 27.05.2021.
• National Convention Sponsorship Statement Regarding accessiBe, National Federation of the Blind, 24.06.2021.
• Alexiou, Gus: Largest U.S. Blind Advocacy Group Bans Web Accessibility Overlay Giant AccessiBe From Its National Convention, Forbes, 26.06.2021.
• Cook, Anna E.: There’s no such thing as fully automated web accessibility, UX Collective, 15.07.2021.
  (Contains a long list of references to relevant articles, blog posts and news stories.)
• Westerhoff, Eva; Rietveld, Rian: Zin en onzin over accessibility overlays, Level Level blog, 20.07.2021.
  English translation: Accessibility overlays: common sense and nonsense.
• Bailey, Eric: accessiBe and the false David vs. Goliath narrative, Eric Bailey, 22.07.2021.
• Watson, Léonie: AccessiBe and data protection?, Tink, 27.07.2021.
• Bird, Daisy: Why accessibility overlays do not improve site accessibility, Scope for business, 03.09.2021.
• Help for my lawyer’s fees in the FACIL’iti lawsuit against me, La Lutine du Web, 17.10.2021.
  See also Lawsuit against French web developer Julie Moynat (Law Office of Lainey Feingold, November 2021).
• Why Accessibility Overlays On Your Website Can Make Things Worse, Bureau of Internet Accessibility blog, 25.10.2021.
• Legal Update: Accessibility Overlay Edition, Law Office of Lainey Feingold, 03.11.2021, updated on 20.04.2022.
• Simonite, Tom: This Company Tapped AI for Its Website—and Landed in Court, Wired, 11.11.2021.
  Intro: Last year, Anthony Murphy, a visually impaired man who lives in Erie, Pennsylvania, visited the website of eyewear retailer Eyebobs using screen reader software. Its synthesized voice attempted to read out the page’s content, as well as navigation buttons and menus. Eyebobs used artificial intelligence software from Israeli startup AccessiBe that promised to make its site easier for people with disabilities to use. But Murphy found it made it harder.
• Steenhout, Nicolas: Open Letter to IAAP against overlay providers, Part of a Whole, 17.01.2022.
• Overlay Position and Recommendations, International Association of Accessibility Professionals (IAAP) (undated; released in early 2022).
  Quote (retrieved on 02.08.2022): IAAP believes that Overlays, plugins, or widgets must never impede access to users’ assistive technology, choice of browsers and/or operating system features. IAAP therefore does not support members making false claims about any products or services which could be harmful, either directly or indirectly, to end-users, including people with disabilities, or the integrity of the accessibility profession. More specifically, in relation to Overlay technologies, at this time companies should refrain from using marketing language implying that a website or application can be made fully accessible to all people with disabilities by simply installing a plugin or widget without requiring additional steps or services. Note that the phrases does not support and companies should refrain from don't constitute strong condemnation.
• Byrne-Haber, Sheri: International Association of Accessibility Professionals (IAAP) position statement on overlays, Sheri Byrne-Haber's Blog, 01.03.2022.
• Roselli, Adrian: Overlays Underwhelm: a11y NYC, Adrian Roselli 01.03.2022, updated on 13.04.2022.
• Wehrmann, Lynn: IAAP’s Stance on Accessibility Overlays, WeCo Digital Accessibility, 15.03.2022.
• Singleton, Jeff: A Different View into Accessibility Overlays, Converge Accessibility, 09.05.2022.
• Polson, Faye: Accessibility Overlays: Buyer Beware, Kanopi Studios blog, 19.05.2022.
• Groves, Karl: Overlays are here to stay. So are “male enhancement pills”., karlgroves.com, 13.06.2022.
• Groves, Karl: Why is IAAP giving special treatment to overlays?, karlgroves.com, 20.06.2022.
• Morris, Amanda: For Blind Internet Users, the Fix Can Be Worse Than the Flaws, The New York Times, 13.07.2022.
  Article based on the Patrick Perdue's experience with sites that use overlays. Quote: “I’ve not yet found a single one that makes my life better,” said Mr. Perdue, 38, who lives in Queens. He added, “I spend more time working around these overlays than I actually do navigating the website.”
• Groves, Karl: People with disabilities hate overlays, yet an overlay company is suing its critics, karlgroves.com, 13.07.2022.
  This blog post was removed or made invisible on 14.07.2022.
• Gemeinsame Einschätzung der Überwachungsstellen des Bundes und der Länder für die Barrierefreiheit von Informationstechnik zur Verwendung von Overlay-Tools, Überwachungsstelle des Bundes für Barrierefreiheit von Informationstechnik, July 2022.
• Accessibility overlays make the Web worse, not better: New York Times, Centre for Accessibility Australia, 26.07.2022.
• Groves, Karl: Neutrality isn’t an option when it comes to accessibility, karlgroves.com, 31.08.2022.
  Quote: More nefarious, in my opinion, is the long established practice of lying that is nearly universal among overlay vendors. With relatively few exceptions, overlay vendors are consistent in perpetuating a dozen types of lies when marketing their products. While some people may suggest that lying is somehow commonplace in business, it is not. Furthermore, it is illegal: (…)
• Roselli, Adrian: ‘Accessibility at the Edge’ W3C CG Is an Overlay Smoke Screen, Adrian Roselli, 01.09.2022.
  See also Adrian Roselli's tweet about the ‘Accessibility at the Edge’ community group (01.09.2022): The ‘Accessibility at the Edge’ W3C Community Group Is an Overlay Smoke Screen
  The good news is that, while its Call for Participation disallows comments (and its previous one deleted them), you can weigh in at W3C TPAC’s free online breakout session.
• Bahram, Sina: Sina Bahram's LinkedIn post about the ‘Accessibility at the Edge’ W3C CG, LinkedIn, 01.09.2022.
• Campbell, Alastair: Overlay comments, AlastairC, 14.09.2022.
• Overlays Underwhelm / Adrian Roselli #id24 2022 (Inclusive Design 24 #id24 on YouTube, 48 minutes, 22.09.2022).
• Why Accessibility Overlay Widgets Fail to Protect or Serve, Accessibility.Works, 22.09.2022.
• Procès FACIL’iti contre Koena : mise à jour au 06 octobre 2022, Koena, 06.10.2022 (includes video with captions).
• WCAG issue #2750: Are there circumstances in which an overlay tool could be seen as providing a conforming alternate version for a non-conforming website?, GitHub issue tracker for WCAG, 25.10.2022.
• Barrierefreiheit mit einem Klick?, Pfennigparade, 07.11.2022.
• Gooding, Sarah: Meetup.com Removes Accessibility Overlay In Response to WordPress Community’s Concerns, WPTavern, 28.11.2022.
  In this case, the overlay tool was EqualWeb.
• Will working for an overlay company like accessiBe completely ruin my reputation as a WAS?, Reddit Accessibility, question posted on 17.03.2023.
• Paul J. Adam on Twitter, 07.03.2023, #AccessiBS has a high salary range but I wouldn't sell my soul to the devil! #a11y
  Also they had a "Superball" commercial!? So did the Bitcoin scams.
  The tweet includes a screenshot of a message sent by a recruiter, presumably on behalf of AccessiBe. Dax Castro tweeted back on 8 March that AccessiBe had also tried to recruit him.

Overlay Tools: List of Tools

Below is a list of overlay tools (with some of their overblown and misleading claims). Since making a website accessible is a process that cannot be automated, the claims by these vendors are misleading.

• FACIL’iti (France): FACIL’iti est une solution d’accessibilité numérique innovante qui adapte l’affichage d’un site Web en fonction des besoins de confort visuel, moteur, cognitif, et/ou temporaire de l’internaute.. (Accessed on 12.05.2021.)
• accessiBe (Israel): The #1 Automated Web Accessibility Solution for ADA & WCAG Compliance; A single line of code for 24/7 automated compliance. (There is even a Wikipedia article about accessiBe.) (Accessed on 12.05.2021.)
• AudioEye (Tucson, Arizona, USA): #1 in Web Accessibility
  When it comes to understanding web accessibility compliance, AudioEye is here to help. AudioEye’s website accessibility software delivers superior accessibility and proven legal protection.
  Once our tool is installed, AudioEye will be able to detect and fix over 400 accessibility errors immediately. (Accessed on 12.05.2021.)
• Agastya by Oswald Labs (New Delhi, India): By adding just one line of JavaScript code, you can make your website accessible to a much wider audience. You can customize the widget, view usage analytics, install apps, and more. (Accessed on 12.05.2021.)
• UserWay (Floor Wilmington, DE, USA): The World's Leading Automated Website Accessibility Solution for ADA & WCAG Compliance
  Requires only a single line of JavaScript. (Accessed on 12.05.2021.)
  UserWay's plugin will instantly strengthen any weak spots that might cause issues. We are proud to say that tens of millions of pages are more accessible today thanks to UserWay.
  One website that uses UserWay is Special Olympics, where the overlay tool opens when you press the keystroke combination Ctrl u (so you can't use that keyboard shortcut to view the page's source code). (Accessed on 20.06.2022.)
• EqualWeb (Kfar Yona, Israel): Make your website accessible in 1 easy step – insert one-line-of-code and we will do the rest! (Accessed on 12.05.2021.)
• Max Access – AI-Powered Web Accessibility for WCAG and Section 508 Compliance (Eugene, Oregon, USA): INSTALL JUST 1 SINGLE LINE OF CODE
  Max Access instantly scans, analyzes, and updates your website. Then it re-scans for any site updates or new content every 24 hours! (Accessed on 12.05.2021.)
• Howling Access AI (Tampa, Florida, USA): Fully Automated Web Accessibility Solution for ADA & WCAG Compliance
  Installing Howling Access AI is as simple as adding a single line of JavaScript code to your website. You can also add it through Google Tag Manager, or use one of our CMS extensions like WordPress, Joomla, BigCommerce, Drupal, etc. (Accessed on 12.05.2021. Notice the low contrast of the white text on the yellow background and the yellow text on the white backgroun.)
• Enable / EnableMyWebsite.com (Royersford, PA, USA?): AI-Powered Web Accessibility. Automatic. Simple. Affordable.
  Installing Enable Web Accessibility is extremely quick and simple. All you need to do is implement a single line of JavaScript code into your website. It's as simple as installing Google Analytics or Facebook Pixel! Additionally, you can even implement it using Google Tag Manager or our built-in CMS plugins!
  This is actually powered by AccessiBe; see Enable's Terms and Conditions. (Accessed on 12.05.2021.)
• Kiuloper (Canada): Installing AI solution is as simple as adding a single line of JavaScript code to your website. You can also add it through Google Tag Manager, or use one of our CMS extensions like WordPress, Joomla, BigCommerce, Drupal, etc. (Accessed on 12.05.2021.)
• Direction (McLean, Virginia, USA): The Website Accessibility Solution with Full ADA Compliance
  We add a single line of JavaScript code to the footer of your website. Don’t worry, we can also give you that code if you’d like to install it yourself. (Accessed on 12.05.2021.)
• Maverick Media (Easton, PA, USA): THE #1 FULLY AUTOMATED WEBSITE ACCESSIBILITY SOLUTION FOR ADA & WCAG COMPLIANCE
  We will create a single line of JavaScript code and install it on your website platform of choice. (This is an AccessiBe partner. Accessed on 12.05.2021.)
• BeeSeen Solutions (New York, USA): Accelerate your business with BeeSeen Solutions website accessibility solutions without re-structuring your website’s existing code and secure a comprehensive legal and regulatory compliance framework covering ADA, Section 508, WCAG 2.1 AA, and much more.
  BeeSeen Solutions Accessibility Widget is compatible with all leading CMS platforms along with HTML/CSS/JS sites. This widget can easily spot any weak areas that might be causing issues, obstacles, or accessibility violations. (Accessed on 12.05.2021.)
• Get ADA Accessibility (USA?): Get ADA Accessibility supports ALL cross-platform, using our cutting edge technology based on unique AI algorithms. We can help you make your website and all your digital content accessible without modifying your code.
  Just insert one-line-of-code and we will do the rest! (Accessed on 12.05.2021.)
• Purple Lens (Tel Aviv, Israel): described as follows in the FAQ: The accessibility tool Purple-Lens is a clever plugin which allows WordPress®️ pages to turn accessible using our assistive technologies. and its functioning is described as follows: The tool automates the visualization of the site in order to make it more enjoyable to people with disabilities. The tool automates the visualization of the site in order to make it usable for people with a range of disabilities: impaired vision, color blindness, epilepsy, motor difficulties and more. With regard to the level of compliance, the FAQ says: Using the tool and accomplishing every step from Purple Lab brings the site to meet W3C WIA WACG LEVEL AA requirements. (Accessed on 10.06.2021.)
• DIGIaccess (Bonn, Germany). Description on the product page: DIGIaccess ermöglicht es, Webseiten für jeden zugänglich zu machen. Der gesamte Prozess, inklusive der vollständigen Einhaltung der gesetzlichen Rahmenbedingungen, erfolgt zu 100 % automatisch und sofort, wobei KI-, Lern- und Bildverarbeitungstechnologien genutzt werden. (Accessed on 10.06.2021.)
• Adally (St. George, Utah, USA): Adally Free Accessibility Widget: this widget requires only one line of code to “install”. The company points out that it is not a full solution: Our proprietary widget will not make your website ADA compliant, no overlay solution will but it is a great first step and creates a better overall experience for website visitors with certain disabilities. (Accessed on 10.06.2021.)
• Deque Systems Releases Amaze 3.0 For General Availability, Deque Systems blog, 27.05.2014.
  See also Caitlin Cashin: Dylan Barrell Talks Amaze (21.02.2013). There has been no new information about Amaze since 2014.

Keyboard Access and Accesskeys

• Watson, Léonie: The difference between keyboard and screen reader navigation, Tink, 25.05.2019.
  French translation: Navigation au clavier versus navigation avec un lecteur d’écran.
• Ashton, Chris: I Used The Web For A Day With Just A Keyboard, Smashing Magazine, 04.07.2018.
• Jolly, Robert: Keyboard Testing Basics, Knowbility Blog, 06.11.2018.
• Lindberg, Oliver: Best Practices for Prototyping Keyboard Accessibility, Adobe Blog, 24.07.2019.
• Bailey, Eric: Use the tabindex attribute, The A11Y Project, 28.01.2021.
• de Vries, Hidde: Keyboard shortcuts need modifier keys, hidde.blog, 05.08.2022.
• Single-character shortcuts and embedded video players (WCAG success criterion 2.1.4):
  • Is a video player considered a single component for purposes of single character shortcuts SC 2.1.4?, WCAG Issues (GitHub), issue posted on 08.07.2021.
    See also Does the YouTube video player fail SC 2.1.4? (Web Accessibility Initiative (WAI) Interest Group (IG) Discussion list archive, July 2019).
    As this discussion explains, WCAG does not consider an embedded video player as a whole as a standalone component, but the controls in the player are. For this reason, single-character shortcuts can only trigger an action when the corresponding user interface component has keyboard focus. It is also fine to enable single-character shortcuts by default if a mechanism is available to turn them off or to remap them.
  • WCAG 2.1 compliancy: Disable keyboard controls for embedded player, player.js Issues (GitHub), issue opened on 25.06.2021.
    This issues is based on the same understanding as the previous discussion.
• Diaz, Cristian: A Guide To Keyboard Accessibility: HTML And CSS (Part 1), Smashing Magazine, 14.11.2022 (28-minute read).
• Diaz, Cristian: A Guide To Keyboard Accessibility: JavaScript (Part 2), Smashing Magazine, 21.11.2022 (28-minute read).
• Keyboard-navigable JavaScript widgets, MDN (accessed on 23.02.2023).

Keyboard Focus / Focus Visibility

• Lauke, Patrick H.: :focus-visible and backwards compatibility, The Paciello Group blog, 23.03.2018.
  Quote: When authors define explicit :focus styles, however, these browser heuristics are ignored. :focus styles are applied whenever the element receives focus, whether it was as a result of a keyboard or mouse/pointer interaction. The :focus-visible pseudo-selector gets around this.
• Bailey, Eric: Focusing on Focus Styles, CSS-Tricks, 29.03.2018.
  This article discusses :focus, :focus-within, :focus-visible and why removing focus styles causes problems for certain groups of users. The article contains two videos: one of a person using switch control and one showing why a colour-only state change would be inaccessible to people with deuteranopia.
• Smith, Jared: The plague of outline:0, WebAIM blog, 07.04.2008.
• Fields, Jeremy: Managing :focus styles without breaking accessibility, Viget, 09.07.2014.
• Geier, Caitlin: Give Your Site Some Focus! Tips for Designing Useful and Usable Focus Indicators, Deque blog, 29.06.2016. This article is also relevant to keyboard focus in form fields.
• :focus-visible, MDN, 02.07.2018.
  Focus visibility is relevant both to links and to user interface components. This article focuses on form elements and custom elements.
• Ott, Matthias: :focus-visible Is Here, Matthias Ott, 10.10.2020.
  This is an introduction to the :focus-visible pseudo-class introduced in CSS Selectors Level 4.
• de Vries, Hidde: With :focus-visible, you can have focus styles when it makes sense , hidde.blog, 21.07.2022.
• :focus-visible and backwards compatibility, TPGi, 23.03.2018.
• Bailey, Eric: Focus management and inert, CSS-Tricks, 19.10.2020.
• Focus management, Web Accessibility Guidance project — NZ Government (no date; accessed on 11.11.2022).
• Soueidan, Sara: A guide to designing accessible, WCAG-compliant focus indicators, Sara Soueidan, 13.08.2021, updated on 05.09.2022 (22-minute read).
• de Vries, Hidde: 2.4.11 Focus Appearance adds more complexity to WCAG than we should want, hidde.blog, 23.09.2022.
  Blog post about a new success criterion the the Candidate Recommendation of WCAG 2.2.
• Visibilité de la prise de focus, Atalan, le Blog, 23.09.2014.
• Makelele, Josiane: Le focus n’est pas juste une astuce !, 24 jours de web, 16.12.2017.
• Focus : la pseudo-classe championne d'ergonomie et d'accessibilité, Chez Goulven, 15.07.2008

Note: For many years, Firefox had a poor default focus indicator that consisted of a thin dotted black outline. Firefox 100.0 replaced this with a better one:

Firefox has a new focus indicator for links which replaces the old dotted outline with a solid blue outline. This change unifies the focus indicators across form fields and links, which makes it easier to identify the focused link, especially for users with low vision.

Accesskeys, a Failed Accessibility Feature

• Foliot, John: Using Accesskeys – Is it worth it?, Unrepentant, 08.05.2003.No longer online in July 2022.
• Foliot, John: More reasons why we don’t use accesskeys, Unrepentant, 06.12.2003.No longer online in July 2022.
• Featherstone, Derek: Accesskey Conflicts, box of chocolates, 06.12.2003.
• Foliot, John: The Future of Accesskeys, Unrepentant, 14.08.2004.No longer online in July 2022.
• Lemon, Gez: User-Defined Access Keys, Juicy Studio, 20.12.2005.
  This article contains PHP code that allows users to set their own accesskeys.
• Distler, Jacques: Editable Accesskeys, Musings, 08.01.2006.
• Distler, Jacques: New AccessKeys.js, Musings, 03.04.2006.
• Lloyd, Ian: Setting & Retrieving Accesskeys with JavaScript and DOM, Treehouse Blog, 22.03.2007.
• Johansson, Roger: If you use the accesskey attribute, specify unique values, 456 Barea Street, 26.05.2010.
• Emma: The accesskey attribute – do we still need it?, Punkchip, 10.08.2010.

Language Markup

• Roselli, Adrian: On Use of the Lang Attribute, Adrian Roselli, 11.01.2015, updated on 05.12.2021.
• Coward, Emily: Multi-lingual Website Accessibility - 7 Tips and Techniques, Nomensa blog, 22.12.2010.
• Foreign Languages and Accessibility, Accessibility and Usability at Penn State.
• Thread: hreflang underestimated?, WebAIM E-mail List Archives, February 2022.
  Browsers and assistive technologies don't do anything with the hreflang attribute.

Auditing and Reporting

• Easy Checks – A First Review of Web Accessibility, Web Accessibility Initiative.
• Doing a basic accessibility check if you cannot do a detailed one, Gov.UK, 22.08.2019.
• Gifford, Mike: Writing Impactful Accessibility Reports, OpenConcept Stories on Medium, 16.03.2020 (eight-minute read).
• Holdsworth, Isabel: Accessibility testing as a screen reader user, TPGi, 09.05.2021.
• Camara, Giovani: How to use the accessibility tree for a11y testing, Giovani Camara Blog, 06.02.2022.
• Der BIK BITV-Test: a method for evaluating conformance of web pages to the European standard EN 301 549 (which is based on WCAG 2.1).
• Méthodologie d’évaluation sur l’accessibilité des sites Web (niveau AAA), Boîte à outils de l'expérience Web (no date; accessed on 13.05.2022).
  Not a real evaluation method but a list of WCAG 2.1 success criteria, each time with radio buttons for “pass”, “fail” and “not applicable”.
• Bailey, Eric: The Importance Of Manual Accessibility Testing, Smashing Magazine, 12.09.2018 (21-minute read).
• Vigo, Markel; Brajnik, Giorgio; O Connor, Joshue: Research Report on Web Accessibility Metrics (W3C Working Draft 30 August 2012).
• Humans and Machines in Accessibility Testing, TPGi, 17.08.2022.
• Thomas, Pamela J.: JAWS Basics for Web Accessibility Testers, ITS Services and Applications, last updated on 21.10.2021.
• Faulkner, Steve: Shut up JAWS, TPGi, 04.07.2017.
• Soueidan, Sara: Setting up a screen reader testing environment on your computer, Sara Soueidan, inclusive design engineer, 25.11.2022 (eight-minute read).
• Watson, Léonie: Basic screen reader commands for accessibility testing, TPGi, 05.01.215, udpated on 05.01.2016.
• Template for Accessibility Evaluation Reports , Web Accessibility Initiative (W3C) (no date; accessed on 23.02.2023).
• Collaborative Audits: The Win-Win of Co-created Multi-stakeholder Accessibility Audits (IAAP on YouTube, 58 minutes, 05.04.2022, unlisted video).
• Understanding the W3C's Accessibility Conformance Testing (ACT) Requirements, Bureau of Internet Accessibility blog, 04.02.2022.

The Most Common Errors

• Smith, Jared: The WebAIM Million: What we learned analyzing 1,000,000 web site home pages, WebAIM blog, 27.02.2019.
  The findings include the following types of issues:

  • Low contrast text was the most common detectable issue with an average of 36 instances of low contrasts text on each home pages.
  • One-third of all images (12.3 images per page on average) were missing alternative text.
  • 59% of form inputs were not properly labeled.
  • Home pages with ARIA present averaged 11.2 more detectable errors than pages without ARIA.

• The WebAIM Million: An annual accessibility analysis of the top 1,000,000 home pages, WebAIM, last updated on 30.03.2020.
  One of the noteworthy findings is the following: Home pages with ARIA present averaged 60% more errors than those without! One would expect to encounter an additional 26.2 potential barriers on home pages with ARIA. Interestingly, this same disparity did not exist on interior pages, where ARIA did not correlate to errors, even though interior pages had 71% more ARIA markup than home pages.
• Gifford, Mike; Fretwell, Luke: What we learned about accessibility by scanning more than 2 million federal .gov web pages, FCW, 22.07.2021.
  The findings include the following types of issues:

  The most common accessibility issues encountered:

  • Form elements without a label
  • Images without alternative text
  • Links with no discernible text
  • Assortment of Accessible Rich Internet Application (ARIA) issues

• Dennis: The WebAIM Million—Updated, Web Axe, 02.04.2020.
• The 10 Most Common Accessibility Issues, ADA Site Compliance, 01.02.2022.
• Stobbs, Matt: The 6 Most Common Accessibility Problems (and How to Fix Them), Scott Logic, 02.07.2020 (eight-minute read).
• Stemler, Sam: Top 8 Most Common Accessibility Issues to Avoid and Solve, Accessible Metrics, 16.07.2019.
• Paiva, Marcello: Top 5 Most Overlooked Accessibility Issues, cross.team (on Medium), 18.05.2020 (ten-minute read).

The title Attribute

• Faulkner, Steve: Using the HTML title attribute – updated, The Paciello Group blog, 15.01.2013.
• Faulkner, Steve: Using the HTML title attribute – Updated March 2020, The Paciello Group blog, 02.11.2020.
  Takeaway presented at the top of the article: If you want to hide content from mobile and tablet users as well as assistive tech users and keyboard only users, use the title attribute.
• Faulkner, Steve: Short note on use of alt=”” and the title attribute, TPGi, 10.02.2016.
• O’Hara, Scott: The Trials and Tribulations of the Title Attribute, 24 Accessibility, 22.12.2017.
• Ball, David: I thought title text improved accessibility. I was wrong., silktide, 14.02.2013, updated on 20.01.2023.
• MacDonald, David: The iframe delemma: Is it a failure of WCAG to not have a title on an iframe?, David MacDonald Web Accessibility Blog, no date (January 2015?).
• Does adding a "title" attribute to the "label" element instead of the "input" harm accessibility?, User Experience Stack Exchange, submitted on 08.06.2021.
• Don't Rely on the Title Attribute for Accessibility, Mediacurrent, 06.04.2016.
• title and aria-label attribute accessibility test case, PaulJAdam's Modern Web Accessibility Demos, accessed on 05.03.2023.
• Tooltips & Toggletips, Inclusive Components, 25.07.2017. (Not exclusively about the title attribute but has a section about it.)
• title - HTML: HyperText Markup Language, MDN (accessed on 05.03.2023). See the short section on accessibility concerns.

Unsorted Web Accessibility Links

• The A11Y Collective online courses on Web Accessibility. See also The A11Y Collective on Twitter.
• A List Apart: Articles on accessibility.
• Meine Barrierefreiheit, Deine Barrierefreiheit: Studie zur Wirkung von barrierefreien Webseiten auf ihre Nutzer, 24.06.2014.
• Head, Val: Designing Safer Web Animation For Motion Sensitivity, A List Apart, 08.09.2015.
• Soueidan, Sara: Accessible Text Labels For All, Sara Soueidan's blog, 17.03.2021.
• Moving from Accessibility Guidelines to Documentation Driven Development by Gareth Ford Williams (Auckland Digital Accessibility & Inclusive Design on YouTube, 27 minutes, 25.11.2020).
• Rodriguez, Hector Osborne: How to code accessible phone numbers?, LinkedIn, 17.01.2023.
  Recommends the following way to code a phone number: <a href="tel:18001234567" aria-label="1. 8 0 0. 1 2 3. 4 5 6 7">1-800-123-4567</a>. However, Jan Jaap de Groot pointed out in a comment that, it’s actually a worse experience for braille users and voice control users. Braille users now read spaces and dots between each number. And voice control might not work due to the visible label being different from the technical label. Arguably it’s also worse for screen reader users because the pronunciation is different from the default they are used to. Although the intentions are good, I’ve learnt it’s better to stick to the defaults. Cameron MacDonald pointed out in a comment that, some screenreader users are used to the way phone numbers are read today and can get confused when you deviate from the expected default. I personally agree that this would be the most straightforward reading of a phone number though.
• Venkitesh, Ramya: Web Accessibility for Speech Recognition Users – A Pragmatic Approach, Barrier Break, 13.10.2022.
• Ratliff, Eleanor: Accessibility Whack-A-Mole, A List Apart, 06.12.2016.
• Matuzovic, Manuel: Writing CSS with Accessibility in Mind, @matuzo, 18.09.2017.
• Eggert, Eric: Text-overflow: ellipsis considered harmful, Eric Eggert, 22.06.2022.
  Short blog post about the CSS declaration text-overflow: ellipsis.
• Edwards, James: The Ballad of Text Overflow, TPGi, 05.07.2022.
• Beach, J. Renée: Beware smushed off-screen accessible text, Medium, 12.10.2016.
• Dodson, Rob (developer advocate at Google): The future of accessibility for custom elements, Google Dev Channel (on Medium), 02.10.2017. (Originally published on Rob Dodson's blog.)
• Gillen, Mary: Accessible Forms: A Select “Jump Menu” Tip, Accessible Website Services, 24.05.2019.
  This is about drop-down menus (using a select element) that automatically submit once an option has been selected. This type of menu is not keyboard accessible.
• Bryant, Zoë: How to make an accessible address finder, Red Badger, 02.10.2017. See also accessible-address-finder on GitHub.
• Jones, Ryan: Considerations for making an accessible kiosk, The Paciello Group blog, 16.11.2017.
• Camara, Giovani: The Ultimate Guide to Debugging Accessibility Issues, Giovani Camara, 10.07.2022.
• HTML Semantics and Accessibility Cheat Sheet, WebAIM, last updated on 30.11.2022.
• Faulkner, Steve: Short note on making your mark (more accessible), The Paciello Group blog, 05.12.2017.
• Roselli, Adrian: Tweaking Text Level Styles, Adrian Roselli's blog, 10.12.2017. (This post builds on Steve Faulkner's post about <mark>. For the del element, see also <del>: The Deleted Text element on MDN Web Docs.)
• Göransson, Daniel: Text Splitting Causes Screen Reader Problems, Axess Lab, 04.03.2018.
• Yifrah, Kinneret: 7 guidelines for writing accessible microcopy, Prototypr, 15.11.2017.
• Metts, Michael J.; Welfle, Andy: Standards for Writing Accessibly, A List Apart, 23.01.2020.
• Ilagan, Mikey: Web Accessibility: What You Say vs. What I Hear, Think Company blog, 07.12.2017.
• Roselli, Adrian: Improving Your Tweet Accessibility, Adrian Roselli, 06.01.2018.
• Roselli, Adrian: Display: Contents Is Not a CSS Reset, Adrian Roselli, 01.05.2018.
• Cahalane, Claudia: 9 ways to make your website more dementia-friendly, Digital Leaders, 01.08.2018.
• Ivil, Laurence: Designing A Dementia-Friendly Website, Smashing Magazine, 17.05.2016.
• Quito, Anne: There’s already a blueprint for a more accessible internet. If only designers would learn it, Quartz, 15.11.2018.
• Do we still need text scaling links on websites? A question posted on User Experience Stack Exchange in October 2009.
• How to prove to client that blind users can also use his e-commerce website? A question posted on User Experience Stack Exchange in April 2012.
• Screen Reader User Survey #7 Results, WebAIM (no date).
  For web developers, some of the most interesting parts of this report are about specific web page features that screen reader users rely on: landmarks and regions (very variable), finding information on a lengthy web page (67.5% navigate such pages using headings), heading structures (60% expect one first level heading that contains the document title) and skip links (very variable). There is also a list of most problematic items, such as CAPTCHA, unexpected screen changes, ambiguous links or buttons, inaccessible Flash content (even in 2017), lack of keyboard accessibility, complex or difficult forms, missing or improper text alternatives, and a few other issues.
• Deutsche Gebärdensprache im Internet umsetzen, BIK für Alle.
• Swallow, David: A web of anxiety: accessibility for people with anxiety and panic disorders [Part 1], The Paciello Group blog, 14.08.2018.
• Swallow, David: A web of anxiety: accessibility for people with anxiety and panic disorders [Part 2], The Paciello Group blog, 07.11.2018.
• Roselli, Adrian: Be Wary of Nesting Roles, Adrian Roselli, 04.12.2016.
• Roselli, Adrian: Target Size and 2.5.5, Adrian Roselli, 08.06.2019.
• Provide buttons with a large target size, Access Guide (no date; accessed on 03.07.2022; Creative Commons).
• Zweiter Blick: Startseite für digitale Barrierefreiheit.
• Elements with overflow: scroll become focusable, Today Cassey Learned, 19.11.2019.
• Livingstone, Elise: How to document accessibility as a UX designer, Bootcamp on Medium, 13.05.2021 (eight-minute read).
• Walter, Stéphanie: A Designer’s Guide to Documenting Accessibility & User Interactions, Stéphanie Walter, 07.09.2022.
• WAI Glossary, World Wide Web Consortium (W3C), September 2021.
• Sloan, David: Accessible digital map experiences: a mountain climb or a walk in the park?, The Paciello Group blog, 02.04.2020.
• Stanton, Benjy: A plan for accessible maps, Benjy Stanton, 28.11.2020.
• Faulkner, Steve: aria-description: By Public Demand and to Thunderous Applause, HTML Accessibility, 09.02.2021.
• van de Sande, Christien: Toegankelijkheidsverklaring: het stappenplan, Level Level, 30.07.2020.
• O'Hara, Scott: Div divisiveness, scottohara.me, 20.01.2022, updated on 24.01.2022.
• Maniez, Audrey: Le principe de non-interférence en accessibilité numérique, Access42, 26.04.2022.
• Does HTML Microdata Improve Accessibility?, Bureau of Internet Accessibility, 29.03.2022.
• 4 Simple Ways to Improve Web Accessibility, Bureau of Internet Accessibility blog, 25.02.2022.
• Barrierefreiheit auf den Internetseiten öffentlicher Stellen, Deutscher Blinden- und Sehbehindertenverband e.V., 23.09.2020.