Barrierefreie Websites: Checkliste zur Barrierefreiheit und digitalen Inklusion

An wen richtet sich das Barrierefreiheitsstärkungsgesetz?

Das BFSG richtet sich an eine breite Palette von Akteur:innen in der Privatwirtschaft, deren Produkte oder Dienstleistungen sich an Verbraucher:innen richten. Dazu gehören:

• Unternehmen der Privatwirtschaft: Alle Unternehmen, die bestimmte Produkte oder Dienstleistungen für Verbraucher:innen anbieten, müssen die Anforderungen des BFSG erfüllen.
• Hersteller, Händler und Importeure: Unternehmen, die bestimmte Produkte herstellen, verkaufen oder importieren, sind verpflichtet, sicherzustellen, dass diese Produkte barrierefrei sind.
• Dienstleistungserbringer: Anbieter:innen von bestimmten Dienstleistungen, insbesondere im digitalen Bereich, müssen ihre Angebote barrierefrei gestalten.

Betroffene Produkte

Das BFSG betrifft eine Vielzahl von Produkten, die für den täglichen Gebrauch wichtig sind:

• Computer, Notebooks, Tablets und Smartphones: Einschließlich der Betriebssysteme dieser Geräte.
• Selbstbedienungsterminals: Dazu gehören Geldautomaten, Ticketautomaten und Check-in-Automaten, einschließlich der zugehörigen Software (außer an Bord von Verkehrsmitteln).
• Fernseher mit Internetzugang: Smart TVs müssen den Anforderungen entsprechen.
• Streaming-Boxen mit Video-on-Demand-Funktion: Geräte wie Fire-TV-Sticks oder Apple TVs.
• E-Book-Lesegeräte
• Router

Betroffene Dienstleistungen

Auch der Großteil elektronischer Dienstleistungen muss gemäß dem BFSG barrierefrei gestaltet werden:

• Dienstleistungen im elektronischen Geschäftsverkehr: Online-Shops und Websites, die Buchungs- oder Kauffunktionen anbieten.
• Mobile Dienstleistungen im Personenverkehr: Apps und mobile Dienste im überregionalen Personenverkehr, wie der DB Navigator.
• Bankdienstleistungen: Online-Banking und Websites von Banken müssen barrierefrei sein.
• Interaktive Auskunftssysteme und elektronische Tickets
• Telekommunikationsdienste: Dazu gehören Videokonferenz- und Messenger-Dienste.
• E-Books

Ausnahmen vom BFSG

Es gibt jedoch bestimmte Ausnahmen vom BFSG, die zu beachten sind:

• Kleinstunternehmen: Unternehmen mit weniger als zehn Beschäftigten oder einem Jahresumsatz von höchstens 2 Millionen Euro, die ausschließlich o. g.  Dienstleistungen anbieten, sind vom Gesetz ausgenommen. Allerdings fallen Kleinstunternehmen, die die o. g. Produkte herstellen oder vertreiben, unter das BFSG.
• Reine Informationswebsites: Websites ohne Buchungs- oder Kauffunktionen sind ausgenommen, auch wenn sie sich an Verbraucher:innen richten.
• Reine B2B-Angebote: B2B-Online-Shops und -Dienste sind nicht betroffen.
• Regionale ÖPNV-Unternehmen: Lokale öffentliche Verkehrsbetriebe sind ausgenommen.
• Inhalte von Dritten: Eingebettete Inhalte wie Werbebanner, Content, Widgets oder iframes sind nicht betroffen. Allerdings sollte man als Websitebetreiber bei der Integration von Drittanbieterdiensten wie z. B. Kalendertools auf eine möglichst barrierefreie Lösung zurückgreifen.
• Ältere Medieninhalte: Audios und Videos, die vor dem 28. Juni 2025 veröffentlicht wurden, sowie ältere PDF-Dokumente sind ausgenommen.
• Online-Karten und Kartendienste: Solange die für die Navigation wesentlichen Informationen barrierefrei zugänglich sind, sind diese Dienste ausgenommen.
• Archivierte Inhalte: Inhalte von Websites und mobilen Anwendungen, die nach dem Stichtag weder aktualisiert noch überarbeitet wurden, gelten als Archive und sind ebenfalls ausgenommen.

Was ist jetzt wichtig für Sie?

Machen Sie sich mit den Richtlinien für Barrierefreiheit vertraut und prüfen Sie, wie zugänglich Ihre Website wirklich ist. Ab dem 28. Juni 2025 müssen alle betroffenen Produkte und Dienstleistungen barrierefrei sein. Es gibt derzeit noch keine detaillierten Normen oder definierten Standards für das BFSG. Diese werden möglicherweise erst nach dem Inkrafttreten des Gesetzes als Novelle der EN 301 549 veröffentlicht. Bis dahin sollten Sie sich an der aktuellen EN 301 549 (Version 3.2.1), Abschnitt 9, oder den WCAG 2.1 orientieren. Wir empfehlen unseren Kunden aus Gründen der Zukunftssicherheit, bereits heute die WCAG in der Version 2.2 als Grundlage zu nutzen.

