Accessibility in 2024

Rate this content
Bookmark

We’ll cover the basics of how accessibility works in organizations and on teams, who is responsible for accessibility, how to push for changes without being an expert, and how to grow your skillset.

This talk has been presented at React Summit 2024, check out the latest edition of this React Conference.

FAQ

Chandra Carney is an accessibility professional with almost ten years of experience. She has built three accessibility programs at three big companies and also consults with companies on accessibility. She used to be a software engineer and is passionate about dogs and ceramics.

WCAG stands for Web Content Accessibility Guidelines, created by the World Wide Web Consortium (W3C). These guidelines are international standards for web and mobile accessibility and are referenced in global legal regulations. WCAG has different levels (A, AA, AAA) and versions (2.0, 2.1, 2.2).

EN 301549 is a European accessibility standard that includes WCAG as part of its baseline and adds additional requirements for cognitive disabilities. It is a technical standard transposed into law and is relevant for companies conducting business in Europe.

The ADA update in 2024 ruled that websites and mobile apps must be accessible, requiring compliance with WCAG 2.1 AA standards. This update applies to national, state, and local government contractors, making accessibility a legal priority.

The European Accessibility Act (EAA) is a law that mandates accessibility for products and services, including hardware and software, in the EU. It applies to many private sector industries and will be enforced starting June 28, 2025. Businesses must ensure their offerings are accessible to avoid penalties.

Accessibility is considered a civil right because it ensures that people with disabilities have equal access to products and services. Without accessibility, disabled individuals may lose their independence, privacy, and right to equal access, which are fundamental civil rights.

The persona spectrum, from Microsoft's inclusive design principles, helps understand related types of disabilities across permanent, temporary, and situational scenarios. It shows how solutions for one type of disability can scale to benefit a broader audience, summarizing 'when you solve for one, you expand to many.'

The different types of disabilities mentioned include auditory disabilities, cognitive, learning, and neurological disabilities, motor disabilities, speech disabilities, and vision disabilities. Disabilities can be permanent, temporary, or situational.

Accessibility refers to ensuring equal access for people with disabilities. It includes independence, privacy, inclusion, and is considered a civil right. It's about making sure that disabled people can use products and services without barriers.

Chandra Carney recommends a proactive approach to accessibility, integrating it into the software development life cycle. This includes planning with alternative use cases, inclusive research, accessible design, engineering checks, and frequent audits. Accessibility should be considered everyone's responsibility and not just a yearly audit task.

Chandra Carney
Chandra Carney
23 min
18 Jun, 2024

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Chandra Carney discusses accessibility in 2024, highlighting the importance of equal access for disabled people and the evolving view of disabilities as civil rights. The talk covers the global accessibility standard WCAG, with versions 2.0, 2.1, and 2.2, and the European standard EN 301549. Updates to laws such as the ADA in the US and the Web Accessibility Directive and European Accessibility Act in the EU are also discussed. The EU reinforces the importance of inclusion and holds businesses accountable for accessibility. Proactive accessibility is emphasized as a requirement and everyone's responsibility.
Available in Español: Accesibilidad en 2024

1. Introduction to Accessibility in 2024

Short description:

Hi, everyone. My name is Chandra Carney. I'm here at React Summit to talk about accessibility in 2024. I've been an accessibility professional for almost ten years, building programs and consulting with companies. Let's define accessibility and then discuss updates to standards, laws, and regulations. Accessibility is about disabled people, and it means equal access for them.

Hi, everyone. My name is Chandra Carney. I use the pronouns she, her, and I'm here at React Summit to talk about accessibility in 2024. You can find me on various social medias with my name here, Chandra Carney, as well as my website, the same thing. But quickly, some information about me before we dive in.

I live in New York. I'm an accessibility professional. I've built three accessibility programs at three big companies. I've been doing this almost ten years. I also consult with companies, so feel free to get in touch if you need anything. I also used to be a software engineer, so hello to all of you. I've recovered from two major surgeries in this last year and I've been making a lot of ceramics as part of my healing journey. I also really love dogs so much that sometimes I cry.

