How to Easily Audit Your Website for Accessibility Compliance Using Free Tools
Learn the importance of web accessibility, how to perform an audit using a free tool, and make actionable changes to ensure your site is inclusive for all.
File
How to Check if your WebsiteApp is following Accessibility Compliance
Added on 09/30/2024
Speakers
add Add new speaker

Speaker 1: Hey everyone, in today's video we're going to talk about how you can easily check to see if your website or web app is following accessibility guidelines. I'm going to briefly highlight the importance of accessibility and give you some background around accessibility guidelines. Then I'm going to show you how to do the web accessibility audit using the free audit tool for your website or web app. This audit will send you a PDF and I'm going to show you how to read through it and make it an actionable report. At the end of the video we'll go over some additional resources that way you can feel confident about implementing changes to your website. If this is your first time, thanks for tuning in. My name is Brendan, I'm a product designer in Los Angeles. And I make videos around product design, UI, and UX. So if that's your kind of thing, make sure to subscribe for future content. The last thing I wanted to mention is this video is not sponsored. Let's get into the video. Web accessibility guidelines was initially introduced by the World Wide Web Consortium known as W3C. They're an international community that develops standards to ensure the long-term growth of the web. Web accessibility guidelines were first introduced in 1999 and have gone through various iterations since. These guidelines help people with a wide range of disabilities including visual, auditory, physical, speech, cognitive, language, learning, and neurological disabilities. Now you might hear the terms AAA or AAA and these are the three levels of conformance for ADA compliance. And each of these levels warrants greater levels of accessibility. At the end of this video, I will provide you a resource so you can learn more about these different levels. You may also hear the terms ADA and WCAG. ADA is known as the Americans with Disabilities Act and it applies to all products and services in America. WCAG stands for Web Content Accessibility Guidelines. I think it goes without saying the reason that we need to have our websites and web apps web accessible is so that we're inclusive to all. There are some unique legal obligations for the US, the UK, the European Union, Australia, and Israel. So I will be including a link so you can get some more information if those apply to you. There are a total of 12 guidelines organized under four principles with a total of 61 testable criteria. This is the Web Content Accessibility Guidelines and if you were to try to read through these guidelines, it would probably overwhelm you. This document would probably take you hours to read and it is filled with a lot of jargon. And it wasn't made so that anyone could quickly look through and make adjustments to their app. And this is really unfortunate. It shouldn't be this difficult for web developers and designers to follow these guidelines. Even their quick reference would take a team several days or even weeks depending on how large their app or site is just to do an audit. So I do think that this quick reference is a great resource that we should be checking once we have performed an audit to see if there's any updates or as these guidelines have been revised. I just don't think it's easy to implement looking at this reference alone. Of course it's our legal obligation to implement web accessibility guidelines, but I do truly think that most people want to make the internet inclusive for all. It's just difficult for them to do so. So now let's talk about an easy way for you to run an audit on your website or web app and then take that report and make it actionable so you can implement some changes. The tool is called ACE or A-C-E. It is an ADA and WCAG compliant audit tool. Their goal is to help mitigate risk or legal action. As you can see here in the spike of web accessibility lawsuits in recent years. Using the tool is really simple. Simply type in your URL and hit the get results button. Then you'll wait 10 to 15 seconds to get the results. I'd recommend filling out your email so you can get the PDF copy of the results. They may reach out to you, but I personally don't have a problem with it. Now a few quick things to note. First off, ACE does not collect private data from your website and it's compliant with GDPR and CCPA. When it comes to accuracy, they use AI engines and an API tool to evaluate your website to deliver results as accurate as manual testing. And lastly, ACE is powered by Accessibee. They are a fully automated web accessibility solution. The solution though is separate from the audit. They mentioned on the website for ACE that it will always be free. Whereas on Accessibee site, it says they offer a plan that starts at $49 a month with a seven day free trial. Now let's run through an audit to show you how it works. As I mentioned before, all you have to do is enter in your website. So let's just use Nike, for example, and then we're going to hit get results. It's going to fetch the data. It's going to take maybe 10 seconds. After it's loaded, you'll see the website pop up on the right screen. And then on the left side is going to be your results. All right, so we got our results here on the left. It says that you can check all of the results here within this tab. But the best thing to do is just simply download the audit, fill in your name and email. And once you've done that, you hit send me the report, then you'll get that email. It comes right away, which is great. Let me show you how it looks. So here's a report. I've run a few different reports. This is a total of 26 pages for Nike. I did one yesterday for Airbnb. It was nine pages. So they really give you as much detail as they possibly can. So for this first one, the first point is elements that visually appear as titles but are coded with a non-heading HTML tag should be included in a role attribute that equals to heading or having their text fixed. And they gave a 0% for 13 failures that Nike had. And then they give you specifics for where these errors are showing up. And so each section, they're going to give you examples of where it's not compliant. And that way you can make changes. So if I was you, what I would do is probably either print this out or put this in a tool where you can edit this document. And then just make sure to highlight all of the areas where there is additional notes. And from there, I would partner with a web developer. That way you can implement some changes. And also you probably would want to make sure that you put these in some stories. That way you can prioritize what matters most. All right. So let's do a second report. That way you can see what one would look like, maybe if it's a little bit smaller. We're going to do Felix Grey. So let's check out what Felix Grey accessibility rating is. So once again, on the right, it's going to fetch the website. On the left, it's going to show you results. And then we're going to export those results just to make it a little easier to read through the data. So it says that Felix Grey is semi-compliant. I'm going to just show you what it looks like if you were to look through it here. You can just quickly see all of the elements that it succeeded and failed, and it will give you all the code snapshots. But we're going to download this audit, and then I'm going to show you what it looks like. All right. So we just got the report. This one's 19 pages. So both reports are pretty large compared to Airbnb's yesterday at nine. But it's going to be the same thing where it gives you, there's a total of 50 points just so you know, and it gives you details for all 50 of those points. There are a total of 61 guidelines that we had mentioned, but the 50 that they test will put you in a really good position. I don't think you need to worry outside of this. They got a lot of 100%. There are a few failures with only like one or so notes. So that's a pretty good spot to be in if you're FelixGrey.com. In conclusion, I'm going to be supplying you with all of the links that we went through in this video. Make sure to give this video a like if you found value. Thank you so much for tuning in, and I'll see you guys in the next video.

ai AI Insights
Summary

Generate a brief summary highlighting the main points of the transcript.

Generate
Title

Generate a concise and relevant title for the transcript based on the main themes and content discussed.

Generate
Keywords

Identify and highlight the key words or phrases most relevant to the content of the transcript.

Generate
Enter your query
Sentiments

Analyze the emotional tone of the transcript to determine whether the sentiment is positive, negative, or neutral.

Generate
Quizzes

Create interactive quizzes based on the content of the transcript to test comprehension or engage users.

Generate
{{ secondsToHumanTime(time) }}
Back
Forward
{{ Math.round(speed * 100) / 100 }}x
{{ secondsToHumanTime(duration) }}
close
New speaker
Add speaker
close
Edit speaker
Save changes
close
Share Transcript