Barrierefreiheit (Accessibility) und SEO werden oft als getrennte Themen behandelt – zwei verschiedene Abteilungen, zwei verschiedene Checklisten. Dabei verfolgen beide dasselbe grundlegende Ziel: Inhalte für alle zugänglich machen. Für Suchmaschinen bedeutet das: maschinenlesbare, gut strukturierte Inhalte. Für Menschen mit Behinderungen: Inhalte die Screenreader, Tastaturnavigation und andere assistive Technologien unterstützen. Wo sich beides überschneidet, ist die Schnittmenge besonders groß – und sie ist größer als die meisten erwarten.
Warum Barrierefreiheit SEO-Vorteile bringt
Google funktioniert technisch wie ein sehr fortgeschrittener, aber blinder Nutzer: Es liest HTML, analysiert Struktur, folgt Links, aber kann keine visuellen Inhalte verstehen. Screenreader für Menschen mit Sehbehinderung funktionieren ähnlich.
Was für Screenreader gut funktioniert, funktioniert auch für Google. Das sind keine Zufälligkeiten, sondern Konsequenz der gemeinsamen Basis: beide benötigen semantisches HTML, klare Strukturen und aussagekräftige Textalternativen.
Websites die WCAG 2.1 (Web Content Accessibility Guidelines) erfüllen, haben im Schnitt 15–20 % bessere Core Web Vitals und höhere organische Klickraten als nicht-barrierefreie Seiten.
Alt-Texte: Pflicht für Accessibility und SEO
Alt-Texte für Bilder sind sowohl für Barrierefreiheit als auch für SEO fundamentaler Bestandteil. Ein Screenreader liest den Alt-Text vor, wenn ein Bild nicht sichtbar ist. Google nutzt den Alt-Text um Bilder zu verstehen und in der Bildsuche zu indexieren.
Schlechter Alt-Text: alt="foto" oder alt="bild1234.jpg" – nichtssagend für Mensch und Maschine.
Guter Alt-Text: alt="Handwerker installiert Heizungsanlage in Wohngebäude" – beschreibt das Bild, enthält relevante Keywords, ist für Screenreader verständlich.
Regeln für gute Alt-Texte:
- Beschreiben Sie was zu sehen ist, nicht was Sie zeigen wollen
- Enthalten Sie relevante Keywords natürlich – kein Keyword-Stuffing
- Dekorative Bilder (z.B. Hintergrundbilder ohne inhaltliche Bedeutung):
alt=""(leerer Alt-Text) - Maximal 125 Zeichen
Semantisches HTML: Struktur für Maschinen und Menschen
HTML hat eine Reihe semantischer Elemente, die Bedeutung transportieren:
<header> <!-- Seitenkopf -->
<nav> <!-- Navigation -->
<main> <!-- Hauptinhalt -->
<article> <!-- eigenständiger Artikel/Content -->
<section> <!-- thematischer Abschnitt -->
<aside> <!-- Nebenbeiinhalt, Sidebar -->
<footer> <!-- Fußzeile -->Semantische Elemente helfen Screenreadern, die Seitenstruktur zu navigieren. Sie helfen Google, die Funktion verschiedener Seitenbereiche zu verstehen. Eine Navigation die als <nav> ausgezeichnet ist, wird von Google als Navigation erkannt – was die interne Linking-Struktur klarer macht.
Viele Website-Themes und Page Builder generieren HTML das semantisch inkorrekt ist – z.B. `
Überschriftenhierarchie: H1 bis H6
Die korrekte Überschriftenhierarchie ist sowohl ein Accessibility-Standard als auch ein SEO-Best-Practice:
- Eine H1 pro Seite – Haupttitel der Seite
- H2 für Hauptabschnitte – logische Gliederung des Inhalts
- H3 für Unterabschnitte – innerhalb der H2-Bereiche
- Keine Sprünge (H1 → H3 ohne H2) – das verwirrt Screenreader und Google
Screenreader-Nutzer navigieren oft über Überschriften durch einen Artikel – ähnlich wie SEO-Profis die Struktur einer Seite scannen. Eine konsistente Hierarchie hilft beiden.
Tastaturnavigation und Fokus-Management
Barrierefreiheit erfordert, dass alle Funktionen einer Website per Tastatur nutzbar sind – ohne Maus. Das betrifft besonders interaktive Elemente: Menüs, Formulare, Buttons, Links, Modals.
Für SEO relevant: Korrekte Tastaturnavigation setzt voraus, dass alle Links und Buttons im HTML korrekt als <a> bzw. <button> ausgezeichnet sind – nicht als <div> oder <span> mit JavaScript-Click-Handler. Google erkennt Links in nativen <a>-Tags zuverlässiger als JavaScript-basierte Klick-Events.
Farbkontrast und Core Web Vitals
Barrierefreiheit im engeren Sinne schreibt Mindest-Kontrastverhältnisse vor (WCAG: 4,5:1 für normalen Text). Der direkte SEO-Einfluss ist gering – aber:
Indirekter Effekt: Guter Kontrast verbessert die Lesbarkeit, senkt die Absprungrate und erhöht die Verweildauer. Diese Nutzersignale haben langfristigen Einfluss auf Rankings.
Core Web Vitals – CLS: Schlechtes Layout mit sprunghaften Elementen schadet sowohl der Accessibility (Nutzer mit motorischen Einschränkungen haben Probleme mit sich bewegenden Elementen) als auch dem CLS-Score (ein Core Web Vital).
ARIA-Attribute: Ergänzung, nicht Ersatz
ARIA (Accessible Rich Internet Applications) Attribute ergänzen HTML-Elemente mit Accessibility-Informationen für Screenreader:
<button aria-label="Suchformular absenden">
<svg>...</svg>
</button>Ohne aria-label würde ein Screenreader nur „Button” ansagen – nicht hilfreich. Mit ARIA wird der Zweck klar kommuniziert.
Für SEO ist ARIA weniger direkt relevant – Google liest ARIA-Attribute, priorisiert aber HTML-Semantik. Korrekte ARIA-Nutzung schadet nicht und kann die Verständlichkeit von komplexen UI-Elementen für Google verbessern.
Testen Sie Ihre Website auf Barrierefreiheit und SEO gleichzeitig mit den Chrome DevTools: „Lighthouse" in den DevTools prüft sowohl SEO als auch Accessibility in einem Durchgang. Eine Accessibility-Note unter 80 deutet auf strukturelle Probleme hin, die oft auch SEO-Auswirkungen haben.
Barrierefreiheit als Rechtspflicht
Seit dem Barrierefreiheitsstärkungsgesetz (BFSG) gilt für Unternehmen die bestimmte digitale Produkte und Dienstleistungen anbieten ab 2025 eine Pflicht zur Barrierefreiheit. Das betrifft zunächst hauptsächlich B2C-Unternehmen mit Online-Shops und -Services – aber die Anforderungen werden schrittweise ausgeweitet.
Barrierefreiheit ist nicht mehr nur ethisch geboten oder SEO-sinnvoll – ab 2025 hat sie für viele Unternehmen rechtliche Relevanz. Prüfen Sie jetzt ob Ihre Website betroffen ist.
Wer frühzeitig investiert, profitiert gleichzeitig von besseren Rankings und erfüllt gesetzliche Anforderungen. Für die technische Umsetzung im Rahmen eines größeren Web-Projekts empfehlen wir einen Blick auf unsere Webdesign-Leistungen.