What is WCAG

Researching how to make your website ADA-compliant and keep coming across the term “WCAG”? If you are unsure what WCAG means or whether you need to care about it, keep reading.

When walking around different cities, have you ever noticed that many curbs have a little cutout where the crosswalk is? This little ramp is built for wheelchair users so they can safely get across the street. But this curb cutout helps parents with strollers, travelers with suitcases, and delivery workers pushing dollies, too (or in NYC, you will see Amazon delivery drivers pushing large carts around).

Accommodations like this are required under the Americans with Disabilities Act (and other laws in different countries). Just like we need to make certain physical accommodations for people with disabilities, we also need to make digital ones.

Your website needs to be usable by everyone, regardless of their abilities. While the ADA and other laws require us to provide an accessible online experience, WCAG is how we do it. Simply put, WCAG (Web Content Accessibility Guidelines) are international standards that accessibility experts follow to ensure our websites are compliant and usable.

In this blog, we are going to break down why you need to care about accessibility and WCAG, the core concepts that govern the guidelines, and places where you can make small tweaks and get some big wins. We’ll also include a quick sample of how you can talk to your clients about making their websites accessible.

Before we begin, just a quick note: web accessibility is not a legal compliance checkbox. This is a path to build better, more profitable websites.

I started working in web accessibility in 2013, and for over a decade, I felt like I was screaming into a void about how important it is. While design trends and bad AI websites haven’t helped, new laws and a rising number of lawsuits have prompted business owners to pay closer attention.

But building an ADA-compliant website should not start out of fear. Not only is it the only ethical choice, but it’s also about your market size.

In the US alone, over 27% of adults live with some kind of disability. If they cannot use your website on their own, they may go find a friend to help them. Want to know what will happen 99% of the time, though? They hit the back arrow and never come back. How you build a website can quite literally make someone’s day worse. Do you really want to do that?

When our websites are not accessible, we are actively excluding audience members who would otherwise love to give us money.

Beyond losing 25% of your market share, you are also saying goodbye to discoverability. Web accessibility standards align almost perfectly with SEO and UX best practices. If you want to improve your Google rankings, get found in AI searches, and increase your conversions, you need to be building accessible websites.

Your agency is make-or-break for many clients. If you can’t build a website that does something for them, they also leave and never return.

Web accessibility is not an optional upgrade. It’s integral to any great website.

So how do we build websites that everyone can use? We follow international standards. Developed by the international group W3C, web content accessibility guidelines (WCAG) are a set of technical standards to help make websites easy for everyone to use.

Currently, WCAG is at version 2.2 (actively working on version 3) and has three levels of compliance: Level A, AA, and AAA.

These technical standards help guide web developers, designers, copywriters, and marketers in ensuring everyone has equal access to the digital content they create.

Find it hard to believe this is an issue? For several years, if you wanted closed captions on your Instagram videos, you had to use a separate app and burn them in. Without the closed captions, deaf and hard-of-hearing users could not understand your videos. You even saw some people who would leave comments on larger creators’ videos, asking them to use captions so they could be included. Instagram finally added captions throughout the app in 2022. Instagram launched video in 2013 – that’s nearly 10 years of actively excluding the deaf community.

While I could find fault all day long, I understand that many web developers and marketers simply do not realize what they are missing until it is shown to them.

If you have never used a website with a screen reader, grab a Mac and turn on VoiceOver. Then, try to go through one of your most recent websites. What kind of experience was that for you? That is the reality for people who need assistive tools like that to surf the internet all the time.

The basis for WCAG and its technical guidelines is the POUR principles. These four key ideas are to ensure a website is Perceivable, Operable, Understandable, and Robust.

You can read through my full breakdown of the POUR principles, but these concepts help to inform the standards W3C creates and put into practice with WCAG.

In short:

• Perceivable: Can everyone access, understand, and interact with your website content?
• Operable: Can everyone navigate your website, even if they use different tools?
• Understandable: Can everyone understand the content on your website?
• Robust: Does your website work, even with assistive technology?

W3C applies the POUR principles to technical standards to define WCAG compliance levels. The great news is that if you are following technical SEO and UX best practices, you may already be more compliant than you think.

As we mentioned, the latest set of WCAG standards is version 2.2. Most web accessibility laws require you to comply with 2.1 level AA, so you have some time to catch up to the latest version.

What feels complicated about WCAG for a lot of people is the different levels. What are the big differences between A and AAA? These three levels are really the success criteria by which we judge a website’s overall accessibility.

Basically, these different levels are:

