Caricamento...

Checklist: Accessible web design for your website

The checklist: Accessible web design for your website from Eye‑Able® offers tips and tricks for inclusive, legally compliant, and user-friendly web design. In 2024, only 3% of 40,000 websites examined met accessibility requirements and were therefore fully accessible to all people. With the checklist from Eye‑Able®, you can check your website for accessibility, implement necessary changes, and thus increase your reach.

Accessible web design

An accessible website expands your target audience and improves your search engine ranking. User-friendliness increases, customer loyalty is strengthened, and brand perception is deepened. At the same time, you comply with legal requirements and avoid discriminating against people who want to use your website.

Why is accessibility important in web design? Since June 28, 2025, an accessible website has been required for most organizations under the Accessibility Enhancement Act (BFSG). You can find out whether your company is affected by this requirement in our blog post Accessibility statements explained in an understandable way: content, obligations, examples . Many of the aspects that are enshrined in law relate to the web design as well as the technical requirements of your website.

People who need an accessible website include those with:

  • Visual impairment or blindness

  • Physical disability (motor impairment)

  • Hearing impairment or deafness

  • Learning disabilities and cognitive impairments

  • Temporary impairments (broken hand, etc.)

  • Low level of digital literacy

  • Migration background or language difficulties

Common mistakes in web design

The biggest missteps in terms of accessible web design:

  • Errors in images and media: Alt texts, contrasts, subtitles, transcripts, and audio descriptions are not available; non-text content is not identified; colors are linked to functions.

  • Errors in navigation and operation: Navigation is not possible via keyboard; visible focus is missing; pause or extension options for time-limited content are not available.

  • Errors in text and language: The language is complex, full of technical terms and long sentences; unclear labels for fields to be filled in; unclear wording of error messages or on buttons.

  • Technical errors in the code: There is no semantic markup structure; there is no compatibility with assistive technologies.

The Accessibility Website Checklist: Get Started Now

Eye‑Able® shows you how to check and improve your website's accessibility. We start with the questions: What is accessible web design and which categories are crucial?

Testing Operation & Navigation (Usability)

A logical structure and simple navigation with clear hierarchies are crucial. A responsive design that adapts to the screen size of the end device is also necessary and is a basic requirement for an accessible website. When zooming in on a laptop, the view switches to smartphone mode, and the quality is maintained without any loss of functionality.

Offer pause or extension options for time-limited content. Time limits must be adaptable to individual needs in order to avoid overwhelming users.

It is necessary for devices such as touchscreens, screen readers, or voice controls to be supported by the website structure. All functions of the website should be operable via keyboard. Visible focus indicators are crucial because they show exactly where you are on the website. Without a visible focus, orientation and navigation are impossible. Cookie banners should be keyboard-accessible so that they can be played back by screen readers while remaining visible and clickable. Buttons should be large enough and easy to reach by touch, even on smaller devices.

Avoid time-limited content in order to implement your web design in an accessible manner.

Checking visual and auditory elements (Perceptibility)

Content for people with visual impairments, color blindness, or hearing impairments must be more easily recognizable.

It is useful to use contrast checkers for this purpose. The contrast should be at least 4.5:1 between normal-sized text and the background and buttons, and 3:1 for large text. This will improve perception. Avoid misunderstandings by not conveying information exclusively through certain colors.

Choose a large, easily readable, scalable font size to make it easier to understand the text content. Avoid animated or flashing content.

Important aspects of auditory accessibility include subtitles or transcripts for audio content and videos. Use warnings when purely auditory signals are played. Avoid the automatic start of audio content.

Optimization of text & language (comprehensibility)

Use clear, understandable language without technical terms throughout the website. We recommend using short sentences and simple wording. Formulate calls to action for form labels in a clear and understandable way. Provide help texts that explain how to fill in the fields. Use understandable, clear error messages.

Offer a version in simple or easy language, as a toggle function or alternative version of the website. “Easy language” is aimed at people with cognitive impairments, low reading skills, or learning disabilities. It uses short sentences, very easy-to-understand words, lots of paragraphs, and avoids linguistic devices and technical terms. It also makes use of images or symbols.

So-called “simple language” is aimed at people with low language skills. This includes, for example, people with low literacy, people whose native language is not English, or older people. Simple language is characterized by shorter sentences, familiar-sounding words, some technical terms with explanations, and simple sentence structure. Excessive simplification is avoided in order to challenge readers appropriately.

