Explain Like I’m Your Manager: Digital Accessibility

All right, thank you all for joining. I hope you're all having a great day.

Quick question to start off. Can you see or do you perhaps know the accessibility features of the Euro coins? If you do, let us know in the Discord. I invite you to close your eyes for the next minute. We are going to simulate a website experience without the use of visual cues. This exercise is designed to help us understand the challenges that people with visual impairments face when accessing digital services. If you have closed your eyes, you can open them again.

We've just experienced one way humans interact with the website of this conference, jsnation.com, and it's being read out loud by the voiceover assistive technologies that's built into Apple devices. This is a practical example of how assistive technologies can make digital content accessible to visually impaired people. It reads out loud what it can read on your screen. So if you are experiencing any visual impairments, you can still obtain the digital information. Do note that most of the actual users of the screen reader use a speech speed that is much faster than the one you've just experienced to save time navigating.

This is the JSNation website in blurred vision mode. We simulate a visual impairment in which a person who needs glasses, like myself, can put them on and experiences the website like this. This is a website in low contrast mode. Not everyone in our society has the means to own a device with a pristine color contrast ratio as displays and premium devices do have, or are visiting our website in an ambient lighting condition that does not allow the website to be shown with the correct color contrast. For instance, if you are outside on a very sunny day. Deteriorating eyesight is commonly linked to aging, and people of a certain age often start to zoom in on everything they want to experience digitally. And more than half of the web users use a mobile device with smaller viewports. Providers need to optimize user experiences for these types of viewports.

I'm Martin. I'm a white male about 172 centimeters tall. I have a short beard. I have a modest fauxhawk. I wear thick, dark glasses. And next to building things on the web platform, I also enjoy playing guitar. Preferably obnoxiously loud. I'm a front-end devop engineer at Ascent, and that's the largest energy supplier in the Netherlands. And in my role, I focus on creating an accessible component library to help our front-end engineers, who develop all kinds of interfaces for our customers so that they can deliver accessible digital experiences.

I'm here to share with you for the next 15-ish minutes how you can ensure that you can create accessible digital services and convince your team, your stakeholders, or even your CEO why providing digitally accessible services matters. Leave your questions in the comments in the Q&A on the D-d-d-discard, and afterwards, I can get back to you.

Now, before I continue, I'd like to explain the following abbreviation. Some of you or the people you want to share this talk with might need to familiarize themselves with this one. A11y, or Ally, is a commonly used abbreviation for accessibility. It's a play on the word accessibility that starts with an A, with the letter A, and ends with the letter Y, and it has eleven letters in between. We will go through the what, the why, and the how of digital accessibility.

Now, what is digital accessibility? I like to use this quote from the Wikipedia article on web accessibility and extend it to the topic of digital accessibility. It highlights the correct main points. It's the inclusive practice of ensuring that no barriers prevent interaction with, or access to, digital services by people with physical disabilities, situational disabilities, or socio-economic restrictions on bandwidth and speed. In a nutshell, digital accessibility means that you are providing digital accessible services for everyone. To ensure that we create accessible web services, services must adhere to the WCAG or the Web Content Accessibility Guidelines. These guidelines, recognized as the international standard for web accessibility, provide a comprehensive framework for making digital content more accessible to people with disabilities. They are a crucial tool for designers, content authors, developers, and business stakeholders in our industry. The WCAG uses four main pillars to describe creating accessible services. It must be perceivable, operable, understandable, and robust.

Now why do we want to invest in the effort to make our services accessible? I'm not here to tell you a tale about we should do it because it's the morally right thing to do. Businesses need more compelling arguments to get on board. And I'm here to share some with you. If we look at the available statistics, we see that within the EU and the US, one out of four adult humans is experiencing some form of disability.

Perceivable, the information must be presented so that users can use it with at least one of their senses. For example, if they cannot hear audio of a video, they should at least be able to read captions. With operable, we want to say that users must be able to navigate your service and interact with its components effectively. For example, if the user cannot use a pointer device, like the Apple mouse situation I'm in now, they should be able to use their keyboard. With understandable, we say that users must understand the information provided by the service and how to operate within the user interface. And with robust, we mean that the information provided should be robust so that it can be interpreted by a wide variety of possible user agents, including assistive technologies such as screen readers that read the information on the screen out loud.

