Accessible web design

Who is required to have an accessible website? What impact do the legal regulations have on existing websites – and what does accessible web design mean? Here you’ll learn everything you need to know to make your website accessible to all users.

Accessibility in Web Design

What does accessibility mean?

Accessibility in web design means that a website is designed so that the information (text, images, and other content) it offers is accessible to as many people as possible, regardless of the user’s individual abilities or limitations. On an appropriately designed website, the content must be easily accessible, with as few restrictions as possible, even for people with visual, hearing, motor, and cognitive impairments.

The Difference Between Accessibility and Usability

The “usability” of a website determines how user-friendly a website is, or how efficiently users can access the information they are looking for. While this also impacts accessibility, it goes far beyond that. A website is accessible when people with disabilities can use it as fully as possible—without any restrictions—and all content is accessible to them. In this respect, accessibility is a subset of usability, but goes beyond general user-friendliness and also takes into account the very specific needs of people with disabilities.

Accessibility: legal background

A new regulation for the provision of accessible websites is intended to ensure that people with disabilities also have equal access to online services and can easily access content on the web. The Accessibility Strengthening Act (BFSG) was passed on June 15, 2022, and defines accessibility requirements for products and services placed on the market or provided after June 28, 2025. This includes, among other things, all online commerce, hardware, software, but also passenger transport and banking services.

The Accessibility Improvement Act (BFSG)

The Accessibility Improvement Act (BFSG) applies to manufacturers, distributors, and importers of certain products and service providers. Micro-enterprises that employ fewer than ten people and either generate an annual turnover of no more than €2 million or whose annual balance sheet total does not exceed €2 million are partially exempt from the BFSG.

The accessibility requirements for products and services on the web are regulated by the Federal Office for Accessibility (BFSG) Ordinance, which you can read here. When meeting these requirements, the state of the art must be observed. Specific requirements arise from various norms and standards published by the Federal Office for Accessibility.

WCAG (Web Content Accessibility Guidelines)

Further guidelines for web accessibility and accessible web design are provided by the Web Content Accessibility Guidelines 2.1 (WCAG). Created by the World Wide Web Consortium (W3C), they offer multi-level guidelines and guidance to help make web design and development as accessible and accessible as possible for people with disabilities. The WCAG guidelines were first adopted in May 1999 and have been continuously developed since then, also to incorporate technological advances on the web. The WCAG 2.1 guidelines for accessible web design correspond to the ISO 40500 standard and have been adapted for the EN 301 549 (European standard).

The main types of disabilities addressed in WCAG are:

• Visual impairment and blindness
• Hearing impairment and deafness
• Motor impairments
• Cognitive impairments and learning disabilities
• Photosensitivity
• Multiple impairments

The topic of the Web Content Accessibility Guidelines for digital accessibility is the creation of a structure for digital offerings – such as web pages – that enables access and use for all people.

Categorization of accessible websites

Zur Kategorisierung der Barrierefreiheit im Web arbeitet das WCAG mit drei Konformitätsstufen:

• Level A: Basic accessibility features that are absolutely necessary
• Level AA: Additional accessibility features that further enhance usability
• Level AAA: Highest level of accessibility that goes beyond the basic and additional requirements

You can find out more about web accessibility and the WCAG at this address.

Americans with Disabilities Act (ADA)

The ADA, which applies in the United States, requires that websites of public institutions and large private companies be accessible to all people, including people with disabilities, without restrictions. This means that websites should comply with the WCAG guidelines to avoid legal consequences.

What does web accessibility mean and what constitutes accessible web design?

Accessible web design, or the provision of an accessible website, is becoming increasingly important in an increasingly digital world. It enables people with disabilities—such as visual impairments—to participate equally in digital life. Companies themselves also benefit from implementing accessible web design and making their content accessible to people with disabilities. This allows them to attract potential customers they would otherwise not be able to reach. Furthermore, an accessible website not only demonstrates social responsibility; maximum accessibility could also become an important ranking factor for search engines in the future.

Apart from these good reasons to offer accessible web design on your own initiative, the implementation of accessibility on websites will be a legal requirement from June 2025.

Who is obligated to provide an accessible website?

Whether an accessible website is mandatory for you depends on several factors. These include the legal framework in a particular country, your target audience, and the type of organization operating the website. An accessible website will be mandatory from 2025 for:

• Public Institutions
  In Germany and many other countries, websites of public institutions and authorities must be accessible. This applies in particular to websites that provide content and services to the general public. For example, in the EU, according to EU Directive 2016/2102, public websites and mobile applications of public authorities must be designed to be accessible. In Germany, public bodies are required by the Barrier-Free Information Technology Ordinance (BITV 2.0) to design websites and mobile applications in an accessible manner.
• Companies that provide services to the general public
  They may also be required to consider accessibility when creating their websites or to upgrade their existing websites to be accessible. This is especially relevant if they receive public funding or work closely with public institutions. Some countries have specific laws that also affect the private sector. In Germany, starting in June 2025, companies with more than 10 employees or an annual turnover of more than €2 million will be required to have an accessible website.