• Level A: Your bare minimum. These are many of the basic things that don’t take a ton of time, but need to be included. Address items like keyboard shortcuts, alt text, and clear form labels.
• Level AA: The global standard, and what your agencies should aim for. Takes more time, but your website is optimized for assistive technologies, correct headings, design consistency, and doesn’t convey information through color alone.
• Level AAA: More advanced accessibility adjustments. These can be difficult for all content to meet. Includes features such as sufficient touch target sizes and the ability to disable animations.

While most laws require Level AA conformance, we also recommend that most web developers, marketers, and agencies aim for it, too. Level AA is doable for most agencies and typically has a lot of crossover with work you are already doing.

If you have made it this far, congratulations! I understand that web accessibility and WCAG can feel super technical. The great thing is that, especially within A and AA, you may already be doing a lot that aligns with WCAG.

Want to check if your design and development are truly inclusive?

Let’s talk about some quick, easy web accessibility changes that follow WCAG standards.

When you choose a font and background color, it needs to be readable to everyone, including people with low vision and color blindness.

Before you choose that pretty orange color for your headings on a white background, run it through WebAim’s free Contrast Checker. If you get a 4.5:1 ratio, it will pass. If it hits a 3:1, you can use it for large text only.

Back in the dark days of SEO, I knew lots of people who were stuffing keywords into alt text. We don’t want to do that. These descriptions are for people using screen readers to understand the image’s context and purpose.

It’s not just enough to have the ALT text present – it needs to describe that image, too.

It’s been a design trend for years to “simplify” a form’s look by removing labels and using placeholder text in the field. This should be fine, right? Wrong. Assistive tools do not read that placeholder, so you are asking a section of your audience to fill out a form, and they have no idea what that field even is.

While I do know some people get away with using “screen-reader-only” form labels, I personally prefer to keep the visible label. This makes for a far better user experience and keeps your form understandable, too.

When someone hovers over a clickable element, does anything change to indicate there is more information? This applies largely to links, buttons, and other interactive content. But your hover states should be clearly visible and disappear when something is clicked.

It’s not enough to just have a hover state, though. For keyboard users, the focus state is important to indicate where they are on the page. I’ve seen a recent trend of hiding the focus state altogether; never do that.

Videos can help tell your brand story in just a minute or two, and be a great way to build trust with your audience. If you are helping clients add videos to their websites, you need to include captions for the narration.

While sign language interpretation would be ideal (level AAA), closed captions allow more of your deaf and hard-of-hearing customers to engage with and understand your videos.

You may already have clients emailing and asking you what WCAG is and about web accessibility. Great, honestly! This is not something to fear but to get excited about.

But if they aren’t and you are starting to understand how important this is for all your clients, you need to plan how to talk to them about it.

For one, web accessibility is not something you do after you’ve launched a website. It can affect your colors, content, and how you code a website. While you absolutely can audit a website and perform web accessibility remediation, it is much better to bake it in from the start. (I wonder how much more expensive it was for Instagram to add captions so many years later.)

Others would argue that you could pitch web accessibility as a premium add-on in your website proposals, but honestly, nah. This is not an optional item for your checklist. This is legally required and, again, can exclude 1 in 4 customers if not done right.

Instead, web accessibility is your unique value proposition. If you can build in line with WCAG standards, charge more for websites, help your customers achieve a better ROI, and improve their discoverability and conversion rates.

And before you think you need to learn every single WCAG standard to sell this, you can work with a white-label web accessibility partner to make it easy and scalable.

The tl;dr version? When a client asks why this is something they need to care about, you simply need to explain:

1. This is legally required under the ADA and international laws.
2. It helps you reach 25% more of your target audience.
3. It makes a website easier to use, improving conversions.
4. It helps you be better found on Google and AI search engines.
5. Nets a 100:1 ROI than without it.

An accessible internet is an effective internet. When we create websites that unintentionally exclude people, we are leaving money on the table.

If you want to help your clients make more money, following WCAG standards is really your best option. Web accessibility ensures that everyone can navigate a website, understand the content, and make those crucial decisions to become a buyer.

While I know all of us work hard to bring in leads through a variety of sources, every single website agency I know operates heavily on referrals. The best way to get more of those? Have happy clients.

Make them happy by building them a website that truly works for them and their customers.

Not quite sure where your work stands? You can run your agency website through tools like WAVE to identify accessibility errors you may be making. Just keep in mind, automated tools only find about 30% of issues.

If you want to deep dive into web accessibility, I will be launching something very soon. Feel free to schedule a call or join the waitlist to be the first to know when it’s available.