Nehmen Sie sich die Zeit, Ihre Website zu überprüfen und anzupassen. Dies ist nicht nur eine Frage der gesetzlichen Einhaltung, sondern auch eine Chance, Ihr Geschäft zu verbessern und allen Menschen einen gleichberechtigten Zugang zu Ihren Diensten und Produkten zu ermöglichen. Sorgen Sie dafür, dass Ihre Website bereit ist für die Zukunft – eine Zukunft, die inklusiv und zugänglich für alle ist. Indem Sie frühzeitig handeln und die notwendigen Anpassungen vornehmen, können Sie mögliche Strafen vermeiden und die Zufriedenheit Ihrer Kunden steigern.

Vergleich der Anforderungen an Privatwirtschaft & öffentliche Institutionen

Für öffentliche Institutionen gelten strengere Anforderungen an die Barrierefreiheit als für die Privatwirtschaft. Während öffentliche Stellen die Vorgaben der Barrierefreie-Informationstechnik-Verordnung (BITV 2.0) erfüllen müssen, sind die Anforderungen für Unternehmen aus der Privatwirtschaft weniger umfassend.

• Konformitätserklärung: Für private Unternehmen reicht eine interne Konformitätserklärung aus, während öffentliche Institutionen eine öffentliche Erklärung zur Barrierefreiheit abgeben müssen.
• Feedback-Mechanismus: Unternehmen der Privatwirtschaft benötigen kein Meldesystem für Barrieren, das es Nutzer:innen ermöglicht, Probleme direkt zu melden. Für die Öffentlichen ist ein Feedback-System verpflichtend. Wir empfehlen jedoch auch Unternehmen, einen solchen Feedback-Mechanismus zu integrieren, um die Zugänglichkeit der Website immer weiter zu verbessern.
• Erläuterungen in Leichter Sprache und Gebärdensprache: Im Gegensatz zu öffentlichen Stellen müssen private Unternehmen keine Informationen in leichter Sprache oder Gebärdensprache bereitstellen.
• Barrierefreiheitsniveau: Private Websites müssen das höhere Maß an Barrierefreiheit (WCAG Level AAA) nicht erreichen, welches aber für bestimmte Webseiten öffentlicher Institutionen erforderlich ist.
• Prüfverfahren: Während öffentliche Institutionen von offiziellen BITV-Prüfstellen geprüft werden, können private Unternehmen eine Selbstbewertung durchführen.

Diese Unterschiede bedeuten, dass private Unternehmen bei der Umsetzung von Barrierefreiheit weniger strengen Regelungen unterliegen als öffentliche Institutionen. Dennoch ist es wichtig, dass auch sie sich an die grundlegenden Standards halten, um die Zugänglichkeit ihrer digitalen Angebote zu gewährleisten und die gesetzlichen Anforderungen zu erfüllen.

Wie wird überwacht und welche Konsequenzen drohen?

• Überwachungsstellen: Die Überwachung wird durch Prüfstellen der Bundesländer sichergestellt.
• Prüfungen: Die Überwachung erfolgt stichprobenartig und bei Verdacht auf Verstöße.
• Meldungen und Klagen: Verbraucher:innen können Verstöße melden, auch Verbandsklagen sind möglich.
• Ausnahmen: Unternehmen können unter bestimmten Bedingungen, wie z.B. „unverhältnismäßiger Belastung“, Ausnahmen geltend machen. Für einige Produkte gelten zudem Übergangsfristen.
• Mögliche Konsequenzen bei Verstößen:
  • Aufforderung zur Nachbesserung innerhalb einer angemessenen Frist
  • Strafzahlungen zwischen 10.000 und 100.000 EUR
  • Verbot der betroffenen Dienstleistung oder des Produkts

Die Bedeutung und Vorteile digitaler Barrierefreiheit

• Rechtliche Anforderungen: In allen EU-Ländern müssen Unternehmen laut European Accessibilty Act Barrierefreiheitsstandards einhalten. In Deutschland ist dies im Barrierefreiheitsstärkungsgesetz (BFSG) geregelt. Nichtbefolgung kann rechtliche Konsequenzen haben.
• Neue Zielgruppen und Marktsegmente: Durch die Gestaltung barrierefreier Websites können nicht nur Menschen mit Behinderungen, sondern auch die immer älter werdende Bevölkerung besser erreicht werden.
• Verbesserung der Benutzerfreundlichkeit: Barrierefreiheit sorgt für klare Strukturen, leicht lesbare Texte und intuitive Navigation, was die Nutzerzufriedenheit erhöht.
• Curb Cut-Effekt: Das Prinzip des "Design for All" zeigt, dass barrierefreies Design allen Nutzer:innen zugutekommt, nicht nur Menschen mit Behinderungen.
• Innovationstreiber: Unternehmen, die Barrierefreiheit umsetzen, positionieren sich als Vorreiter und verschaffen sich einen Wettbewerbsvorteil.
• Suchmaschinenoptimierung (SEO): Barrierefreie Websites sind oft besser für Suchmaschinen optimiert und dadurch sichtbarer in den Suchergebnissen.
• Positives Image: Die Umsetzung von Barrierefreiheit zeigt soziale Verantwortung und stärkt das Markenimage sowie das Vertrauen und die Loyalität der Kunden.