• Laws to Protect People with Disabilities
  Many countries have laws to protect the rights of people with disabilities, which also apply to websites. For example, the German Equal Opportunities Act for People with Disabilities (BGG) stipulates that people with disabilities must have equal access to information technology and web content.
• Obligations in Specific Industries
  In some industries, such as education, healthcare, or public services, there are specific accessibility regulations that also affect websites and digital offerings.
• International Accessibility Standards and Recommendations for Accessibility
  Even though some countries do not yet have legal obligations for accessible web design, international standards exist that have been defined by organizations such as the W3C (World Wide Web Consortium) and the Web Accessibility Initiative (WAI). These standards, known as the Web Content Accessibility Guidelines (WCAG), provide a basis for designing accessible websites. Many countries follow these international guidelines, even when there is no explicit legal requirement.

Ultimately, it is good practice to understand accessibility as a fundamental quality of web development that takes into account both legal requirements and user equality.

What are the advantages of an accessible website?

An accessible website has numerous benefits that go beyond meeting legal requirements. Accessible web design allows you to reach a wider audience, make your content accessible, and strengthen your brand perception and competitiveness through relevant content. Other benefits include:

• Expanded Audience Reach
  An accessible website is accessible to a wider user base, including people with disabilities (visual impairments, hearing impairments, motor impairments, cognitive impairments). These groups make up a significant portion of the population. In Germany, for example, this affects around 12 million people with disabilities, and in the US, it is approximately 1 in 4 adults.
• Inclusion as a Brand Value
  Brands that take accessibility seriously demonstrate their commitment to inclusion and equality. This can positively influence brand perception and build trust among a broad target audience.
• Improved SEO (Search Engine Optimization)
  Better indexing: Accessible web design is often also more search engine friendly. Search engines like Google prefer websites that are clearly structured and offer well-documented content. Features such as alt text for images, structured headings (H1, H2, etc.), and clean HTML coding not only improve accessibility. Good accessibility also contributes to better SEO rankings.
• Competitive Advantage and Brand Image
  Companies that design their websites to be accessible can position themselves as socially responsible. Customers and partners value brands that promote equality and accessibility. This attitude can significantly strengthen brand image. Customer satisfaction and loyalty also benefit from accessible web design. Companies that accommodate the needs of people with disabilities demonstrate that they respect the versatility and diversity of their customers. This can lead to higher customer loyalty and positive word of mouth.
• Avoiding Legal Issues
  Many countries – including Germany – have legal requirements regarding accessibility. Accessible web design helps prevent legal issues and avoid penalties or lawsuits. If you invest in accessibility early on, you don’t have to worry about having to make expensive changes later to comply with legal requirements.
• Better usability for all
  Accessible web design is often better structured and offers more user-friendly navigation. Clearly defined areas, easily accessible content (images, text, etc.), and accessibility-optimized layouts not only make the site accessible for people with disabilities, but also more pleasant to use for all visitors. Accessibility also often goes hand in hand with responsive design, which ensures that a website functions well on all devices. This increases usability and ensures that users can clearly understand content and read text more easily, even on smartphones and tablets, resulting in a positive overall experience.
• Increased Conversions and Sales
  People with disabilities represent a significant consumer group. When a website is accessible for this group, sales opportunities can be better exploited. This is especially true in the e-commerce sector, where an accessible website facilitates access to products and services for these potential customers. A user-friendly, accessible web design with a clear structure and easy navigation leads to a higher conversion rate, whether for purchasing products, filling out forms, or signing up for services.
• Future-proof
  Online accessibility is a growing trend, as more and more countries are imposing legal requirements for websites. Early implementation ensures brands are well positioned for the future. The requirements for digital accessibility on the web are constantly evolving. By continuously aligning with best practices, an accessible website will remain competitive in the future.
• Better Collaboration and Partnerships
  Many organizations that work with or support people with disabilities prefer partners that ensure accessibility. An accessible website can increase the chances of collaborating with these groups or forming long-term partnerships. In certain areas, such as public tenders or government contracts, accessibility can be a decisive award criterion.
• Better maintainability and adaptability
  Websites with high accessibility requirements often require a clear and clean technology architecture that facilitates website maintainability and adaptability. This means less effort for providers when making changes or updates. Furthermore, accessible web design scales more easily with new technologies and adaptations without creating barriers for users.

An accessible website is not only an ethical obligation but also a wise business decision. It offers numerous benefits that not only minimize legal risks but also increase online reach, strengthen customer loyalty, increase sales, and improve brand image. Accessibility makes a website future-proof and contributes to a brand’s perception of inclusiveness and responsibility.

What makes a website accessible?

An accessible website is designed to be accessible to all users, regardless of their individual abilities or limitations. This includes ensuring that people with disabilities—such as visual impairments, hearing impairments, motor impairments, or cognitive impairments—can easily use the website’s content and functions, for example, using only a keyboard.

Principles of Accessibility

Perceivability

Perceivability means that website content must be accessible to all users. The most important prerequisite for this is that users can see and understand the information and controls on a website.