Tip: In-depth information on the Web Content Accessibility Guidelines (WCAG), the international guidelines for digital accessibility design, which are discussed here in passing, can be found in the blog post The future is accessible – the ABCs of WCAG 2.2.

Code & compatibility (robustness)

In addition to design and language, accessible code creates the basis for a website to be available to everyone. Without it, even the best design is useless, as people cannot access the content on the website. The goal is for the code to be easily interpreted by assistive technologies.

Anyone who uses a screen reader, Braille display, keyboard navigation, or voice control relies on technically clean code – this forms the interface between the website and the assistive technology. The assignment of ARIA roles and attributes is crucial. It is also important to use semantic HTML with correct heading structures. Headings, forms, lists, tables, etc. require the correct use of HTML elements.

Use well-chosen and concise alt text for all relevant images on the website that accurately reflect what is being shown. Purely decorative images should be marked with an empty alt attribute so as not to confuse people who use a screen reader. Alt texts also influence SEO, i.e., the findability of your page in search engines.

The website should also function stably at 200% zoom without losing content and functionality.

Download checklist as PDF

We have prepared a checklist for implementing the requirements of the BFSG and the Web Content Accessibility Guidelines (WCAG) for you to download. This list is not exhaustive and provides a guideline depending on the specific conditions relating to your company.

Checking your website for accessibility

Manual check using the checklist

Automated tools alone do not cover all the points that can constitute barriers on a website. A manual check is essential and covers the following points:

  • General structure and readability

  • Screen reader compatibility

  • Audiovisual content (subtitles, audio descriptions, transcripts)

  • Contrast

  • Alt texts

  • Form fields

  • Keyboard control

  • Focus indicators

The website must be checked regularly, as new content must also be accessible. Any changes to the requirements for accessible web design also make regular checks necessary.

Automated tools and software solutions

There are solutions that can help you with the accessible web design of your site.

A platform solution such as Eye‑Able® is recommended. This gives you professional and fast help with your accessible web design, ensures you remain GDPR-compliant, and allows you to integrate the plugin directly into your code. This enables all users to make adjustments to your website content independently and individually according to their needs and benefit from accessibility.

Perform a free WCAG test with Eye-Able® now and find out how accessible your website really is – fast, GDPR-compliant, and non-binding.

Combination of manual and automatic – the ideal approach

The combination of manual testing and the use of an automated tool is the best solution for organizations. The former reveals any barriers in terms of context, language, and usability, while the automated check also detects technical deficiencies and can suggest alternatives for improvement. This gives you an accessible, inclusive website.

Conclusion: With this accessibility checklist, you can ensure digital quality and user-friendliness

What insights have you gained?

  • Since June 28, 2025, it has been a legal requirement in Germany to have an accessible website if the products or services fall within a certain area. Digital accessibility was already mandatory for public institutions.

  • Clear guidelines for accessible design are provided by the WCAG, which in Germany are laid down in the BGG and BFSG.

  • With an accessible website, you can expand your target group on the basis of legal compliance. You optimize the user experience, increase your SEO visibility, and strengthen your brand image. This forms the basis for higher sales, recommendations, and strong customer loyalty.

  • Tip: Test your website regularly to ensure that changes and new content are also accessible.

Accessible web design expands your target audience, is inclusive, and keeps you legally compliant. Eye‑Able® is happy to support you in successful and sustainable implementation.

FAQ

What does it mean for a website to be accessible?

A website is accessible when all people, regardless of physical or cognitive limitations, can use it. Accessibility ensures inclusion, stronger customer loyalty, higher sales, and legal protection.

What happens if my website is not accessible?

If your website is not accessible, even though it falls within the scope of the BFSG, you may face fines, warnings, and, in the worst case, a block on your website since June 2025. The result is lasting damage to the image of the brand and the company.

Which websites must be accessible?

There are various websites that fall within the scope of the BFSG, including: public authorities, online shops, streaming services, booking platforms, banking portals, vending machine systems, and digital services. The experts at Eye‑Able® will be happy to assist you in determining whether your company is affected by the requirements and what steps are necessary.

How can I test my website for accessibility?

A combination of manual review and an automated solution, such as that offered by the Eye‑Able® platform, yields the best results.

Check your website's accessibility for free with Eye-Able®!

Caricamento...
Caricamento...
Caricamento...
Caricamento...

Hai bisogno di maggiori informazioni?

Scrivici e saremo lieti di aiutarti.

A man and a woman look at a monitor and laugh