WCAG explained

Reading text and navigating websites is not nearly as obvious to everyone. The same goes for watching and listening to videos. For those with physical, sensory or cognitive disabilities, standard websites are more daunting than inviting. For them, digital accessibility is hugely important.

People with disabilities comprise about 20% of the European population. Moreover, the growing aging population means that by 2020, some 120 million Europeans will have age-related disabilities. This is why more and more organizations are choosing to follow the WCAG guidelines for content on the Web. But what do they mean and is it wise to set up your website according to these web guidelines?

What is WCAG?

WCAG stands for Web Content Accessibility Guidelines. This is a set of guidelines created by the World Wide Web Consortium (W3C), the same nonprofit that also set the standards for HTML, CSS and XML.

These progressive guidelines make websites more accessible to people with disabilities. The first version, WCAG 1.0, was created in 1999, and version 2.0 was released in 2009. WCAG 2.1, which took mobile devices in particular into account, came out in 2018.

Which users benefit from these rules?

Did you know that 8% of men are color blind? Fun fact: only half a percent of women suffer from color blindness. So you see; more people benefit from WCAG than you might expect at first glance. No wonder the government, wanting to provide clear information to as many residents as possible, is confidently betting on WCAG 2.1.

The WCAG guidelines do not only take into account people who are visually impaired, for example because they are (partially) blind. The rules also make it easier for people with physical disabilities, cognitive impairments, language problems or learning disabilities to consume online content. Finally, these guidelines also consider people who work in noisy environments or have a slow Internet connection (for example, on an oil rig).

Difference between WCAG 2.0 and WCAG 2.1

The differences between the penultimate version of WCAG (2.0) and WCAG 2.1 are mainly calculated for the explosion of mobile devices. Therefore, websites should be equally accessible in landscape and portrait. Navigation menus should also be collapsible without a mouse. When someone fills out a form or adds an item to a shopping cart, a site should display a status message so the user knows what changes. Also, the accessible name, the piece of code that describes buttons, search boxes and images to speech-enabled browsers, must be the same as the text on, in or near them for sighted users.

What do the guidelines prescribe?

The latest version of this document, WCAG 2.1, was published in 2018. It is organized according to four principles that in turn contain a set of guidelines:

• Observable
  All information and all components of the website must be sensory perceptible by the user. For example, the user should be able to adjust the font size. There may also be a read-aloud version of the site. For the latter, we recommend the leading company ReadSpeaker.
• Operable
  The user must be able to control all components of the user interface and navigation. This means, for example, that a Web site should not be required to be operable with a mouse, but that it should also be possible to navigate the pages with the keyboard.
• Understandable
  The information and use of the website should be easily understood by the user. Therefore, there are guidelines on translations, word usage, abbreviations, and reading level.
• Robust
  You could also think of this principle as “timeless”: diverse types of Internet browsers and technical tools should be able to read your content. Not only now, but even as technology advances, content must remain compatible.

The guidelines are testable by success criteria. These determine at what level the website meets the latest WCAG rules.

3 levels: A, AA, AAA

Websites can achieve WCAG 2.1 compliance at three different levels. In increasing degrees of difficulty, these are called A, AA and AAA. Requirements at levels A and AA are mandatory for Dutch (semi-)government websites.

1. Level A: 30 requirements
   This level is the easiest to reach. These are changes that do not have much impact on the design or structure of a site. For example, you may not use flashing elements or refer to an element by just mentioning its color: “click on the green button…”
2. Level AA: 50 requirements
   For this, your website must meet the requirements of Level A and 20 other requirements in addition. Many requirements have to do with color contrast and the way forms are designed.
3. Level AAA: 78 requirements
   The highest level of WCAG 2.1 compliance is AAA. Your site must meet all requirements for Level AA for this, plus 28 additional requirements. At the AAA level, for example, audio files should also be available in a version with sign language.

Who applies WCAG?

Several initiatives in the Netherlands already apply the rules of WCAG 2.1: all kinds of municipalities, Thuiswinkel.org, 9292.nl and some provinces. A hallmark has also been created for it, and the Accessibility Foundation is a widely consulted source of knowledge for those who want to apply the guidelines themselves.

Hallmark Threshold Free

Websites designed according to WCAG 2.0 or 2.1 guidelines can apply for inspection from the Drempvrij.nl Foundation. If sites are found to meet the guidelines at any of the three levels, they are allowed to display the corresponding hallmark. This is how visitors see (or hear) that this site has broad accessibility.

	Threshold-free level 1 green logo without stars
	Threshold-free level 2 green logo with 2 stars
	Threshold-free level 3 green logo with 3 stars
	Part of site meets orange logo

The registry of authenticators now includes mostly government agencies and insurers, but it is expected that more and more private sector companies will start making their websites low profile. It is also not inconceivable that Google will factor WCAG compliance into its ranking factors.