Accessible online store: Requirements and possibilities

27.08.2024
by Meike Müller
E-Commerce
Banner

An accessible online store enables everyone to shop online, regardless of their limitations. It meets technical and legal requirements to ensure accessibility for the visually impaired, hearing impaired and people with motor or cognitive impairments. In this article, you will find out what measures are required and what advantages an accessible online store offers.

 

The most important things at a glance

  • Accessible online stores ensure that websites, mobile applications and electronic documents are designed in such a way that they can be used without restriction by all users, regardless of their physical or cognitive abilities.
  • Legal requirements such as the European Accessibility Act (EAA) and the Barrierefreiheitsstärkungsgesetz (BFSG) oblige online retailers to make their websites accessible by mid-2025; violations can result in significant penalties.
  • Technical measures such as alternative texts for images, subtitles for videos, high contrast ratios and simple keyboard navigation are crucial for the implementation of an accessible online store and improve user-friendliness for all user groups.

Accessible web design and the internet - an introduction

Accessible web design helps people with visual or cognitive impairments to access online content. Imagine not being able to read a website because the text is too small or the colors offer too little contrast. For many people, this is an everyday challenge. Web accessibility means that websites, mobile applications and electronic documents are designed in such a way that they can be used without assistance. This ensures that all people, regardless of their physical or mental abilities, have equal access to information and services and enables an accessible internet. The World Wide Web Consortium sets standards for the accessibility of websites and thus contributes to improving accessibility on the Internet.

An accessible online store is not only an ethical necessity, but also an economic opportunity. Around 61% of people with disabilities shop online very frequently or frequently. This shows the immense potential that lies in creating accessible websites. Accessible websites enable all visitors to read, understand and interact with the content regardless of personal or technical barriers. They promote accessibility and inclusion in the digital space.

What is an accessible online store?

An accessible online store is a website that can be used without restriction by all users, regardless of their limitations or technical capabilities. All information and functions of a website must be accessible to all visitors. It does not matter what physical, mental or technical situation they have. Web offerings that fulfill these principles are referred to as barrier-free. This includes measures to provide important information and offers on the World Wide Web for people with physical and/or mental disabilities.

The basic principles of an accessible online store include the structured preparation of texts, visual presentation and comprehensibility. Accessible web design helps people with visual or cognitive impairments to access online content. Only 4% of all disabilities are congenital; many are caused by illness or accidents. It is therefore all the more important that digital accessibility includes websites, mobile applications and electronic documents that can be used without assistance.

Legal requirements for accessible online shops

The legal requirements for accessible online stores are a key aspect that online retailers must take into account. EU-wide legislation on digital accessibility was adopted in 2016 and came into force in 2021. These regulations, such as EU Directive 2016/2102 and the European Accessibility Act (EAA), set Europe-wide requirements for online accessibility that must be implemented in national laws.

In addition to the European framework, there are national laws such as the Barrierefreiheitsstärkungsgesetz (BFSG) in Germany, which will also oblige private economic actors to make their online presences accessible from mid-2025. These laws aim to ensure that products and services are accessible to all people, regardless of their abilities. Compliance with accessibility standards can minimize the risk of legal problems and lawsuits.

European Accessibility Act

The European Accessibility Act (EAA) sets uniform accessibility requirements for products and services across Europe. These requirements must be transposed into national laws by the member states. The EAA formulates requirements for the accessibility of goods and services and obliges online retailers to make their websites accessible by mid-2025.

The EAA focuses on the accessible design of online presences so that they can be used by people with disabilities without any problems. The harmonized standard EN 301 549 draws heavily on the Web Content Accessibility Guidelines (WCAG) 2.1, which defines international requirements for the creation of web content. This standard contains requirements that go beyond WCAG 2.1 and thus ensure comprehensive accessibility.

Accessibility Reinforcement Act (BFSG)

The Barrierefreiheitsstärkungsgesetz (BFSG) regulates the necessary accessibility for products and services of companies, especially in e-commerce. It affects various products such as routers, e-book readers, televisions with internet access, ATMs, smartphones, notebooks, tablets and computers as well as services such as e-books, telephone and messenger services, banking services and passenger transportation services.

The aim of the BFSG is to design products and services in such a way that they can also be used by people with disabilities without difficulty. From mid-2025, private economic players in Germany must also design their online presence to be accessible in accordance with the requirements of the BFSG. Violations of the accessibility requirements can constitute both warnable competition violations and administrative offenses, which can be punished with a fine of up to 100,000 euros.

Technical measures for implementing an accessible online shop

Technical measures are crucial for creating an accessible online store. One of the key principles is the strict separation of content, structure and design. This enables a responsive presentation that ensures that content is accessible on different devices and supporting technologies.