• For text and images, you should use clear and legible fonts. Ensure that all essential content is accessible even without visual aids. For images and graphics, you should provide alternative text that describes the content or function of the image.
• When designing a website, attention should be paid to strong color contrasts and visual distinction. For example, the contrast between text and background must be sufficiently high to ensure good readability.

Ease of Use

Ease of use aims to ensure that all users can navigate the website easily and efficiently.

• The ability to operate a website using only the keyboard ensures that all users can navigate the site, fill out forms, and use all functions without using a mouse. Visible focus indicators show which element is currently active.
• Interactive elements such as buttons, links, and forms should be easy to access and use. Avoid self-paced content, as this could create time pressure and overwhelm users.

Understandability

Understandability means that the information and operation of your website are clear and understandable for all users.

• An accessible website should use simple and direct language that is easy to understand. Avoid technical jargon and complex sentence structures, and instead use short paragraphs and bullet points to improve readability.
• Consistent and predictable navigation ensures that users can easily understand how to get from one page to another and where to find important information.

Robustness

Robustness means that a website is compatible with different browsers, devices, and assistive technologies.

• For a website to be accessible, it should be tested in different browsers and on different devices. This ensures that it works everywhere.
• WAI-ARIA refers to a set of attributes specifically designed to improve the accessibility of dynamic content and user interfaces. Use WAI-ARIA attributes to make interactive elements and their states accessible to assistive technologies such as screen readers.

Some essential elements of an accessible website are:

• Alternative text (alt text) for images: All images, graphics, or other visual content on a website must have alternative text (alt text) that describes the content or function of the image. This is especially important for people with visual impairments who use a screen reader to have the website content read aloud.
• Colors and contrast: The contrast between text and background must be sufficiently high so that even people with visual impairments can read the text on a website without barriers. Furthermore, the use of colors should not be the only way to convey content in a structured manner. For example, red and green signals should not be the only way to distinguish status indicators.
• Keyboard navigation: All interactive elements of a website, such as buttons, links, or forms, should be accessible without the use of a mouse, i.e., using the keyboard alone, to ensure maximum accessibility. People with motor disabilities often use a keyboard or other assistive devices for navigation.
• Subtitles and transcripts for multimedia content: Videos and audio content on a website should include subtitles or transcripts so that deaf or hard-of-hearing people can understand the content without barriers. Transcripts are important for audio files so that the content can be understood even without hearing it.
• Simple and understandable language: The website should use clear, simple, and understandable text to make it easier for people with cognitive disabilities to understand.
• Avoid time pressure: Interactive elements with a time limit (e.g., forms) should be designed to give users more time to complete them. This is especially important for people with motor or cognitive disabilities.
• Structured HTML and ARIA tags: An accessible website should be semantically structured using HTML tags. ARIA (Accessible Rich Internet Applications) tags can provide additional information that is particularly important for screen readers, such as dynamic text or complex content.
• Error messages and instructions: When users fill out forms on the web, clear error messages should be displayed that explain what is wrong and how to fix the error. Instructions on the correct use of forms should also be provided.
• Adjustable font sizes and layouts: The ability to adjust the font size or change the layout helps people with visual impairments or reading difficulties understand the text on an accessible website.
• Responsive design: An accessible website should work equally well on different devices (PC, tablet, smartphone) so that it is accessible to everyone, regardless of the device used.
• Avoid movements and flashing effects: Rapid movements or flashing elements on the website can disturb users with epilepsy or sensory hypersensitivity. These should either be avoided or optionally disabled.

In terms of web design, accessibility considers not only technical aspects but also the psychological and social needs of users with different abilities. Accessibility is about providing an inclusive and equitable user experience so that everyone can access text, images, and other content on the web.

Tools for accessible web design

There are a number of tools that can be used to check whether a website is accessible – and to help improve the accessibility of a website.

WAVE (Web Accessibility Evaluation Tool)
WAVE is a popular tool developed by WebAIM. It helps you evaluate your website’s accessibility and identify potential issues. WAVE provides visual feedback on the identified barriers and offers recommendations for addressing them.

Axe Accessibility Checker
Axe is a powerful, free tool that integrates with your browser. It provides detailed reports on accessibility issues and explains how to fix them. Axe is especially useful for developers who want to quickly and efficiently identify and remove barriers.

Lighthouse by Google
Lighthouse is an open-source tool from Google used to evaluate the performance of websites. It includes a comprehensive accessibility check and provides concrete suggestions for improvement. Lighthouse can be used directly in the Chrome Developer Tools or as a standalone application.

Accessibility Insights for Web
Accessibility Insights for Web is a free plugin from Microsoft. It offers automated tests and step-by-step guidance for manual accessibility testing. The tool helps you comply with WCAG guidelines and improve the accessibility of your website.

Chrome Accessibility Developer Tools
The Chrome Accessibility Developer Tools are an extension for the Chrome browser. They offer a variety of features for analyzing and improving accessibility, including the ability to inspect the accessibility tree and check color contrast.

Get a free, non-binding consultation.

Would you like to make your own website accessible? Or provide your users with a new website that’s BFSG-compliant and accessible from the start? Get a free, no-obligation consultation now!

Get advice now …