Accessible websites: What you should know before the new accessibility obligations come into force

With the European Accessibility Act (EAA) passed in 2021, a new obligation for online store operators will come into force from 29.06.2025: By law, all online stores must be barrier-free from this date. More precisely, the BFSG applies to all products placed on the market from 29.06.2025 and all services provided from this date.

The aim behind this is to enable all people to use online stores. In this blog post, we will show you which basic requirements you will have to meet and how you can implement them in a targeted manner.

What is the European Accessibility Act?

The European Accessibility Act (EAA) is the German implementation of the European Accessibility Directive (Directive (EU) 2019/882 on the accessibility requirements for products and services). The law was passed on June 16, 2021 with the aim of improving the accessibility of products and services. The directive sets Europe-wide standards for accessibility in online stores to ensure that people with different abilities can benefit equally from digital offerings and store online without barriers.

In June 2022, an ordinance specified the accessibility requirements for products and services in accordance with the EAA. The legal text comes into force on June 28, 2025 and explicitly affects all online stores of companies with more than ten employees and an annual turnover of over 2 million euros. Only micro-enterprises that only sell services via their store remain exempt from this regulation.

The market surveillance authorities of the federal states are responsible for monitoring and enforcing the law. These authorities play a central role in monitoring and implementing the accessibility requirements to ensure that companies meet the legal standards and thus guarantee inclusive access to their products and services. The EAA thus acts as a key step in the implementation of the European Accessibility Act by obliging German companies to meet the accessibility requirements for online stores in accordance with this European initiative.

Sanctions for non-compliance

Failure to comply with the provisions of the European Accessibility Act (EAA) can have considerable financial consequences for online store operators. Fines of up to €100,000 can be imposed. In addition to these fines, violations of the BFSG regulations can also be considered violations of the Unfair Competition Act (UWG). This opens the door to warnings under competition law, which can include both injunctive relief and claims for damages.

If the accessibility requirements are not met, an inspection by consumer protection agencies can be requested from the market surveillance authority in accordance with Section 28 EAA. These authorities monitor online stores not only on the basis of specific complaints, but also independently.

If store operators do not respond even after repeated deadlines, the authorities may close the online store. Consumers also have the option of initiating arbitration proceedings with an arbitration board in accordance with Section 16 (1) of the European Accessibility Act (Section 34 EAA). In this context, the market surveillance authority can also be involved at the consumer's request.

If the market surveillance authority determines that a website does not meet the legal requirements, it will first issue a request to (re-)establish accessibility. If these requests are repeatedly ignored, the authority can order the cessation of electronic commerce until compliance is achieved.

What does online accessibility mean?

There are many barriers on websites and in online stores. A common example of a barrier is when the colors of the texts and backgrounds are not contrasted strongly enough. This can quickly make it difficult or even impossible for visually impaired people to read these texts. The use of the tab key for blind people and some people with limited mobility to navigate a website is also a good example of barriers in an online store: the store should definitely be programmed to allow these people to navigate through the site using the keyboard.

Other typical barriers in online stores are, for example:

• Missing alternative texts for graphics or images

• Inaccessible PDF formats

• Complicated language or texts that are too long

• Complex menus and navigation concepts

• Navigation elements or fonts that are too small

According to the test report by Aktion Mensch, there is a great need for action here for most online stores. A full 75% of the stores tested were not barrier-free.

Online retailers should therefore act promptly. The obligation to provide accessibility in online stores is getting closer and closer, and non-compliance could result in significant penalties. First and foremost, the website must also be easily usable for people with disabilities, whereby it does not depend on a specific disability.

Online stores must be adequately perceivable, operable, understandable and performant. The exact requirements and developments can be found in the Ordinance to the European Accessibility Act (EAA).

In short, the ordinance stipulates that stores should be as usable as possible for people with disabilities. In addition

• at least one non-manual form of operation must be available that does not require fine motor control and operation, hand muscle strength or the simultaneous operation of more than one control element

• at least one form of operation must also be offered that facilitates use with cognitive impairments

In the context of the discussion about the design of accessible websites, practical examples are crucial to illustrate the implementation of the underlying principles. Accessible website examples serve as a guide for successful implementations. Clear and understandable text, well-structured content, and the integration of alternative text for images are some of the practices that can be highlighted. In the wake of the upcoming accessibility obligations for online stores, such examples underline the relevance and benefits of inclusive design in the digital space.