So, I want to say, as we're getting started, at the very beginning here, this won't be a talk on implementation, because I have some important accessibility updates to share, where we're at in 2024 and what's new in the landscape. We'll quickly define accessibility, then move on to some updates to standards and specifications. And then updates to laws and regulations. Then I'll talk a little bit about how to tackle it all. Before we talk about what's coming and what's new in 2024, we can take a moment to define how we talk about accessibility, so that everyone's on the same page. So, first and foremost, I want to define what and who we're talking about when we say the word accessibility. Accessibility is something we talk about when accounting for people with disabilities. We have a lot of misconceptions that accessibility is scalability or reliability or something maybe that's just easy to access. But in this context, it's about disabled people. And here, the phrase people with disabilities is considered person-first language. It's also acceptable to say disabled people, which is identity-first language. And I really find that I use them interchangeably. Identity-first language or people-first language might be what someone prefers, or it may not. It's just a personal preference. Back to defining all things accessibility here, there are many ways to define it, many ways to think about it. So, I want to introduce mine. Accessibility is equal access for people with disabilities.

2. Understanding Accessibility and Disabilities

Short description:

Accessibility is a civil right that ensures independence, privacy, and inclusion for people with disabilities. The UN recognizes the importance of accessibility, shifting away from viewing disabled people as objects of charity or medical treatment. There are various types of disabilities, including auditory, cognitive, learning, neurological, motor, speech, and vision disabilities. Accessibility is more than just for screen reader users and blind people. It also encompasses temporary and situational disabilities. The persona spectrum helps understand different types of disabilities and how solutions can scale to a broader audience.

It's independence for people with disabilities. It's privacy. It's inclusion. And above all, accessibility is a civil right. So, just think, if you're disabled and you're trying to fill out an inaccessible medical questionnaire, you might have to ask someone for help, like a stranger or a friend. And that could be very, very personal information that maybe only your doctor should know. So, that's taking away certain people's independence or privacy and their right to equal access.

When we're building software, we are making choices. All of these ways of thinking about accessibility is now actually recognized by the UN through something called the Convention on the Rights of Persons with Disabilities. It aims to shift away from viewing disabled people as objects of charity or as objects of medical treatment and moves towards viewing them as full and equal members of society. This may sound kind of basic, but if I'm disabled and I can't use products and services, how can I be a full and equal member?

So, another thing that I just want to run through is the kinds of disability. You've probably seen variations on these types of categorizations. There are lots of varied disabilities, and someone may have more than one disability. We have auditory disabilities, cognitive, learning, and neurological, motor disabilities, speech, and vision disabilities. It's important to remember here that accessibility and disability is more than just screen reader users and blind people. Disabilities can also be more than permanent. They might be temporary, like after a surgery or illness, you might need to use crutches or wear an eye patch, or they can be situational, like being in a loud or really quiet environment but still wanting to watch a video. The diagram you see on the right here is called the persona spectrum, and it's from Microsoft's inclusive design principles. It can be used to understand related types across a spectrum of permanent, temporary, and situational scenarios. It shows how a solution scales to a broader audience. And scaling to a broader audience can be kind of summarized. When you solve for one, you expand to many.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Accessibility at Discord
React Advanced 2021React Advanced 2021
22 min
Accessibility at Discord
This Talk discusses the accessibility efforts at Discord, focusing on keyboard navigation and the challenges faced with implementing focus rings and outlines. The speaker showcases a unified focus ring system and a saturation slider to address accessibility concerns. They also highlight the implementation of role colors and the use of CSS filters for accessibility improvements. The Talk concludes with insights on runtime accessibility checking and the development of a performant core runtime system for checking accessibility issues.
Configuring Axe Accessibility Tests
TestJS Summit 2021TestJS Summit 2021
30 min
Configuring Axe Accessibility Tests
Top Content
AXe is an accessibility engine for automated web UI testing that runs a set of rules to test for accessibility problems. It can be configured to disable or enable specific rules and run based on tags. Axe provides various options, but axe linter does not support all options. The importance of investing time and resources in accessibility is emphasized, as it benefits not only those with disabilities but improves the web for everyone. Manual testing is also highlighted as a necessary complement to automated tests for addressing accessibility issues.
Nested Interactive Elements: An Nightmare in Accessibility
React Advanced 2023React Advanced 2023
23 min
Nested Interactive Elements: An Nightmare in Accessibility
Watch video: Nested Interactive Elements: An Nightmare in Accessibility
Nested interactive elements can cause accessibility issues on websites, and the speaker shares a personal experience with an accessibility bug involving a list component. Mitigating nested interactive structures involves limiting these patterns during development and restructuring existing elements. The speaker provides recommendations for improving accessibility, such as adjusting role properties and gathering user feedback. The conclusion emphasizes the importance of accessible solutions and encourages sharing resources to build more inclusive experiences.
Dialog Dilemmas and Modal Mischief: A Deep Dive Into Pop-Ups
JSNation 2023JSNation 2023
10 min
Dialog Dilemmas and Modal Mischief: A Deep Dive Into Pop-Ups
The Talk discusses the use of dialogues and popovers in web development. Dialogues can be modal or non-modal and are now accessibility-supported. Popovers are versatile and can be added to any element without JavaScript. They provide suggestions, pickers, teaching UI, list boxes, and action menus. Modal and non-modal dialogues and popovers have different behaviors and dismissal methods. Browser support for these features is expanding, but there are still open questions about positioning, semantics, and other use cases.
a11y and TDD: A Perfect Match
JSNation 2022JSNation 2022
24 min
a11y and TDD: A Perfect Match
This Talk explores the intersection of accessibility and test-driven development (TDD) in software development. TDD is a process that involves writing tests before writing production code, providing a safety net for code changes. The Talk demonstrates how to apply TDD principles to real-life examples, such as filling out a form, and emphasizes the importance of user-centric testing. By using atomic design principles, code can be organized in a clean and easy way. The Talk also discusses the use of labels and test IDs in tests for improved accessibility.
How to do Good Without Doing Anything
React Advanced 2021React Advanced 2021
32 min
How to do Good Without Doing Anything
Accessibility is about making sure everyone can participate on the web, regardless of disability. Automated tools like Lighthouse and React Axe help identify accessibility errors and provide guidance on fixing them. Unit tests validate ARIA attributes and keyboard navigation, while integration and end-to-end tests focus on outcomes and simulate user experiences. Cypress.io is an open-source testing framework with excellent accessibility support. Implementing small changes leads to a deep understanding of web accessibility and bug resilience.