The technical measures also include

  • Alternative texts for images
  • Subtitles for videos
  • High contrasts in an online store to make websites easy to read even in bright ambient light
  • Simple navigation using the keyboard, as all functions can also be carried out using the keyboard
  • Alternative text modules to make acoustic content accessible for hearing-impaired audiences.

Perceptibility

Alternative texts for images and subtitles for videos are essential to make the content understandable for blind users. Screen reader users need alternative texts (alt texts) for images in order to understand the content. The use of alt attributes in HTML tags is important here. Alternative texts should be as short as possible and no longer than 80 characters.

People with visual impairments use Braille lines to display website texts in braille. Visual barriers can arise due to a lack of optimization for screen readers, which means that visually impaired people are unable to grasp content. Success criteria for accessible web content in terms of font and layout include sans serif font and sufficient contrast ratios.

Usability

Websites should be fully navigable by keyboard to enable users with motor impairments to access them. Device independence and the ability to reach, operate and exit all links and control elements using the keyboard are important criteria for accessibility. People with limited motor skills generally use keyboards that are adapted to their needs. This individual adaptation enables them to work more efficiently. Touchpads, mini keyboards or joysticks.

Screen readers enable visually impaired users to read out website content and navigate through pages. Unstructured content and insufficient contrast are common barriers on websites that make them difficult to use. Buttons and drop-down menus that are too large or too small can present cognitive barriers.

Comprehensibility

Clear and understandable structures and content improve the overall user experience and contribute to accessibility. Accessible content can improve the readability and accessibility of websites, leading to longer visit times and better SEO results. Easily accessible and clearly structured information increases the time spent on a website and customer satisfaction.

When making structural changes, aspects such as simple language and strong color contrasts are essential for accessibility. Implementing clear and understandable structures and content improves the overall user experience and contributes to accessibility.

Specific barriers and their solutions

Possible barriers in the design of a website can be

  • technical limitations
  • visual restrictions
  • auditory limitations
  • cognitive limitations
  • motor impairments

These barriers affect the user experience and can make access to information and services considerably more difficult. In addition to visual and motor impairments, hearing, speech or cognitive difficulties can also present barriers.

Text on websites can be difficult to read if design decisions such as dark text on a dark background are made. Audio files without text alternatives can exclude people with hearing impairments. Assistive technologies are tools for people with disabilities to use web content.

Visual barriers

Visual barriers refer to the reception and processing of visual stimuli that pass through the eye to the brain and can be impaired by internal or external injuries. People with red-green deficiency have difficulty understanding information when it is communicated solely through colors. It is therefore important that information is not only communicated through colors and that a high contrast between text and background is used to improve readability.

Larger fonts and images and avoiding red can make reading easier for visually impaired users. Adapting websites to screen reading software and clearly labeling product images makes them easier to use for visually impaired people. This ensures that all users, regardless of their visual abilities, have access to the content.

Motor barriers

People with physiological deficits or chronic illnesses encounter motor-related barriers when using the internet. Small areas for clicking can lead to jerky or sluggish mouse movements for users with motor impairments. To avoid this, websites should have customizable buttons that are large enough to be easily clicked.

Large interactive elements such as buttons make operation easier for people with motor impairments. People with mobility impairments have problems controlling the mouse, especially when small buttons are placed on a website. It is therefore important that navigation and interaction on the website is intuitive and simple for all user groups.

Auditory barriers

Subtitles for videos are essential so that hearing-impaired users can understand the content. Subtitles or additional accompanying texts for videos help people with hearing impairments. Text alternatives for people with impaired hearing should be offered when acoustic information such as interviews or spoken audio files are used on websites.

Audio descriptions for videos can be automatically generated from YouTube. Transcriptions for audio content are necessary to ensure accessibility for hearing-impaired users. These measures ensure that all users, regardless of their auditory abilities, have access to the content.

Cognitive barriers

Simple and short sentences can lower cognitive barriers and help to avoid misunderstandings. A logical and consistent structure of the content, such as a table of contents, facilitates orientation and comprehensibility for users with cognitive impairments. Simple and direct language on the website helps users with cognitive impairments to understand content better.

Simpler and more comprehensible formulations of product texts and short paragraphs improve accessibility for people with cognitive impairments. These measures help to ensure that all users, regardless of their cognitive abilities, can use the website effectively.

Advantages of an accessible online shop

An accessible online store provides access to a wider audience, including people with various disabilities. Accessibility encourages use by all visitors through logical navigation and ease of use. This can increase the conversion rate as more users can shop without barriers.

An accessible online store contributes to an inclusive society. It also improves the image of the online retailer. Websites that are accessible to all are considered more relevant by search engines and can therefore receive better rankings.

Increasing the reach

An accessible online store can appeal to new customer groups such as older people or non-native speakers. Accessible websites not only appeal to people with disabilities, but also to older adults and people with temporary disabilities. By implementing accessibility in e-commerce, online retailers can reach more people and thus expand their customer base.