Accessibility as a competitive advantage

In June 2022, the Federal Statistical Office issued a press release stating that almost 10 percent of the total population in Germany was severely disabled at the end of 2021 - which corresponds to 7.8 million people. In reality, however, this figure is significantly higher, as people with moderate to mild disabilities are not included in these counts.

So if you don't make your online store accessible, you automatically exclude millions of potential customers. Accessibility in the online store can therefore prove to be a real competitive advantage. If you start now to increase online accessibility on your website, you can reach this target group today and retain their loyalty at an early stage.

In addition, an accessible online store also significantly improves the user experience for all store visitors, which can increase the length of stay and conversions. Improved usability can also avoid follow-up costs by minimizing user errors and thus reducing customer service inquiries, for example. Thanks to simplified, smooth checkout processes, abandoned purchases can also be reduced - and fewer bounces also mean an improved Google ranking.

If you make your online store accessible now, you can create a generous transition phase until 2025 during which problems can be identified and rectified.

How do I design an accessible website?

Creating an accessible website should not only be seen as an ethical obligation, but is also a legal requirement, especially in light of the European Accessibility Act (EAA). An inclusive design enables people with different abilities to access digital content without barriers. In this section, we take a look at the key elements you should consider when designing accessible websites.

1. Accessible texts

To ensure that your text is easy to process for all users, high contrast is important. Black text on a white background has proven to be the most pleasant for everyone involved. In general, however, the contrast should not be too low or too high.

By the way: The popular dark mode can be a hindrance for accessible websites! Dark mode can only improve readability if the correct color settings are used. However, this effect is reversed with poor implementation and the font becomes significantly less legible. If you still don't want to do without the trend, you must give your users the option of choosing between dark or light mode - because this is the only way to ensure that the website remains accessible.

The font size and typeface of your website texts is also an important point: people with visual impairments will otherwise find it difficult to read your website texts if the font is too small or squiggly.

You should also pay attention to the comprehensibility of the language for an accessible website. Very few of your website visitors are studied Germanists with a huge vocabulary. It is therefore advisable to write texts in easily understandable language. If you want to check the readability of your texts, you can determine this with the so-called readability index (LIX). This index calculates a score based on the number of longer words and the average sentence length, among other things.

2. Accessible images and ALT texts

The images in your online store can also be made accessible. You can do this with the help of so-called alternative texts - often abbreviated as ALT texts. If you have already dealt with search engine optimization, you have probably already come into contact with alternative texts. They often come into play here when relevant search terms are to be placed in the ALT texts of an image.

However, when it comes to accessible websites, an alternative text should facilitate use by describing the respective image. The ALT tags can be read by software for the visually impaired. This enables blind people to understand what is displayed on a particular website.

Almost every content management system (CMS) and every store system now has the option of adding these tags to images. Often an automatically generated ALT text is already created when images are inserted - but these are more likely to satisfy search engines. They make less of a contribution to accessibility, which is why you should always create your own alt tags.

3. Accessible videos

For people with visual impairments, videos are somewhat easier to process due to the sound in the video. However, the situation is quite different for people with hearing impairments.

You should therefore make sure that subtitles are available for all videos. Even if a lot can already be solved with artificial intelligence, you should check all subtitles and adjust them manually if necessary.

4. Identify links

To further improve the readability of your page, links should be clearly differentiated from conventional continuous text and should not only stand out in color, but also be underlined if possible. In addition, each link should have its own anchor text. If you link to images, you should also label them in such a way that the link is also recognizable to website visitors.

At Latori, we traditionally use underlining for links. We place particularly exciting articles in a green block - here, too, the link stands out with a light green font.

5. Assign Aria roles

Just like the ALT attributes, the Aria roles also increase the usability of your site with reading tools for the visually impaired. You can use Aria roles to define the purpose of individual elements on your website.

For example, you can use the tag role="button" to indicate to the readout tool that an element is a clickable area. If you use a modern theme in a common CMS or store system, you usually don't need to do anything else. Most themes now have a correct assignment of the Aria roles by default.

6. Structure of the online shop

The structure of a website is based on accessible texts. If visitors are greeted by a wall of text, they will quickly jump off again.

It is best to use paragraphs that are no longer than 4 lines and break up the text into smaller units with other elements.

Particularly suitable for this are:

• Tables

• Images

• Videos

• Bullet points

• Buttons

You can also add some whitespace between these elements to promote accessibility. Also take a detailed look at the contact forms on your website and check whether they are easy to use for all users.

7. Usability of the online store

Some users are dependent on keyboard operation. This may be due to motor impairments, for example.

As a rule, navigation is implemented using the keyboard with the tab key. By pressing the key, the cursor jumps from one link to the next. Systems often support this function by default. However, some elements can make keyboard navigation more difficult. You should therefore refrain from using slideshows, iframes or dynamic elements.

8. Obtain feedback

No matter how much you read and learn about accessibility, the best people to judge what your store is missing and where there is a need for optimization are those directly affected.

It is best to offer your customers the opportunity to contact you and provide feedback on your store and accessibility. This will allow you to quickly determine exactly where you need to take action.

Test accessibility online

Ensuring accessible websites requires comprehensive testing - there are various approaches available to you here.

The BITV test, based on the German Barrier-free Information Technology Ordinance, offers a precise check of accessibility according to national standards. For international guidelines, the WCAG test comes into play, developed by BIK on the basis of the Web Content Accessibility Guidelines. These expert tests offer detailed insights into the accessibility of websites.

If you would like to take direct action yourself, there are two test options available.

The BITV/WCAG self-assessment is a testing tool specially designed for developers of accessible websites. It is based on the international Web Content Accessibility Guidelines (WCAG) and the German Barrier-free Information Technology Ordinance (BITV). This self-assessment enables a detailed review of the accessibility of websites according to relevant standards.

The Easy Checks offer an effective solution for a quick and uncomplicated start. They enable an initial assessment of the accessibility of websites by checking ten basic accessibility requirements. The Easy Checks are deliberately designed to be simple and do not require in-depth developer know-how, making them accessible to non-experts.

These two tools help to improve the accessibility of web offerings and provide developers and website operators with valuable tools to efficiently meet accessibility standards.

Automated tests also play a role, which exist alongside manual tests. These automated tests provide an efficient way to check certain aspects of accessibility. However, it is important to understand that they cannot capture all nuances. Therefore, they should be used in combination with manual checks to ensure comprehensive accessibility assurance.

Accessible website examples

1. Scope

The Scope.org.uk website, part of the disability equality organization Scope, is particularly advanced in terms of accessibility, especially when it comes to keyboard navigation. Scope's design relies on easily recognizable images, clear colors and well-designed buttons to facilitate accessibility. A transparent list of accessibility issues is actively addressed. Through these measures, Scope improves the user-friendliness of the website while ensuring ease of use.

2. BBC

The BBC's digital team is strongly committed to making the website easy for everyone to use. They want to make sure that the website is valuable for everyone and that users can rely on it. The BBC website has many small accessibility improvements, such as hidden text for screen readers, easy keyboard navigation and well-designed links. The BBC was one of the first to use responsive web design. This means that the website not only looks good on different screen sizes, but also for people who have made the screen larger.

Both the BBC iPlayer and BBC Sounds are well designed for screen readers, keyboards and alternative input devices. All programs in iPlayer have subtitles, and there is easy navigation for programs with descriptions and sign language.

3. Sensalou

Our customer Sensalou also illustrates how accessibility can be gradually improved in an online store. The store uses a clear, straightforward font without flourishes, the font size is large and the color contrasts are clear, which is exemplary for accessible design. Icons are also displayed extra large and easy to click. Sensalou is therefore definitely taking a good step towards accessibility.

4. Caritas

Caritas Austria is strongly committed to accessibility, especially for its target group. A side menu is already available on the homepage, which allows various settings to be made. These include a function for "easier reading" as well as contrast adjustment options in black and white or blue and yellow. Users can also select different font sizes and use a readspeaker to have the texts read aloud.

The entire website is deliberately designed to be simple and clear, with black text on a white background to optimize readability. Clear and meaningful images help to make the information easy to understand. The deliberately simple and clear design facilitates navigation and promotes quick orientation on the website. All these measures help to create a barrier-free and user-friendly environment for visitors.

Conclusion - accessibility in online stores is becoming indispensable

With the Accessibility Reinforcement Act (BFSG) coming into force on 29.06.2025, online store operators are facing new, demanding challenges. The penalties for non-compliance are considerable and implementation requires a holistic approach.