Web App Accessibility (feat. React)

Benefits of Accessibility

Marcy Sutton Todd

Marcy Sutton Todd

Principle Studios
Web App Accessibility (feat. React)

Check out a free preview of the full Web App Accessibility (feat. React) course

The "Benefits of Accessibility" Lesson is part of the full, Web App Accessibility (feat. React) course featured in this preview video. Here's what you'd learn in this lesson:

Marcy describes the benefits of accessible websites like SEO, performance, and business growth. She also spends a few minutes myth-busting some common accessibility misconceptions and discusses privacy issues related to screen readers.


Transcript from the "Benefits of Accessibility" Lesson

>> We talked a little bit about the range of experience that people have with disability that it's so varied. This really comes through in how people interact with computers and mobile devices. We can think about how people surf, some people use the mouse, some people don't. Some people use things called switch devices, which are small keyboard devices that have a limited set of keys.

So if you have limited motion, but you can hit a couple of keys, you have an easier interface to get through the computer. Some people use head wands. If you're quadriplegic or paraplegic and you have limited use of your limbs, there are other ways of navigating the web.

And so if we really focus on the basics, amazingly, we can sort of support some of these technologies that people use. And so even more of a reason to learn the basics of web accessibility. So let's start busting some myths about accessibility. Some of the things that I've seen crop up that are misconceptions.

So first, screen readers use JavaScript. Don't need to make a no JS site for a screen reader to use it. They look at the page as rendered and that ss rendered, that's gonna come up a lot. I mentioned shadow DOM and web components, that's kind of the term I learned in how accessibility would apply to that, was that it's important that it's how it gets rendered.

It's like the whole thing and the rendered source of the page, so screen readers rely on that. That said, screen readers are not the only aspect of accessibility. We'll dive into it quite a bit, but we're gonna hopefully give you lots of tips and techniques for more than just screen reader accessibility.

People also navigate by voice, and this is one area that semantic HTML in particular, will really help out. One question that I've gotten is, can we track screen readers to know kinda how people are using our sites, how many people are using screen readers? And the answer is no.

And it's not for a technical reason, it's actually for a privacy reason, mostly. I have an article in the in the slides from Marco Ziva. He worked at Mozilla for a long time, he's blind and he wrote very passionately about why we shouldn't track screen readers on the web.

And I'll read this quote, he said, letting a website know you're using a screen reader, means running around the web waving a red flag that shouts, here, I'm visually impaired to blind at anyone who is willing to look. And so we don't want to track people who don't wanna be tracked.

He said that it was the one place, being the web, that blind people could navigate around relatively undetected without comments or without needing help if something was actually accessible. I thought that's really powerful to be able to help people live more independent lives just by making stuff more accessible.

That's an impact that we don't necessarily think about all the time. So yeah, lots of ways that people use the Web and we just wanna build it accessibly. And just let it be, we're not gonna try and track people. There are some areas of analytics, if you're really curious about that, we can talk about it more.

But for screen readers in particular, we do not wanna track people. So we have some overlapping areas of accessibility that kind of feed into that persuasion area. If you need to convince people of, how can we line this up with our other objectives? There are some overlaps starting with Search-Engine Optimization, SEO.

So accessibility doesn't directly affect how websites are ranked in things like Google or Bing, but headings are. There was kind of unfortunate practice in SEO of just jamming as much as many key words that you could into a page and fortunately, that's not the way people do things anymore.

But those heading tags are still very important. They tell Googlebot or blind people, how a page is structured. And so that semantic markup that we put into our pages helps both accessibility and search engine optimization. And also using links in and out of your site kinda create this network, yeah, it just adds some legitimacy to your site.

Links are good for navigating, they work great in screen readers and with the keyboard, and so that's another overlap. Performance, which we will talk about later in our design section. But if a site loads fast, you can interact with it quicker. It's kinda good for everyone, it's like, yeah, accessibility really is a benefit to everyone.

There's a talk that I've linked in the slides from Eric Bailey at the PerfMatters conference. It was one of my favorite things about accessibility and performance. if you're a performance person, or interested in it, I would highly recommend checking out that talk from Eric Bailey. And again, we'll talk a lot more about performance later.

Security, I touched on this briefly, but if your user interface isn't accessible, it can be become a privacy or security issue. If you think of an ATM or like a point of sale system or something, if a person can't interact with it without getting help, they can't do it independently.

So we wanna try and make our interfaces either physical interfaces are kinda an analog to the digital ones that we're creating. But we don't wanna force someone to make a choice between access and security, which is really interesting to me, like those kind of overlaps are super fascinating.

Customer and business growth, I mean, the more accessible your site is, the more people can use it. Or the flip side of it, the less accessible your site is, the fewer people can use it, the fewer customers you might have. For accessible platforms, if they're accessible from the start, then you could have more early adopters that have disabilities.

It's unfortunately left out, accessibility is left out often early in the process when that's precisely when we need to think about it the most. And so I think it can help your growth of your business to be considering accessibility from the beginning. You also have the benefit of having less debt.

We talked about access debt that accrues over time and it can be really hard to root out when it's in the DNA of your business or the DNA of your product. And so the earlier we tackle this, the better.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now