Now why do we want to invest in the effort to make our services accessible? I'm not here to tell you a tale about we should do it because it's the morally right thing to do. Businesses need more compelling arguments to get on board. And I'm here to share some with you. If we look at the available statistics, we see that within the EU and the US, one out of four adult humans is experiencing some form of disability. Looking at the EU statistics more specifically, we see that the older one gets, the more likely you will have to deal with disability. Declining visual abilities by aging is a well-known example. If you work on digital services for a bank, a government, or an energy utility company like I do, these numbers matter very much. With the shift towards a digital-first, perhaps digital-only service landscape, you need to get your stuff in order, I mean, accessible. If not, you are denying humans access to services that, in today's society, have a significant impact on their daily lives. To make the point that accessibility isn't just beneficial for humans with permanent disabilities, Microsoft considers a spectrum, where disabilities could be tied to a period in their persona spectrum, where humans experience permanent disabilities like blindness temporarily, like a few days after eye surgery, or situational, like for instance when your eyes need to adjust right after you drive out of a dark tunnel straight into the blaring sun. If we provide accessible services, we create an environment where our services become more accessible to the more abled humans as well. And this is called the curb cut effect. If you are unfamiliar with a curb cut, it's where the sidewalk's height is lower to the height of the street, mostly found at pedestrian crossings to aid humans in wheelchairs to cross the road more easily. The same curb cut makes road crossings also easier for parents pushing a stroller, or delivery humans pushing their trolley full of goodies across the street. If you consider the statistics shown, roughly 1 out of 4 adult humans has to deal with some form of disability. And knowing the lowering of barrier to entry thanks to the curb cut effect, sums up that providing accessible services can potentially increase your market reach by 25%. And there are more clear returns on investments. A study by maz.com, an agency specializing in search engine optimization, sees a clear correlation between providing accessible services and having a better organic reach in search engines. Sites with clear descriptive headings, the same kinds of headings that make navigation and comprehension easier for people with disabilities, are also easier for search engines to crawl. There are also some obligations around the Coordinator that businesses must adhere to. If you have a company with more than 10 employees, an annual turnover of 2 million euros, and you are providing digital web services to European consumers with the means of closing at contracts, you are pretty much obligated to deliver new services compliant with the WCAG 2.1 Level AA standard, amongst other things, starting from June 2025. The European Accessibility Act, which is far from new, went into effect April 2019 on the EU level, and is now being adopted by the Member States nationally. It will require eligible businesses to deliver new accessible features starting the 28th of June 2025, and in the five years after that, until the 28th of June 2030, eligible companies are given the time to transform their current digital landscape towards a more accessible one. But what's the risk? If you think, well, this is just GDPR with another underlying problem, people won't speak up, invoking the right to be forgotten is such a hassle that we can easily sweep it under the rug, well, guess again.

The difference here is that GDPR introduced a relatively new concept for society to grasp, data privacy. In most cases, data privacy does not directly impact your daily life. Disabilities, however, do. The disabilities rights movement has been alive and well for several decades now, and its results include demanding on-rams for buildings, ensuring sign language during important televised speeches, or installing signs with Braille in museums. It is no new concept for our society.

If we look at precedents from the US, we see that if people are denied access to services that impact their lives because they are backed by legislation, they will step up and defend themselves. In the US, the Civil Rights Division of the Department of Justice, a whole government division works on their mission to create equal opportunity by upholding the ADA or Americans with Disabilities Act and actively filing lawsuits against other government entities and companies to make sure they provide physical and virtual accessible services. Now, will we expect the same thing within Europe? Unfortunately, too early to say. But I'm sure that if a service is inaccessible, and that inaccessibility has a significant impact on someone's day-to-day life, the European Accessibility Act will empower people to speak up and act.

This legal compliance also relates to how you want your brand to be perceived. Ask yourself, if the thing you say or do today would end up in the news tomorrow, how would that impact the perception of your business, your brand? Now, how can we maturely work on accessibility? I believe you need to do three fundamental things. That is one, measure, two, mend, and three, mentor. With measuring, we want to gain insights into our current customer-facing services. Which ones do we have and who is responsible for these? With whom can I start a discussion on what accessibility issues their interfaces have and how we can fix them? Do we already test for accessibility? And if we do, what kinds of tests are we running? How many of them are we running?

