If you are a professional in the world of online services, whether you are a designer, a developer, or a product owner, you will have at least once dealt with either one of these questions: Is your product easy to use? Are all your elements easy to interact with for your targeted audience?

For many, web content accessibility has always been a nebulous concept. The level of knowledge on what makes a website truly accessible to all people varies very strongly, both in education and the professional world. When accessibility isn’t the main goal in a product pitch, it is often only thought of in the later stages of the branding and the design. Soon however, this is going to change. From June 2025 onwards, the Web Content Accessibility Guidelines is going to be a mandatory course if you want to minimize the legal risks. And that’s thanks to the European Accessibility Act.

What does the European Accessibility Act (EAA) entail?

From June 2025 onwards, the European Accessibility Act will enforce all E-commerce platforms to adhere to the Web Content Accessibility Guidelines (WCAG). (Semi) government websites were already required to follow these guidelines by level A and level AA since 2016. But now all products and services will have to comply by these rules.

The European accessibility act covers products and services that have been identified as being most important for persons with disabilities while being most likely to have diverging accessibility requirements across EU countries. The Commission consulted stakeholders and experts on accessibility and took into account the obligations deriving from the UN convention on persons with disabilities. These products and services include:

• computers and operating systems
• ATMs, ticketing and check-in machines
• smartphones
• TV equipment related to digital television services
• telephony services and related equipment
• access to audio-visual media services such as television broadcast and related consumer equipment
• services related to air, bus, rail and waterborne passenger transport
• banking services
• e-books
• e-commerce

Web Content Accessability Guidelines

The WCAG is a set of guidelines created by the Web Accessibility Initiative (WAI) of the World Wide Web Consortium (W3C). These guidelines are designed to make web content more accessible to people with disabilities.
 The WCAG is used by a diverse range of individuals and organizations, including web designers and developers, policy makers, purchasing agents, teachers, and students. To cater to the varying needs of this audience, the WCAG provides several layers of guidance, including overall principles, general guidelines, testable success criteria, and a rich collection of sufficient techniques, advisory techniques, and documented common failures with examples, resource links, and code.

Three conformance levels of WCAG

The success criteria are divided into three different levels of conformance. Level A, Level AA and Level AAA. AAA being the highest level of compliance.

• Level A – Considered to be the least stringent, Level A success criteria are required for all websites. If your website is not compliant with WCAG Level A, it may have severe accessibility concerns that prevent people with disabilities from using it.

• Level AA – Websites that conform to WCAG Level AA are reasonably accessible for the majority of users. The majority of websites should strive towards Level AA compliance. To accomplish this objective, content must achieve all Level AA and Level A success criteria.

• Level AAA – Web content that conforms to WCAG guidelines Level AAA accessibility is considered ideal. To achieve Level AAA conformity, content must adhere to every WCAG recommendation (including Level AA and Level A success criteria). Nevertheless, some Level AAA success criteria are highly stringent, and certain types of content cannot adhere to every guideline.

The majority of websites should strive for Level AA conformance with the latest version of WCAG.

A good example of a level AAA website is The White House’s official website. The website allows the user to easily toggle between different viewing options for people with disabilities. You can choose to view the site in high contrast or to view the website in a large font size.

What can you do?

There are two types of accessibility testing practices: automated and manual. When you conduct automated testing, you use online tools or browser-based extensions to scan your website and identify common accessibility issues. Here are a few popular examples of automated testing tools, which can be good for detecting significant accessibility problems:

• Wave
• Google Lighthouse
• Siteimprove Accessibility Checker
• accessibilitychecker.org/

Manual accessibility testing involves conducting a human analysis of your website. Although the WCAG guidelines can be highly theoretical, the success criteria and techniques are the most important aspects to consider during manual testing. When conducting a UX audit of your website, you can assess its accessibility by using testable parameters, commonly known as usability heuristics.

Going through every single success criteria of the WCAG to review your site can be an agonizingly slow process, and most of the criteria may not even be relevant to improving your website's accessibility. For example, if you have a website that sells clothes, you would want to focus on factors such as ease of navigation, product descriptions, checkout process and the proper use of color contrasts for readability, rather than all of the WCAG criteria.

Many companies find it beneficial to conduct a website audit that combines both manual and automated techniques. While automated tools are useful, they cannot match the thoroughness and personalization of a human audit. However, relying solely on humans to test your website could result in overlooking faults that only automated tools can detect. This is why Fabrikate uses a hybrid approach. We create manual audits that are customized to your website's content, offering effective solutions to increase your product revenue and enhance your customers' personal experience. Additionally, we use tools such as color contrast checkers to determine whether your website meets WCAG standards.

Why color contrast matters

In many cases, reviewing the color contrast could resolve the vast majority of accessibility issues your website could potentially have for people with impaired vision. Here’s why. It addresses the following:

• The readability of both large , medium and small text.
• The visibility and readability of graphical objects and user interface components.
• The visibility and readability of your content for people with different types of color vision deficiencies. Colors in the blue and purple range are generally more visible than the green and yellow range. Which is why big tech companies like Apple and Google typically uses a variation of blue as an accent color for their user interface components.

To understand how the color contrast checker works, you need to know what how a contrast ratio works. If your background color is represented by 1, then your forefront color holds a certain ratio to it. So a 1:1 ratio means that your forefront color and background color are the same. A 2:1 ratio means your forefront color is twice as light, or dark, compared to your backdrop, but it is still considered to be quite low in visibility. To pass the color contrast checker completely (level AAA) for all text sizes, your contrast ratio has to be a minimum of 7:1. The achieve a level AA pass, the minimum is about 4.5:1. And the lowest, level A, is a minimum of 3:1. Anything lower than 3:1 is considered inaccessible and does not pass the WCAG guidelines. The highest possible contrast ratio is 21:1, which is black on white. So let’s put this principle to the test with our branding, shall we? Is our staple black and green combination WCAG compliant?

This test highlights the importance of using brand colors properly and following brand guidelines to ensure that your online content is accessible. For instance, if our website background color is green (#64D772) and the foreground color is white (#FFFFFF), the contrast level would be lower than level A, leading to significant accessibility issues.

The importance of web accessibility can’t be overstated. As the digital landscape continues to evolve, ensuring that websites are accessible to all individuals, regardless of their abilities or disabilities, is not just a matter of compliance, but a fundamental aspect of creating an inclusive and equitable online environment. By prioritizing web accessibility, we not only enhance user experience but also promote a more inclusive society, breaking down barriers and fostering a digital world where everyone has equal opportunities and access to the wealth of information and services available online.