What the WCAG 2.0 guidelines are and why they matter in 2023
Alright, time to explore why it's crucial to make your website accessible to everyone, demystifying the often-forgotten WCAG 2.0 guidelines, and their importance in 2023.
Plus, we'll get into the nitty-gritty of the different levels of conformance and share some practical tips on color contrast, keyboard navigation, and alt text for images.
So let’s start with the basics. When building your website, you probably want everyone no matter the person to be able to see and understand your site that you’ve spent so much time on. This is why web accessibility is so important, so all your visitors have the chance to interact and make the most of your website despite any disabilities.
What are the WCAG 2.0 guidelines?
There is a guideline called WCAG 2.0 (Web Content Accessibility Guide) that will guide you to create a more inclusive and accessible website for all users.
You see, not everyone experiences the web in the same way, and some users might have a harder time navigating or understanding content because of cognitive or physical disabilities. Some of the key points the WCAG 2.0 covers are:
- Perceivable - Basically, "perceivable" means that users should be able to, well, perceive your content. This refers to things like providing text alternatives for images, captions for videos, or making sure there's enough contrast between text and background colors.
- Operable - "Operable" is all about making sure users can actually navigate and use your site, like making it keyboard-friendly or avoiding flashy content such as animations and interactions that could trigger seizures.
- Understandable - When we talk about "understandable," we're referring to making the content and site operation easy to grasp for your visitors. That means using clear language, creating predictable navigation, and helping users avoid and fix any mistakes they might make.
- Robust - Lastly, "robust" is all about making sure your site plays nice with different browsers, devices, and assistive technologies, like screen readers.
While these guidelines are a great starting point for your website builds, it’s far from everything you need to think about. But think of it as a start, not an ultimate list.
Why are the WCAG 2.0 guidelines important?
Okay so we know what they are, but why do they even matter to begin with? Below we’ll break down some of the key reasons why you should always be building website with the WCAG 2.0 guidelines in mind.
Wider audience
As a matter of fact, 15% of the worlds population have some sort of disability. So building an inclusive website also means that your potential userbase grew 15% – now that’s ROI. And heads up, accessible websites often rank better in search engines, a perfect way for you to reach more people!
Ethical
As you already know, creating an inclusive website is just an all-around good ethical move. . We won’t discriminate therefore, we want to make sure everyone has the opportunity to interact and enjoy a well-developed website!
Legal requirement
Apart from it being a moral reason and a way for you to reach a wider audience, WCAG is a legal requirement in some countries and markets. Laws and regulations exist for websites, particularly if your website is related to public services to ensure accessibility to people with disabilities.
Three levels of compliance
The more the better is generally the right choice when it comes to web accessibility, but there are specific scores of measurements you can use. Specifically: A, AA, and AAA being the best.
Starting with level A, which is the most basic level of accessibility. It’s the bare minimum you want to achieve to make your website more accessible. But don’t get me wrong, this is a really good start! But we also have some room for improvement.
So next up we have level AA, which goes beyond the basics but still has a nice balance between making significant improvements to your website while still not being too hard to achieve.
Finally, there is level AAA. This is the gold standard if you really want to stick out from the crowd, and the highest level of accessibility you can reach. However it can be quite tricky to reach this level for most websites, but it’s still possible!
How to implement WCAG 2.0 guidelines
As mentioned before, it’s now time to break down how to actually implement the WCAG 2.0 guidelines:
- Color contrast
Generally speaking you want to use colors with high contrast, meaning gray on white is probably not a good idea.Because remember, anyone should be able to read it. And at any point while editing colors in Webflow you will be able to see a small little text indicating A, AA, or AAA, depending on the color contrast of your current selection.
- Keyboard navigation
You should also make sure that your website is fully navigatable by keyboard. You should ensure that all interactive elements on your website can be accessed and operated using only a keyboard. This includes links, buttons, and forms. You should also make sure keyboard focus is visible and follows a logical order, so it’s as easy as possible for your visitors to navigate without a mouse.
- Alt text for images
One important but often forgotten thing to remember is that every image you have on your website should have an alt text. And when adding alt text for your images, it’s all about writing a short, sweet description that captures the image's essence.
This way, screen readers can share the image's purpose with visually impaired users, making your site more inclusive. Just describe what's important, and you're good to go!
Following all of these steps and guidelines will already put you way ahead of most competitors as it’s often forgotten even at larger organisations. Let’s make the web accessible!