The information here is directly inspired by Melanie Sommer's concept of continuous accessibility, which tries to create an overview of accessibility tests and issues to help steer resources in the right direction through data-driven decisions. For instance, how many automated and manual tests do you have in place? At which point in time of the software development cycle, how many bugs are found, how many of them are valid, what's the impact of the issue, how fast can it be fixed? What are we ignoring? All kinds of metrics to inform your stakeholders of the current state of your business's accessibility. And with which time frames do you assess the accessibility of your code or your interfaces? Depending on how fast the content on your interfaces changes, accessibility needs to be tested for regressions. Does that mean you must do a full manual audit every time a small part changes? No. You can run different types of tests at various periods in time, a bit like linting vs unit testing vs end-to-end testing, which run on different periods in the software development cycle. Provide authors with immediate feedback where possible. Linting software can instantly tell you that you need to remember to add an alt attribute to an image. Or use a content management system that enforces or encourages correct alternative texts or images if applicable.

Have developer-author tests run in your pipelines for instance to check if your components' properties turn on or off the correct ARIA attributes to enhance your custom element's accessibility. Where applicable, consider hiring other accessibility experts to audit your interfaces because they will look at your services with a fresh set of eyes. And try at least once a year to get someone with a disability to test your interfaces and ask if you can record their journey. I guarantee you that few things have more impact than showing your stakeholders people struggling to use your platform.

How can I test? How can I monitor? Well, here are a few tools to get you up and running. For people working with Figma, popular plugins that enhance accessibility in designs are Axe for Designers by Deque and Stark Contrast and Accessibility Tools. For people working on front-end code, you can use Lighthouse, which is baked in every Chromium's browser's devtools, or install and add Deque's Axe devtools, which give you some additional half-automated steps to check your service's accessibility. 57.38% of accessibility issues can be tested with automated tooling. The other 42% must be tested by a human. If you want to get the best accessibility score in town, I suggest actually scrolling through the WCAG. It's a fantastic list. Well, it's the list of which criteria you should consider and which each criterion they've added techniques and examples to ensure accessible services. It may seem daunting at first. Still, I've noticed that starting with one feature and linking the necessary criteria to that feature builds confidence that that feature is built accessibly and tested well on accessibility.

Now that you have all the metrics and information in place and you know what needs fixing, start fixing. Prioritize the work. Ensure it ends up in your planning. Fix it. Deploy it. And most of all, verify that you fixed the issue. Now we fixed our accessibility issues. How will we ensure that we don't end up with regressions the next time someone pushes to production? We mentor. As not everything can be tested with automation, the rest should be taken care of manually. By whom? By people aware of what to look for. Why everyone in your organization working on customer-facing interfaces? Why preferably everyone? Well, in software architecture circles, it's well known that the earlier you fix or tackle an issue, the lower the remediation costs. Find a contrast issue with the brand color. Have that discussion early in the design process rather than after launching it into production. And for that to happen, you need to have people every step of the way that are aware and know what to look out for in terms of accessibility. How are you going to get those people on board? Well, first of all, gather your champions.

How are you going to get those people on board? Well, first of all, gather your champions. Who is passionate about motivating and building and providing accessible services? Connect those people. Inform yourselves about their role within the process and talk and brainstorm with them about how to incorporate accessibility into your workflows. Talk about training and getting better at solving accessibility issues. Who is willing to audit your services? Or who knows professionals? Who can audit? Perhaps your company is of such significant size that it needs its own team of certified accessibility professionals. Allow your champions to organize knowledge-sharing sessions where they can raise awareness around accessibility and get people informed on what they can do and what the champions can do for them. And please, place them in critical roles that can add value at scale. For example, if your company has a design system that's used throughout, does it incorporate accessibility best practices? Does that team contain someone passionate about the subject? Or in your quality assurance teams, is there someone in that team that ensures processes are in place to test against accessibility's best practices before launching it into production? Encourage and empower people passionate about accessibility to help your company grow.