Indem Unternehmen diese Vorteile nutzen, können sie nicht nur die gesetzlichen Anforderungen erfüllen, sondern auch ihre Marktposition stärken und ein inklusives und positives Nutzererlebnis schaffen.

Erklärung der verschiedenen Richtlinien und Standards

1. Web Content Accessibility Guidelines (WCAG) 2.1 und 2.2

Die WCAG sind internationale Richtlinien, die von der Web Accessibility Initiative (WAI) des World Wide Web Consortiums (W3C) ständig weiterentwickelt werden. Diese Richtlinien zielen darauf ab, Webinhalte für alle Nutzer:innen zugänglich zu machen, einschließlich Menschen mit Behinderungen. 

• WCAG 2.1: Diese Version erweitert die vorherige Version WCAG 2.0 um zusätzliche Anforderungen, die besonders mobile Nutzer:innen mit kognitiven und lernbezogenen Behinderungen betreffen. Sie wurde 1999 veröffentlicht und bildet derzeit die Grundlage für unsere gesetzlichen Regelungen.
• WCAG 2.2: Die neueste Version fügt weitere Kriterien hinzu, um die Zugänglichkeit für Menschen mit kognitiven Behinderungen weiter zu verbessern. Sie wurde im Oktober 2023 veröffentlicht und wird voraussichtlich in den kommenden ein bis zwei Jahren Eingang in unsere Gesetze finden.

2. Die vier Prinzipien der Barrierefreiheit

Die WCAG basieren auf vier grundlegenden Prinzipien:

• Wahrnehmbarkeit: Inhalte müssen den Nutzer:innen so präsentiert werden, dass sie diese wahrnehmen können. Dazu gehören gut lesbare Texte, verschriftliche Audio- und Videoinhalte sowie alternative Texte für Bilder.
• Bedienbarkeit: Nutzer:innen müssen in der Lage sein, die Inhalte zu bedienen. Dies umfasst die Navigation per Tastatur, zugängliche Formulare und interaktive Elemente.
• Verständlichkeit: Informationen und die Bedienung der Nutzeroberfläche müssen verständlich sein. Dies beinhaltet klare und einfache Sprache, konsistente Navigation und verständliche Anweisungen.
• Robustheit: Inhalte müssen robust genug sein, um von verschiedenen Benutzeragenten, einschließlich assistiver Technologien wie Screen Readern, interpretiert zu werden. Dies bedeutet, dass der Code korrekt und kompatibel mit aktuellen und zukünftigen Technologien sein muss.

3. BITV: Barrierefreie-Informationstechnik-Verordnung 2.0

Die BITV ist die deutsche Umsetzung der EU-Norm EN 301 549, die digitale Barrierefreiheit für öffentliche Stellen vorschreibt. Diese Verordnung verpflichtet Behörden und andere öffentliche Einrichtungen in Deutschland, ihre Websites und mobilen Anwendungen barrierefrei zu gestalten. Sie beinhaltet im Gegensatz zur EU-Norm weitergehende Anforderungen wie z. B. die Barrierefreiheit von PDF-Dokumenten.

4. Europäische Norm EN 301 549

Die EN 301 549 ist eine europäische Norm, die die Anforderungen an die Barrierefreiheit von IKT-Produkten und -Diensten festlegt. Diese Norm stellt sicher, dass digitale Produkte und Dienstleistungen in Europa zugänglich sind und soll gleiche Bedingungen für alle Unternehmen im europäischen Binnenmarkt schaffen. Grundlage sind derzeit die WCAG 2.1, eine Novelle der Norm ist bereits in Arbeit.

5. Überblick über die drei Konformitätsstufen

Die WCAG-Richtlinien sind in drei Konformitätsstufen unterteilt, die unterschiedliche Anforderungen an die Barrierefreiheit stellen:

1. Level A (Minimum)

Level A stellt die grundlegenden Anforderungen an die Barrierefreiheit dar, die erfüllt werden müssen, damit die grundlegendsten Funktionen einer Website zugänglich sind. Beispiele für Anforderungen auf Level A sind:

• Bereitstellung von Textalternativen für nicht-textliche Inhalte (z. B. Bilder)
• Sicherstellung, dass alle Funktionen einer Website über eine Tastatur bedient werden können
• Vermeidung von Inhalten, die Anfälle oder körperliche Reaktionen auslösen können