Accessibility can increase the reach of an online store by ensuring that content is accessible on different devices and assistive technologies. This can lead to more conversions and sales by reaching a wider audience.

Improved usability

An accessible website stands for high usability. Accessibility leads to easier handling of the website, making it easier to use for all customers. By taking accessibility into account, navigation and interaction on the website becomes more intuitive and easier for all user groups.

Accessibility measures also benefit the following people:

  • Children
  • parents
  • senior citizens
  • People with temporary disabilities

Better SEO ranking

Accessible websites improve SEO rankings because search engines consider accessible content to be more relevant. Search engine algorithms favor accessible websites, which can lead to a better ranking in search results.

Google ranks websites higher that achieve longer dwell times and higher click rates through ease of use. User signals such as dwell time and click-through rate, which are improved by accessible websites, are crucial for SEO rankings.

Step-by-step guide to creating an accessible online shop

It is recommended to obtain detailed information on the topic of accessibility. The online presence should be analyzed to identify existing problem areas. Problem areas should be segmented and responsibilities assigned. An update of the Shopware version and the gradual adaptation of the online presence to the new standards are crucial for achieving accessibility.

Shopware plans to achieve full compliance with the accessibility guidelines by the end of the year and help retailers make the necessary adjustments to their webshops. These measures will ensure that the online presence complies with accessibility requirements and is therefore accessible to all users.

Analysis of the current website

A BITV test can be used to check the current accessibility status of a website. Free tools such as Google Lighthouse or Wave can provide initial insights into the accessibility of a website. After the test, Lighthouse provides a detailed report containing specific recommendations for improving accessibility.

The review of current accessibility should reveal existing barriers so that targeted measures can be taken. This analysis is the first step in creating an accessible online store and forms the basis for further measures.

Planning and prioritization

A detailed implementation plan should clearly define resources and responsibilities in order to carry out the necessary adjustments effectively. Planning and prioritizing the measures is crucial to ensure that all aspects of accessibility are taken into account and that the implementation runs smoothly.

Such a plan helps to structure the necessary steps and ensure that everyone involved is aware of their tasks and responsibilities. This ensures that accessibility is implemented efficiently and successfully.

Implementation and testing

Google Lighthouse is a powerful, automated accessibility testing tool. To test the accessibility of a website with Lighthouse, you can follow the steps below:

  1. Open the target page in Google Chrome.
  2. Access the developer tools by right-clicking on the page and selecting "Explore".
  3. Go to the Lighthouse tab of the developer tools.
  4. Then select the 'Accessibility' option to start the test.

A Lighthouse Accessibility Score above 80 indicates that the website already meets some accessibility requirements. A score below 80 indicates an urgent need for action in the area of accessibility. Regular accessibility testing with user tests and assistive technologies is essential for long-term accessibility.

Summary

Accessibility in e-commerce is not only a legal obligation, but also an ethical and economic necessity. It enables all people, regardless of their physical or mental abilities, to participate in digital life on an equal footing. An accessible online store contributes to an inclusive society and can increase sales by appealing to a broader target group.

Implementing accessibility requires technical expertise and careful planning. From analyzing the current website, to planning and prioritizing, to implementation and testing, each step is crucial to ensure the website meets accessibility requirements. If you need help with this, you can always call on our experienced team. Simply get in touch via our contact form.

Frequently asked questions

  • What does the European Accessibility Act (EAA) say about website accessibility?

    The European Accessibility Act requires online retailers to make their websites accessible by mid-2025. This is intended to improve accessibility for all users.

  • Which products and services are affected by the Accessibility Act?

    The Accessibility Act affects products and services such as computers, operating systems, smartphones, televisions, banking services, ATMs, e-books and e-commerce. There is a need to make these products and services accessible.

  • Do the accessibility requirements also apply to mere presentation websites without a store function?

    No, accessibility requirements do not apply to pure presentation websites without a store function.

What is your project? If you want to tell us about it, we'll call you back!

 
Meike
Meike
from 27.08.2024

Hello, my name is Meike. I take care of the EXWE back office and am responsible for our social media channels. All of our articles are meant to make your life easier and help you make decisions. Nevertheless, it can happen that something remains unclear, so: If you have questions about this article you can easily reach me at +49 231 93149827.

You always want to stay at the cutting edge of technology Don't miss any more news and blog posts.
We also have the following interesting posts from our tech blog for you on this topic
Accessibility AI tools: The best tools at a glance

Accessibility AI tools: The best tools at a glance

Effective Shopify marketing: strategies for more sales in your online store

Learn effective Shopify marketing strategies for more sales in your online store in our article. Discover how to increase your reach, boost customer loyalty and optimize conversions to unlock the full potential of your e-commerce business.

Efficient e-commerce solutions: Understanding and using the Shopify interface

More success in e-commerce with the Shopify interface - Find out everything you need to know about the integration here