Workshops on related topic

Web Accessibility for Ninjas: A Practical Approach for Creating Accessible Web Applications
React Summit 2023React Summit 2023
109 min
Web Accessibility for Ninjas: A Practical Approach for Creating Accessible Web Applications
Workshop
Asaf Shochet Avida
Eitan Noy
2 authors
In this hands-on workshop, we’ll equip you with the tools and techniques you need to create accessible web applications. We’ll explore the principles of inclusive design and learn how to test our websites using assistive technology to ensure that they work for everyone.
We’ll cover topics such as semantic markup, ARIA roles, accessible forms, and navigation, and then dive into coding exercises where you’ll get to apply what you’ve learned. We’ll use automated testing tools to validate our work and ensure that we meet accessibility standards.
By the end of this workshop, you’ll be equipped with the knowledge and skills to create accessible websites that work for everyone, and you’ll have hands-on experience using the latest techniques and tools for inclusive design and testing. Join us for this awesome coding workshop and become a ninja in web accessibility and inclusive design!
Automated accessibility testing with jest-axe and Lighthouse CI
TestJS Summit 2021TestJS Summit 2021
85 min
Automated accessibility testing with jest-axe and Lighthouse CI
Workshop
Bonnie Schulkin
Bonnie Schulkin
Do your automated tests include a11y checks? This workshop will cover how to get started with jest-axe to detect code-based accessibility violations, and Lighthouse CI to validate the accessibility of fully rendered pages. No amount of automated tests can replace manual accessibility testing, but these checks will make sure that your manual testers aren't doing more work than they need to.
Web Accessibility in JavaScript Apps
React Summit 2022React Summit 2022
161 min
Web Accessibility in JavaScript Apps
Workshop
Sandrina Pereira
Sandrina Pereira
Often we see JavaScript damaging the accessibility of a website. In this workshop, you’ll learn how to avoid common mistakes and how to use JS in your favor to actually enhance the accessibility of your web apps!
In this workshop we’ll explore multiple real-world examples with accessibility no-nos, and you'll learn how to make them work for people using a mouse or a keyboard. You’ll also learn how screen readers are used, and I'll show you that there's no reason to be afraid of using one!
Join me and let me show you how accessibility doesn't limit your solutions or skills. On the contrary, it will make them more inclusive!
By the end, you will:- Understand WCAG principles and how they're organized- Know common cases where JavaScript is essential to accessibility- Create inclusive links, buttons and toggleble elements- Use live regions for errors and loading states- Integrate accessibility into your team workflow right away- Realize that creating accessible websites isn’t as hard as it sounds ;)