2. Level AA (Mittel)

Level AA umfasst zusätzliche Anforderungen, die darauf abzielen, die Barrierefreiheit für eine breitere Nutzergruppe zu verbessern. Dies ist das empfohlene Konformitätsniveau für die meisten Websites. Beispiele für Anforderungen auf Level AA sind:

• Sicherstellung eines ausreichenden Kontrasts zwischen Text und Hintergrund
• Bereitstellung von Alternativen für zeitbasierte Medien (z.B. Untertitel für Videos)
• Sicherstellung, dass die Website auf verschiedenen Bildschirmgrößen und -formaten sowie auf allen Geräten gut funktioniert

3. Level AAA (Hoch)

Level AAA stellt die höchsten Anforderungen an die Barrierefreiheit und richtet sich an Websites, die für alle Nutzergruppen vollständig zugänglich sein sollen. Beispiele für Anforderungen auf Level AAA sind:

• Bereitstellung von erweiterten Alternativen für alle Multimedia-Inhalte, z. B. in Gebärdensprache
• Sicherstellung, dass die Websiteinhalte auch für Menschen mit geringer Lese- kompetenz oder kognitiven Einschränkungen verständlich sind (z. B. Leichte Sprache)
• Bereitstellung von Links mit eindeutig erkennbarem Ziel

Nützliche Tools und Software für die Barrierefreiheit

Die Umsetzung von Barrierefreiheit auf Websites kann komplex sein. Glücklicherweise gibt es eine Vielzahl von Tools und Softwarelösungen, die Sie bei der Überprüfung und Verbesserung der Barrierefreiheit unterstützen können. Es ist jedoch zu beachten, dass der Einsatz dieser Werkzeuge keineswegs eine persönliche Überprüfung ersetzt. Im Folgenden stellen wir einige der wichtigsten Tools vor und erklären, wie sie in der Praxis angewendet werden können.

1. WAVE (Web Accessibility Evaluation Tool)

WAVE ist ein kostenloses Tool zur Evaluierung der Barrierefreiheit von Webinhalten. Es identifiziert und markiert potenzielle Barrieren auf Ihrer Website und bietet hilfreiche Vorschläge zur Behebung dieser Probleme.

• Anwendung: Einfach die URL der zu überprüfenden Seite eingeben und das Tool analysiert die Seite auf Barrierefreiheit.
• Nutzen: Visualisiert Barrierefreiheitsprobleme direkt auf der Seite, was die Identifikation und Behebung erleichtert.

2. Google Lighthouse

Google Lighthouse ist ein Open-Source-Tool zur Verbesserung der Qualität von Webanwendungen. Es umfasst auch eine Barrierefreiheitsprüfung und liefert detaillierte Berichte sowie Verbesserungsvorschläge.

• Anwendung: Kann als Browser-Erweiterung oder direkt in den Chrome DevTools verwendet werden.
• Nutzen: Bietet umfassende Analysen und Empfehlungen, um die Barrierefreiheit, Performance, SEO und mehr zu verbessern.

3. NVDA (NonVisual Desktop Access)

NVDA ist ein kostenloser Screen Reader für Windows, der blinden und sehbehinderten Menschen den Zugang zu Informationen ermöglicht. Es ist ein wertvolles Tool für Entwickler, um ihre Websites auf Tastaturbedienbarkeit und Screen Reader-Kompatibilität zu testen.

• Anwendung: Herunterladen und installieren, dann die Website mit NVDA navigieren und testen.
• Nutzen: Ermöglicht das Testen von Websites aus der Perspektive eines Screen Reader-Nutzers.

4. Colour Contrast Analyzer 

Der Colour Contrast Analyzer hilft dabei, sicherzustellen, dass der Farbkontrast zwischen Text und Hintergrund ausreichend ist, um die Lesbarkeit zu gewährleisten.

• Anwendung: Einfach die Farben des Textes und des Hintergrunds eingeben oder direkt vom Bildschirm mit der Pipette auswählen.
• Nutzen: Bewertet den Kontrast und gibt an, ob dieser den WCAG-Richtlinien entspricht.

5. PDF Accessibility Checker (PAC)

PAC ist ein kostenloses Tool zur Überprüfung der Barrierefreiheit von PDF-Dokumenten für Windows. Es analysiert die Struktur und den Inhalt von PDFs und identifiziert Barrieren.

• Anwendung: PDF-Datei hochladen und das Tool führt eine umfassende Prüfung durch.
• Nutzen: Liefert detaillierte Berichte und Empfehlungen zur Verbesserung der Barrierefreiheit von PDF-Dokumenten.

6. W3C Validation Service

Der W3C Validation Service überprüft den HTML- und CSS-Code einer Website auf Konformität mit den Webstandards des W3C.

