How to implement an accessible website

In order to create a fully accessible website, we need to focus on various aspects. First of all, we need to find out and understand how people with disabilities navigate the internet, what their needs are, and what they struggle with when using digital services. We also need to know what technological solutions they use, like, for example, screen readers). The next step is to take care of the technical aspect.

The standard we can use for this purpose is the Web Content Accessibility Guidelines (WCAG) prepared by the World Wide Web Consortium (W3C). The document is a compilation of the best practices of the world's largest tech companies that has become a reference standard in countries around the world. In essence, the standard consists of four principles, 13 guidelines, 61 success criteria, and three levels, A, AA, and AAA, of conformance.

4 main principles

Perceivable

Information and user interface components must be presented to users in a way that’s accessible to their senses. Examples:

• Content should have different options of display, like a simpler layout or up to 200% zoom, without losing information and a structure without the need to scroll horizontally.
• Appropriate font size and contrast between different page elements should be ensured.

Operable

All functionalities of the website and its navigation should be operable in different ways. Examples:

• Giving users enough time to read the content.
• Designing the website so that it's operable through a keyboard interface.
• Adding functionalities to the website to allow easy navigation between its individual elements.

Understandable

The content should be presented in an intuitive and easy to understand way. Examples:

• A coherent and predictable navigation system. The pages should appear and operate in predictable ways. An example is descriptive links that clearly indicate where the user will be redirected by clicking a link instead of a simple "click here" option.
• Unique, clearly understandable labels on buttons or forms.

Robust

Content on the website must be robust enough that it can be interpreted reliably by additional external software, including assistive technologies like a screen reader. In order to ensure that content is implemented using markup languages, elements must have complete start and end tags.

13 Guidelines

The above principles can be classified into 13 guidelines divided into 61 specific requirements called success criteria. For example, criterion 3.2.3, consistent navigation from level AA, states that navigational mechanisms, like a menu, on individual pages, should be consistent, logical, and repeatable within the entire website. In addition, the interface should be navigable with a keyboard.

Three levels of conformance: A, AA, AAA

The level of conformance determines the difficulty of implementing the criteria and the level of support provided to the user. A is the minimum level that must be ensured in order for users to be able to use the website. Level AA is recommended for many users to be able to use the website without any problems. Level AAA ensures comfortable use of the website for almost all users. Example guidelines for individual levels:

A

• Have text alternatives. Each picture, graphic element, or image should have a text alternative describing the graphic file.
• Logical and intuitive navigation.
• Navigation with a keyboard.
• Clearly define the language of the website so that the screen reader can read it without distorting the reception. For example, a Polish website read with an English accent.
• Semantic markup, like HTML5 elements that should be used when creating a website.

AA

• Responsive web design.
• The minimum contrast between text and background at 4.5:1 is necessary to meet the requirements of the standard. For better legibility of the layout, contrast should be as high as possible.
• Legibility and functionality are maintained at 200% zoom. For example, smooth navigation would be hindered by the need to scroll horizontally.

AAA

• 7:1 contrast.
• Video with sign language or real-time subtitles.
• Alternative content is understandable for people with primary level education.

It’s worth noting that the AAA level is quite difficult to achieve and isn’t usually required. The AA level is a reasonable compromise between the effort required for website implementation and its usability. In order to meet the requirements of the AA level, all the requirements of the A level must also be fulfilled.

How much should an accessible website for people with special needs cost?

An accessible website isn’t a premium version and should not cost more than its regular version. It’s enough to follow the appropriate rules when creating a new product. Unfortunately, due to a lack of awareness, knowledge, and a focus on the aesthetic aspects, the vast majority of websites still fail to meet the requirements of the standard and don’t follow the principles. The internet, like any business, follows certain rules and compliance with the standards should be ensured.