Web accessibility
Learn Accessibility & Build Accessible Web Apps are great intros.
Liked Lost in Translation talk.
Notes
- UI component libraries are using the term “accessible” too freely. Adding focus styles and copy-pasting some ARIA roles doesn't make your library accessible, neither does adding an “accessibility” page where you claim to conform to WCAG just because you ran a Lighthouse test.
- My big a11y tip is to learn about ARIA roles and accessible names and use a test framework that lets you select by role+name. see your app the way screen reader users do. I find a ton of a11y bugs this way
Links
- WebAIM Million - Accessibility analysis of the top 1,000,000 home pages.
- Why we use progressive enhancement to build GOV.UK (2016)
- 18F Accessibility Guide - Repo to organize the guidelines and best practices for accessibility at 18f. (Code)
- Accessibility Interview Questions
- prefers-reduced-motion: Sometimes less movement is more (2019)
- Standards for Writing Accessibly (2020)
- Stark - Suite of integrated accessibility compliance tools for product development teams.
- Library: Accessibility resources, guides, communities, and more
- Building an accessible autocomplete control (2020)
- Accessible to all - Build a site that works for all of your users.
- One of my favorite accessibility testing tools: The Tab Key
- Dao of Web Design (2000) (HN)
- N26 and lack of JavaScript
- AriaNg - Modern web frontend making aria2 easier to use.
- Inclusive Components - Blog trying to be a pattern library, with a focus on inclusive design.
- "Building Inclusive Components" with Heydon Pickering (2019)
- BBC Global Experience Language (GEL) (Web) (Code)
- Web Accessibility courses/resources
- Web and Media Accessibility Group AMA (2020)
- Names, Legal Names, and Fractally Deferred Responsibility (2020) (Lobsters)
- Expedia Accessibility Guidelines
- Achieving accessibility through simplicity (2020)
- Building the most inaccessible site possible with a perfect Lighthouse score (2019) (HN)
- Is Dark Mode Such A Good Idea? (2020) (Lobsters) (HN)
- Technica11y - Discussing challenges in technical accessibility.
- Tenon.io - Accessibility as a Service.
- A11Y Project - Community-driven effort to make digital accessibility easier. (Checklist) (HN)
- Appreciating accessibility - Keyboard shortcut guidelines
- A11y Coffee
- Accessibility Testing is like Making Coffee (2020)
- axe-mode - Accessibility testing visualized.
- A11y Testing Is Like Making Coffee
- Accessibility Guide in Russian
- a11yresources - Growing list of accessibility tools and resources.
- 5 Things I've Learned From the Accessibility Community (2020)
- A11y Dialog - Lightweight and flexible accessible modal dialog.
- Coding with voice dictation using Talon Voice (2020) (HN)
- Empathy Prompts - Ideas to help consider Inclusive Design principles when making things for others to use. (Code)
- Pa11y - Automated accessibility testing pal. Runs accessibility tests on your pages via the command line or Node.js, so you can automate your testing process. (Code)
- Evaluatory - Web page evaluation with a focus on accessibility. (Code)
- Bootcampers Guide to Web Accessibility
- screen-reader-reader - General purpose screen reader reader, with the aim of enabling more realistic end-to-end accessibility tests.
- Building accessible websites 101
- Build Accessible Web Apps
- Test Automation for Accessibility
- Are your Anchor Links Accessible? (2020)
- ButtonBuddy - Accessible button contrast generator. (Code)
- axe - Accessibility Testing Tools and Software. (Code)
- Accessibility Guidelines "Silver" (Code)
- Building greater accessibility into Facebook.com (2020)
- Web Content Accessibility Guidelines (Code)
- A Beginner’s Guide To Web Accessibility (2021)
- Accessible front-end components: claims vs reality (2021)
- Overlay Fact Sheet - Introduction, definition, and history of web accessibility overlays.
- Web Accessibility Fundamentals Workshop
- Modern CSS Upgrades To Improve Accessibility (2021)
- Practical Accessibility - Web accessibility course for Web designers and developers, by Sara Soueidan.
- Replit - Why We Switched From Webpack To Vite (2021)
- Why we’ve created an accessibility manual – and how you can help shape it (2021)
- The perfect link
- A Complete Guide To Accessibility Tooling (2021)
- Using CSS to Enforce Accessibility (2021)
- Доступность в дизайне (2021)
- Access Guide - Friendly introduction to digital accessibility.
- Accessible Rich Internet Applications (WAI-ARIA) (Code)
- AccessKit - UI accessibility infrastructure across platforms and programming languages.
- Accessibility beyond 'alt' tag, 'color contrast', and semantic tags (2021)
- WAI-ARIA Authoring Practices (Code)
- Accessibility-First Tool Concepts (2021)
- Eleventy starter project for WCAG reports (Article)
- Inclusive Design 24 Schedule (2021)
- Good and compact material that teaches you the basics of accessibility on the web (2021)
- Buttons vs. Links (2021) (Tweet)
- Visible - Accessibility testing framework at the next level.
- A guide to designing accessible, WCAG-compliant focus indicators (2021) (HN)
- The effect of CSS on screen readers (2021)
- Testing Accessibility workshop series
- Accessibility Myths
- The importance of accessibility in digital products (2021)
- Small Wins for Accessibility and Resilience (2021)
- Auditing React Apps for Accessibility (2021)
- a11y-components
- ally.js - JavaScript library to help modern web applications with accessibility concerns. (Docs)
- This is WCAG - Build and test against the Web Content Accessibility Guidelines (WCAG) consistently by understanding what is a failure against the success criteria.
- Tabster - Web Application Keyboard Navigation Tools.
- Accessibility Support - Accessibility Support data for various HTML, ARIA, CSS, and SVG features. (Code)
- 5 Accessibility Quick Wins (2022)
- Accessibility for real-time web apps
- Guidance on Web Accessibility and the ADA
- A11yAutomation - Tracking the available automation for accessibility. (Code)
- Deep Dive On Accessibility Testing
- Accessible React Forms (2022)
- Best JS frameworks/libraries for web accessibility (2022)
- Series of HTML test cases to determine how specific elements are announced in different screen reader / browser combinations (Code)
- focus-lock - A11y util for scoping a focus.
- Global Accessibility Awareness Day
- Accessibility is Hard and Important
- Automate accessibility tests with Storybook (2022)
- ARIA Authoring Practices Guide (APG)
- eslint-plugin-jsx-a11y - Static AST checker for accessibility rules on JSX elements.
- Where's the fun in accessibility? (2022) (HN)
- Best practices for inclusive textual websites (2022) (Lobsters)
- A details element as a burger menu is not accessible (2022)
- A Horizontal Scroll List and Custom Keyboard Navigation (2021)
- Learn Accessibility
- Aria-label is a code smell (HN)
- A Guide To Keyboard Accessibility: HTML And CSS (2022)
- Setting up a screen reader testing environment on your computer (2022)
- Accessible Front-End Patterns For Responsive Tables (2022)
- Better accessible names (2022)
- Meaningful labels using ARIA – or not. (2022)
- Lost in Translation with Manuel Matuzović (2022)
- Techniques for WCAG 2.1
- A11yWatch - Web accessibility automation tool. (GitHub)