• Anwendung: URL der zu überprüfenden Seite eingeben oder den HTML-Code direkt hochladen.
• Nutzen: Identifiziert Syntaxfehler und Verstöße gegen Webstandards, was zur Verbesserung der Barrierefreiheit beiträgt.

7. BITV-Selbstbewertungsformular (BIK)

Das BITV-Selbstbewertungsformular von BIK (“barrierefrei informieren und kommunizieren”) ist ein Online-Tool zur Bewertung der Barrierefreiheit gemäß der deutschen Barrierefreie-Informationstechnik-Verordnung (BITV).

• Anwendung: Die Website anhand eines strukturierten Fragebogens selbst bewerten.
• Nutzen: Hilft, den aktuellen Stand der Barrierefreiheit zu ermitteln und Bereiche zur Verbesserung zu identifizieren.

8. Accessibility Bookmarklets für Firefox Browser

Accessibility Bookmarkletssind kleine JavaScript-Programme, die direkt im Browser ausgeführt werden können, um verschiedene Barrierefreiheitsaspekte zu testen und zu visualisieren.

• Anwendung: Bookmarklet in die Lesezeichenleiste ziehen und auf der gewünschten Seite ausführen.
• Nutzen: Bietet schnelle und einfache Tests für verschiedene Barrierefreiheitsaspekte ohne zusätzliche Softwareinstallation

Assistive Technologien für ein barrierefreies Internet

Assistive Technologien sind entscheidende Hilfsmittel, die Menschen mit Behinderungen den Zugang zur digitalen Welt ermöglichen. Diese Technologien helfen dabei, Barrieren zu überwinden, die bei der Nutzung von Computern und anderen Endgeräten auftreten können. Hier sind einige der wichtigsten assistiven Technologien, die zur Verbesserung der Barrierefreiheit im Internet eingesetzt werden.

Screenreader:

• Funktion: Screenreader sind spezielle Softwareprogramme, die blinden und sehbehinderten Menschen die Navigation durch eine Website ermöglichen. Sie lesen den Nutzer:innen
  sämtliche Inhalte und Elemente (wie Grafiken und Texte) vor und geben diese Informationen über Lautsprecher oder Kopfhörer wieder.
• Anwendung: Mit Screenreadern können Nutzer:innen Formulare ausfüllen und Links erkennen sowie diesen folgen. Die Voraussetzung dafür ist, dass die Website entsprechend programmiert ist, damit der Screenreader die Seitenstruktur korrekt erkennen kann.

Braille-Zeilen:

• Funktion: Braille-Zeilen sind taktile Ausgabegeräte, die den Inhalt einer Website in Braille-Schrift darstellen. Sie bestehen aus einer Lochmasken-Schiene, durch die einzelne Stifte beim Auslesen des Textes hochgedrückt werden.
• Anwendung: Diese Technologie ermöglicht blinden Nutzer:innen die Inhalte einer Website durch Berührung zu erfassen, was besonders bei der textuellen Informationserfassung wichtig ist.

Tastatursteuerung:

• Funktion: Es gibt eine Vielzahl spezialisierter Tastaturen, die auf die Bedürfnisse von Menschen mit eingeschränkter Motorik zugeschnitten sind. Diese Tastaturen können manuell oder über andere Körperteile wie Ellenbogen oder Kopf bedient werden.
• Anwendung: Angepasste Eingabegeräte wie Touchpads, Minitastaturen oder Joysticks bieten Menschen mit motorischen Einschränkungen die Möglichkeit, Computer effektiv zu bedienen. Auch die Steuerung über Kopf- und Mundstäbe ist möglich.

Spracheingabe:

• Funktion: Spracherkennungssoftware ermöglicht die Bedienung des Computers über gesprochene Befehle. Diese Technologie wandelt gesprochene Worte in Text um und gibt sie aus.
• Anwendung: Besonders hilfreich für Menschen mit Sehbehinderungen oder anderen körperlichen Einschränkungen, die das Tippen erschweren. Es gibt sowohl sprecherabhängige als auch sprecherunabhängige Systeme, wobei Erstere ein gezieltes Sprachtraining erfordern.

Vergrößerungssoftware:

• Funktion: Vergrößerungssoftware bietet Menschen mit Sehschwäche eine pixelweise Vergrößerung des Computerbildes. Nutzer
  können den vergrößerten Bildschirmausschnitt durch spezielle Farb- und Kontrasteinstellungen anpassen.
• Anwendung: Diese Software erleichtert das Lesen und die Navigation für Menschen mit temporärer oder dauerhafter Sehschwäche erheblich.

Diese assistiven Technologien tragen wesentlich dazu bei, dass digitale Inhalte für alle Nutzer:innen zugänglich sind. Durch die korrekte Unterstützung dieser Technologien kann die Benutzerfreundlichkeit und Zugänglichkeit von Websites erheblich verbessert werden, was letztlich zu einer inklusiveren digitalen Welt beiträgt.

