Web Accessibility: digital content for everyone

At first glance, most people associate accessibility with ramps for wheelchair users instead of stairs or floor guidance systems for the visually impaired in train stations. But accessibility is much more than that, and it applies to the Internet as well. Find out what accessibility means and what to look out for on the web.

Web accessibility 

The German term “Barrierefreiheit” is often misleading when it comes to a more abstract area like the Internet. At this point, it makes sense to explain the English term. The English translation of “Barrierefreiheit” is accessibility.

When it comes to digital accessibility, a distinction is usually made between the terms accessibility and usability. This distinction leads to a certain complexity in the field of digital accessibility.

Section 4 of the German Behindertengleichstellungsgesetz (BGG) (English: Disability Equality Act) also defines web accessibility for “information processing systems”.

It is not possible to quantify how many people depend on accessibility. However, it can be said that all Internet users benefit from accessibility. This is due to the broad and diverse target group.

Limitations of the target group include visual impairments or attention disorders, hearing impairments, and motor impairments. Age-related digital literacy limitations, poor Internet connectivity, and lack of devices such as a mouse can also be limiting. Situational barriers, such as brightness or volume, and cognitive limitations are also included.

Website accessibility

The accessibility of web pages depends largely on the HTML code. Optimizing HTML not only improves accessibility, but also improves search engine optimization (SEO) and search engine ranking (SERP), although accessibility is not a ranking factor per se. SEO is improved because the semantics of the HTML markup are easier for the crawler to understand thanks to accessibility. This aspect is also relevant for mobile sites, as their SEO results are crucial for indexing on the search results page.

Accessible websites therefore not only enable social equality, but also lead to more traffic.

Current website accessibility obligations

Specific regulations regarding the accessibility of websites are set out in the Ordinance on the German “Verordnung zur Schaffung barrierefreier Informationstechnik nach dem Behindertengleichstellungsgesetz” (BITV) (English: Creation of Accessible Information Technology under the Disability Equality Act. This ordinance obliges public bodies (authorities, judicial bodies, other institutions under public law) to ensure the accessibility of websites. In general, the accessibility aspects include not only websites, but also “mobile applications, electronically supported administrative processes [or] graphical program interfaces” (§2 BITV). This also includes PDF documents.

Who sets digital accessibility guidelines?

Basic recommendations for digital accessibility are provided by the Web Accessibility Guidelines. The guidelines were first published in 1999 by the Worldwide Web Consortium (W3C) and its Web Accessibility Initiative (WAI). Today, the guidelines form the basis for all national and international legislation on digital accessibility.

Specific accessibility elements

Digital accessibility consists of 10 points that can be checked using the W3C WAI Easy Checks. These items are summarized below:

• Page titles should clearly indicate the topic of the site.
• Images and videos have alternative texts (descriptions of what is shown).
• Headings must be clearly marked and recognizable as such (no level is exceeded: <h1> is followed by <h2>, etc.).
• Contrast ratio must be at least 4.5:1.
• Text can be enlarged up to 200% without overlapping.
• All relevant elements can only be operated via keyboard (including contact forms)
• Correct labeling of drop-down menus and clear marking of incorrectly/incompletely completed contact forms
• Moving, flashing, or blinking content must be pausable if it starts automatically and lasts longer than 5 seconds.
• Videos must have subtitles that are not automatically generated (e.g., YouTube).
• Text must appear in a meaningful order (can be determined by disabling images and CSS)

PDF document accessibility

Accessibility in PDF documents is achieved by embedding structured information and features in the document. Like HTML, PDF documents should have a clear structure. Text should be arranged in a logical order so that it can be interpreted correctly by screen readers.

Images in PDF documents can be tagged with alternative text to make the information in the images more accessible to the visually impaired.

PDF documents can also be tagged with metadata such as title, author, subject, and keywords. This information helps identify the document and can be used by assistive technologies.

Forms in PDF documents can be designed to be accessible. This includes clearly labeling form elements, using ARIA (Accessible Rich Internet Applications) properties, and ensuring a logical tab order.

As with websites, it's important that colors aren't the only method of conveying information. Additional distinguishing features should be present to ensure that the information is accessible to people with color vision deficiencies or other visual impairments.

It's important to note that creating accessible PDF documents doesn't depend solely on the software used to create the PDF. There are specialized PDF editors that provide tools for creating and checking the accessibility of PDFs. It's recommended that these tools be used and that the specific requirements of each accessibility standard be followed to ensure that PDF documents are accessible to all users.

The PDF Accessibility Checker (PAC) can be used to check if a PDF document is accessible.

Digression: embedding fonts

To ensure good readability, it's a good idea to embed fonts in documents. Many large companies use a specially selected corporate font. This may be custom designed or licensed. By purchasing the appropriate license, you have the option to install your corporate font, i.e. the font files are available directly on your computer. This allows you to use the font in various applications on your computer. However, this is usually not sufficient.

If you want to send a document externally, you must embed the font. This is the only way to ensure that the document will display correctly on other devices that don't have the font installed.

Embedding fonts in documents can significantly increase file size. This is because the entire font file is automatically embedded, even if only individual characters are needed. The font file contains various character sets as well as information about the font itself. This additional metadata is necessary to correctly identify and process the font, but it also increases the size of the document file.

The problem is that certain file formats, such as PDF, don't allow strong compression of embedded fonts without sacrificing font quality. However, the quality of the embedding should be optimized for accessibility.

Solutions

There are two solutions to this problem. First, you can use system fonts such as Arial or Times New Roman, which come pre-installed on most devices and operating systems. This will avoid display problems or a massive loss of quality.

Another option is to use cloud fonts. These are not necessarily installed locally on the user's device, but are usually dynamically loaded from a server when the website or application is accessed.