Checkliste zum Testen der Barrierefreiheit Ihrer Website

Die Umsetzung von Barrierefreiheit auf Ihrer Website kann eine Herausforderung darstellen. Anhand unserer für Sie entwickelten Checkliste können Sie sicherstellen, dass die wichtigsten Aspekte der Barrierefreiheit abgedeckt sind und Ihre Website für alle Nutzer:innen zugänglich ist.

Farb- und Schriftwahl

• Farben: Sicherstellen, dass Informationen nicht ausschließlich durch Farbunterschiede dargestellt werden.
• Kontrastverhältnisse in der Typografie gewährleisten:
  • Schrift zu Hintergrund (Standardgröße): Das Kontrastverhältnis zwischen der Schriftfarbe und der Hintergrundfarbe beträgt mindestens 4,5:1 für Level AA und 7:1 für Level AAA.
  • Große Schrift (ab 18 Punkt oder 14 Punkt fett): Das Kontrastverhältnis beträgt mindestens 3:1 für Level AA und 4,5:1 für Level AAA.
• Lesbarkeit der Schrift sicherstellen (Level AAA):
  • Textausrichtung: Der Text ist als Flattersatz links- oder rechtsbündig ausgerichtet.
  • Zeilenlänge: Die Zeilenlänge soll 80 Zeichen nicht überschreiten.
  • Farbwechsel durch Nutzer:innen: Vorder- und Hintergrundfarben können von den Nutzer:innen geändert werden.
  • Zeilen- und Absatzabstände: Der Zeilenabstand beträgt innerhalb von Absätzen mindestens das 1,5-fache der Schriftgröße. Der Abstand zwischen Absätzen ist mindestens 2-mal so groß wie die Schriftgröße.

Spracheinstellungen

• Kennzeichnung der Sprache:
  • Sprache im HTML-Element: Die Sprache ist als Attribut im HTML-Element definiert, z.B. <html lang="de">.
  • Abweichende Sprache: Wenn einzelne Wörter oder Absätze eine andere Sprache haben, als die definierte Seitensprache, wird dies ausgezeichnet.
  • Zitate: Freistehende Zitate sind als Blockquote-Element angegeben.
• Verständlichkeit der Wortwahl (nur für Level AAA):
  • Leichte Sprache: Eine Version des Textes in leichter Sprache wird bereitgestellt.
  • Fachbegriffe und unklare Begriffe: Fachtermini oder nicht eindeutige Begriffe sind in einer Definitionsliste, einem Glossar oder ähnlichen Hilfsmitteln erklärt.
  • Abkürzungen: Abkürzungen werden beim ersten Auftreten ausgeschrieben oder mit dem <abbr>-Element erläutert. Wenn die Aussprache eines Wortes entscheidend ist, wird diese direkt nach dem Wort, über einen Link oder ein Glossar angegeben.

Seitenstruktur

• Logischer Aufbau:
  • Logische Reihenfolge der Elemente: Die Elemente im HTML-Quelltext sind in einer logischen Reihenfolge angeordnet, sodass sie für Screenreader nachvollziehbar sind.
  • Vermeidung inhaltlicher Verwirrung: Es entsteht keine inhaltliche Verwirrung durch mittels CSS positionierte Elemente.
• Geeignete Überschriften:
  • Strukturvermittlung: Überschriften vermitteln und gliedern die Struktur der Website klar.
  • HTML-Auszeichnung: Überschriften sind korrekt mit den HTML-Elementen (h1, h2, h3, etc.) ausgezeichnet.
  • Einleitung von Inhaltsabschnitten (nur für Level AAA): Alle Inhaltsabschnitte werden durch entsprechende Überschriften eingeleitet.
• Verwendung passender HTML-Elemente für Inhaltstypen:
  • Listen: Aufzählungen sind korrekt als Listen (ul, ol, dl) im HTML-Quelltext formatiert.
  • Zitate: Zitate sind als <blockquote>- und <cite>-Elemente eingebunden.
  • Datentabellen: Tabellen sind korrekt mit Spalten-, Zeilen- und Tabellenüberschriften versehen, und die Inhalte sind linearisiert.
• Vergrößerbarkeit der Webseite:
  • Erhalt der Lesbarkeit und Funktionalität: Die Inhalte bleiben bei einer Skalierung auf 200% oder bei einer Präsentation mit einer Breite von 320 Pixeln lesbar und funktional. Dies erfordert in der Regel ein responsives Design.
• Korrekte Syntax:
  • Standardkonformer HTML-Quelltext: Der HTML-Quelltext ist standardkonform und fehlerfrei.
  • Barrierefreie Auszeichnung: Generierte und selbst programmierte Inhalte sind so ausgezeichnet, dass sie die Barrierefreiheit unterstützen. Dies ist vor allem bei interaktiven Elementen wichtig, für die keine nativen HMTL Elemente existieren.

Multimedia und interaktive Elemente

• Inhalte für Screenreader geeignet:
  • ALT-Attribute für Bilder: Bilder werden mit passenden alternativen Texten im ALT-Attribut beschrieben.
  • Lange Beschreibungen: Wenn der alternative Text nicht ausreicht, wird eine ausführliche Beschreibung bereitgestellt und im ALT-Text darauf verwiesen.
  • Dekorative Bilder: Dekorative Bilder enthalten ein leeres ALT-Attribut, sind über das aria-hidden-Attribut ausgeblendet oder werden via CSS als Hintergrund eingebunden.
  • Titel für Frames und Iframes: Frames und Iframes sind korrekt betitelt.
  • Text statt Schriftgrafiken: Inhalte werden in Textform und nicht als Schriftgrafiken dargestellt (ausgenommen Logos).
• Audiovisuelle Medien:
  • Transkripte für Audioinhalte: Relevante Audioinhalte, wie MP3-Dateien und Podcasts, werden durch Transkripte ergänzt.
  • Untertitel für Videos: Videos, Webcasts und Videostreams sind synchron untertitelt.
  • Audiobeschreibungen: Videos enthalten Audiobeschreibungen, wenn relevante Inhalte nur visuell verständlich sind.
  • Hintergrundgeräusche: Sprachwiedergaben haben keine oder sehr leise Hintergrundgeräusche, oder diese lassen sich abschalten.
• Steuerbarkeit automatisch abspielender Inhalte:
  • Pausierbare Inhalte: Automatisch abspielende oder bewegende Inhalte, wie Laufschriften und Slideshows, können pausiert, gestoppt oder ausgeblendet werden, wenn sie länger als fünf Sekunden andauern.
  • Kontrolle über aktualisierte Inhalte: Automatisch aktualisierender Inhalt, wie Newsticker oder Chatnachrichten, kann pausiert, gestoppt, ausgeblendet oder manuell kontrolliert werden.
  • Zeitlimitierungen anpassbar: Es gibt keine Zeitbegrenzungen für die Anzeige von Seiteninhalten oder Anwender können vorhandene zeitliche Begrenzungen abschalten oder verlängern.
  • Pausetaste für automatisch abspielende Medien: Audio- und Video-Inhalte, die länger als drei Sekunden automatisch abspielen, können pausiert werden.
• Vorhersehbarkeit der Gestaltung und Funktion:
  • Keine unerwarteten Inhaltsänderungen: Der Inhalt verändert sich nicht, wenn er mit der Maus oder per Tabulator fokussiert wird.
  • Keine unerwarteten Eingabeaktionen: Der Inhalt verändert sich nicht automatisch bei einer Eingabe, es sei denn, dies wurde vorher angekündigt.
  • Kontextveränderungen (nur Level AAA): Eine Veränderung des Kontextes erfolgt nur durch eine Bestätigung der Nutzer
• Vermeidung anfallauslösender Inhalte:
  • Keine blitzenden Elemente: Webseiten enthalten keine Inhalte, die häufiger als dreimal in der Sekunde blitzen, oder die Blitze sind innerhalb eines sicheren Grenzwerts.
  • Sicherheitsmaßnahmen (nur Level AAA): Webseiten enthalten keine Inhalte, die öfter als dreimal in der Sekunde blitzen.

Formulare

• Übersichtlicher Aufbau:
  • Beschriftungen: Formularfelder sind mit sinngebenden Beschriftungen im <label>-Element verknüpft. Platzhaltertexte innerhalb der Formularfelder gelten nicht als Beschriftungen.
  • Gruppierung: Mehrteilige Formulare sind in inhaltlich zusammengehörige Gruppen unterteilt, die im HTML-Quelltext durch das <fieldset>-Element strukturiert sind.
• Hindernisfreie Formulareingaben:
  • Verzicht auf grafische Captchas: Grafische Captchas werden vermieden oder es wird eine barrierefreie Alternative bereitgestellt.
  • Sitzungskontinuität (nur Level AAA): Nach einer erneuten Anmeldung können Anwender ihre Aktivitäten ohne Datenverlust fortsetzen, wenn die Sitzung ausläuft.
  • Warnung bei Datenverlust: Anwender
    werden gewarnt, wenn eine Unterbrechung zum Verlust ihrer Eingaben führen könnte, es sei denn, die Eingaben bleiben bei Inaktivität mindestens 20 Stunden erhalten.
• Fehlervermeidung und -korrektur:
  • Fehlermeldungen: Automatisch erkannte Eingabefehler geben klar an, welches Element fehlerhaft ist.
  • Beschriftungen und Hinweise: Es werden Beschriftungen oder Hinweise gegeben, wenn Eingaben erwartet werden.
  • Korrekturempfehlungen: Es werden Empfehlungen zur Korrektur gegeben, wenn falsche Benutzereingaben gemacht werden.
  • Überprüfung vor Absenden: Eingaben, die rechtliche oder finanzielle Folgen haben, müssen vor dem Absenden überprüft, geändert, gelöscht oder bestätigt werden können.
  • Hilfen bei spezifischen Eingaben (nur Level AAA): Wenn bestimmte Informationen oder ein bestimmtes Format für Eingaben erforderlich sind, wird eine kontextsensitive Hilfe bereitgestellt, die den Nutzer:innen erklärt, wie sie die Eingabe korrekt vornehmen können.

Navigation

• Einfache und verständliche Navigation:
  • Konsistenz: Die Navigation ist innerhalb der Webseite gleichbleibend angeordnet und aufgebaut.
  • Einheitlichkeit: Elemente mit gleicher Funktion bleiben auf der gesamten Webseite konsistent.
  • Gruppierung: Wiederholende Elemente sind gruppiert oder durch Überschriften gekennzeichnet und können mit Sprungmarken übersprungen werden.
  • Logische Fokus-Reihenfolge: Die Reihenfolge der Links in der Navigation und im Inhalt folgt einer logischen Abfolge.
  • Verständliche Linktexte: Linktexte sind entweder aus sich selbst heraus oder aus dem Kontext heraus verständlich.
• Zusätzliche Navigationsmethoden:
  • Alternative Zugriffswege: Es gibt mindestens eine zusätzliche Methode zur Navigation, wie eine Suchfunktion und/oder eine HTML-Sitemap.
• Eindeutige Anweisungen:
  • Klare Anweisungen: Es werden keine rein optischen oder akustischen Anweisungen wie „Den roten Schalter betätigen“ verwendet.
• Tastaturbedienung:
  • Zugänglichkeit: Alle Seitenfunktionalitäten und -elemente, einschließlich Formularfelder, Kontrollelemente und Schalter, sind über die Tabulatortaste erreichbar.
  • Fokuskennzeichnung: Elemente im Fokus-Zustand werden bei Ansteuerung mit der Tastatur gekennzeichnet.
  • Kein Zeitdruck: Für die Bedienung ist keine bestimmte Zeiteinteilung für einzelne Tastanschläge erforderlich.
  • Fokusfreiheit: Der Tastaturfokus ist bei keinem Element der Webseite blockiert.
  • Tastatursteuerung: Anwender
    können jedes Element mit der Tastatur ansteuern und verlassen.
  • Information über spezielle Tasten: Der Benutzer wird informiert, wenn andere Tastaturtasten als die gebräuchlichen Tabulator- oder Pfeiltasten verwendet werden.
  • Sichtbare Sprungmarken: Sprungmarken sind vorhanden und/oder werden beim Navigieren mit der Tabulatortaste sichtbar.

MOGIC – Ihr Partner für barrierefreie und benutzerfreundliche Websites.

Barrierefreiheit ist mehr als nur eine gesetzliche Verpflichtung – sie ist eine Chance, Ihre Reichweite zu erweitern, Ihre Nutzerzufriedenheit zu erhöhen und Ihre Unternehmensreputation zu stärken. Nutzen Sie die Gelegenheit, Ihre Website inklusiv und zugänglich zu gestalten und profitieren Sie von den vielfältigen Vorteilen.

Wie MOGIC Ihnen helfen kann:

• Erfahrung und Expertise: Mit über 20 Jahren Erfahrung und zertifizierten Experten für Usability, User Experience (ISTQB & UXQB) und Barrierefreiheit (CPACC) sind wir der ideale Partner für die Umsetzung Ihrer Barrierefreiheitsprojekte.
• Ganzheitlicher Ansatz: Von der Analyse und Beratung über das Design bis hin zur technischen Umsetzung bieten wir eine umfassende Betreuung.
• Erfolgsgarantie: Unsere maßgeschneiderten Lösungen sind darauf ausgelegt, Ihre Website nicht nur barrierefrei, sondern auch leistungsfähiger und benutzerfreundlicher zu machen.

Handeln Sie jetzt und sichern Sie sich folgende Vorteile:

1. Kostenlose Erstberatung: Besprechen Sie Ihre spezifischen Anforderungen und Herausforderungen mit unseren Experten.
2. Umfassende Analyse Ihrer Website: Identifizieren Sie Barrieren und erhalten Sie maßgeschneiderte Empfehlungen zur Verbesserung.
3. Implementierung durch Profis: Profitieren Sie von unserer langjährigen Erfahrung und unserem technischen Know-how.

Gestalten Sie Ihre digitale Zukunft inklusiv und zugänglich. Gemeinsam machen wir Ihre Website bereit für die Anforderungen von morgen.

Kontaktieren Sie uns noch heute und lassen Sie uns gemeinsam Ihre Website barrierefrei gestalten. Buchen Sie dazu ein kostenloses Erstgespräch bei uns!