Potenziale für E-Commerce und Revenue durch Barrierefreiheit & SEO

19.3.2024

Die Verbindung zwischen Suchmaschinenoptimierung und Barrierefreiheit hat viele Synergie Effekte und birgt erhebliches Potenzial für E-Commerce. Denn Barrierefreiheit bedeutet, dass alle Menschen, unabhängig von physischen oder kognitiven Einschränkungen, Webinhalte ohne Einschränkungen nutzen können. Dies schließt aber auch Technologien wie Web Bots, Screenreader, Voice Search oder Tastaturbedienbarkeit ein. Ein Grund mehr, sich mit SEO, Barrierefreiheit und dem Barrierefreiheitstärkungsgesetz (BFGS) auseinander zu setzen.

Potenzial barrierearmer Websites aus SEO Perspektive

Die Optimierung der Barrierefreiheit verbessert die User Experience für ein breiteres Publikum und wirkt sich positiv auf die SEO-Performance aus. Durch Maßnahmen wie Pagespeed-Optimierung, Alt-Attribute für Bilder, Responsive Design sowie Tastaturbedienbarkeit und den Einsatz von HTML und ARIA steigert man nicht nur die Zugänglichkeit für Menschen mit und ohne Einschränkungen, sondern auch die Sichtbarkeit in Suchmaschinen. Dies eröffnet Märkte für eine kaufkräftige, bisher wenig beachtete Zielgruppe und trägt zur Umsatzsteigerung bei. Das ist nicht immer zwangsläufig mit hohen Investitionen verbunden.

Wir haben uns die Umsatzsituation anhand von 2 Szenarien angesehen; 1x ohne Barrierefreiheit und 1x barrierearme Website. Die Formeln zur Umsatzberechnung beinhaltet Variablen wie Anzahl der täglichen Visits, die Conversion Rate, Average Order Value und die Bounce Rate. Wir haben konkrete Werte genommen.

Tägliche Visits: 5.000, Average Conversion Rate: 2,5 %, Average Order Value: 20 €

Bounce Rate aufgrund von fehlender Barrierefreiheit: 5 % (0,05 als Dezimalzahl)

Revenue Potenzial einer barrierefreien Website:

Formel: Revenue = Tägliche Visits × Conversion Rate × Ø Warenkorbwert

Diese Formel berechnet den Umsatz einer Website bei idealen Bedingungen für alle User. Wir gehen davon aus, dass dies zu optimalen Conversion Bedingungen führt.

Revenue Verlust bei fehlender Barrierefreiheit:

Formel: Revenue = Tägliche Visits × (1 − Bounce Rate durch Barrieren *) × Conversion Rate × Ø Order Value

* Die Bounce Rate durch Barrieren ist der Prozentsatz der Besuche, die aufgrund dieser Barrieren nicht zu einem Kauf führen.

Szenario 1: Umsatz Potenzial einer barrierefreien Website:

Revenue ohne Barrieren = 5.000 x 0,025 × 20

Tägl. Revenue: 2500,00 Euro

Jährl. Revenue: 912.500,00 Euro

Szenario 2: Revenue Verlust durch Barrieren

Revenue mit Barrieren=5.000×(1−0,05)×0,025×20

Tägl. Revenue mit Barrieren : 2.375,00 €

Jährl. Revenue mit Barrieren : 866.875,00 €

Daraus errechnet sich der tägliche Revenue Verlust von 125,00 €. Auf das Jahr gerechnet entsteht also eine Einnahmelücke von 45.625,00 €

Viele Anpassungen für eine barrierefreie Website gehören zu den typischen SEO Services und müssen deshalb nicht gesondert budgetiert werden. Umfangreichere Anpassungen gehören bei einem Website Relaunch ins Pflichtenheft. Daraus folgt, dass barrierefreie Websites ein hohes Umsatzpotenzial bieten, welches E-Commerce Shops nicht links liegen lassen können.

Barrierefreiheit & Barrierearmut in der Praxis?

Das Barrierefreiheitsstärkungsgesetz setzt die EU-Richtlinie 2019/882 um und fordert ab dem 28. Juni 2025, dass bestimmte Produkte und Dienstleistungen barrierefrei gestaltet werden. Unternehmen und Institutionen müssen sich auf diese Anforderungen vorbereiten, wobei Übergangsfristen für bestimmte Produkte und Dienste gelten.

Um barrierefreie und barrierearme Websites zu schaffen, können einfache SEO-Optimierungen wie klare Strukturierung, Einsatz von Alt-Texten für Bilder, nutzerfreundliche Navigation und die Verwendung von ARIA-Landmarks helfen. Wir sind die unterschiedlichen Elemente für mehr Barrierefreiheit von Websites durchgegangen.

  • ARIA-Eingabefelder und [role]-Elemente

ARIA-Eingabefelder und [role]-Elemente sind technische Spezifikationen, die sicherstellen, dass Webinhalte und -anwendungen für Menschen mit Behinderungen zugänglich sind. Sie beinhalten die Verwendung von ARIA (Accessible Rich Internet Applications)-Markierungen, um die Zugänglichkeit und Interoperabilität mit assistiven Technologien wie Bildschirmlesern zu verbessern. Eingabefelder müssen entsprechend benannt werden, und Elemente mit einer Rolle müssen die erforderlichen ARIA-Attribute enthalten, um ihre Funktion und ihren Zustand zu beschreiben.

  • [aria-hidden="true"]

Das aria-hidden="true" Attribut verbirgt Elemente vor dem Accessibility-Tree, selbst wenn sie visuell dargestellt oder interaktiv sind, was bedeutet, dass diese Inhalte für Screenreader-Nutzer unsichtbar sind. Es ist wichtig, keine interaktiven Elemente so zu verbergen, da sie in der Tastaturnavigation erreichbar bleiben, jedoch nicht durch Screenreader zugänglich sind. Eine Besonderheit ist, dass Elemente, die in einem mit aria-hidden="true" markierten Bereich liegen, nicht durch Setzen von aria-hidden="false" wieder sichtbar gemacht werden können, da diese Funktionalität von Browsern nicht unterstützt wird.

  • Kontrastverhältnis von Hintergrund- und Vordergrundfarben

Hohe Kontraste helfen allen Usern, insbesondere solche mit Sehbeeinträchtigungen, Texte einfacher und schneller zu lesen.

Web-Content Accessibility Guidelines (WCAG) empfehlen ein Mindestkontrastverhältnis von 4,5:1 für normalen Text und 3:1 für großformatigen Text. Dies stellt sicher, dass Inhalte auch von Personen mit eingeschränktem Sehvermögen zugänglich sind. Das senkt die Bounce Rate, weil Inhalte vielleicht nicht lesbar sind.

Optimierung der UX: Guter Kontrast trägt dazu bei, die Aufmerksamkeit gezielt zu lenken und die Hierarchie von Informationen klar zu kommunizieren. Ergebnis: User verweilen länger auf der Website.

  • [id]-Attribute

Das [id]-Attribut ist ein einzigartiger Identifikator für HTML-Elemente, der für Styling, JavaScript-Zugriff und Ankerverlinkungen verwendet wird.

[id]-Attribute verbessern die Zugänglichkeit und SEO, indem sie Inhalte für assistive Technologien identifizierbar machen und die Webstruktur klären.

  • Überschriftenstruktur

Screenreader und Voice Search Technologien nutzen die Überschriftenstruktur, um Inhalte logisch zu navigieren und zu interpretieren, was die Accessibility verbessert. Für SEO sind Überschriften essentiell, da sie die Inhaltsstruktur verdeutlichen und Schlüsselwörter hervorheben, was die Suchmaschinenplatzierung optimiert.

  • Interne Links

Klare interne Verlinkungen ermöglichen Menschen mit Einschränkungen und Web Bots eine bessere Navigation und Verständlichkeit, verbessern die Zugänglichkeit und unterstützen die Suchmaschinenoptimierung durch strukturiertes Crawling.

Formulierungen wie -> hier und -> weiter müssen optimiert werden z. B. in -> hier geht’s zum Webshop und -> weitere Infos zur Barrierefreiheit finden Sie hier.

  • Tabellen und Listen

Zur Verbesserung des Lesens von Tabellen oder Listen mit Screenreadern sollten Überschriftenzellen korrekt markiert, sinnvolle Zusammenfassungen bereitgestellt, komplexe Tabellen in einfachere aufgeteilt und Inhalte logisch strukturiert werden, um die Verständlichkeit und Zugänglichkeit zu erhöhen.

Die Strukturierung von Daten in Tabellen und Listen kann auch die SEO verbessern. Suchmaschinen bewerten gut strukturierte und zugängliche Inhalte positiv, da diese die Nutzererfahrung verbessern. Klare Strukturen helfen Suchmaschinen, Inhalte besser zu verstehen und zu indizieren, was zu einer höheren Sichtbarkeit in den Suchergebnissen führen kann.

  • Button Namen

Buttons sollten im Zuge der Accessibility für Assistenztechnologien und für Web Bots mit Keywords benannt werden. Das verbessert die Nutzerführung, was die Interaktion erleichtert und SEO unterstützt.

  • [alt]-Attribute und [alt]-Attribute mit sich wiederholenden Texten

[alt]-Attribute bieten Textalternativen für Bilder, die von Assistenztechnologien gelesen werden, um Barrierefreiheit zu gewährleisten. Wiederholende [alt]-Texte können jedoch Redundanz verursachen. Sie sind für SEO essentiell, da sie Suchmaschinen Kontext und Relevanz von Bildinhalten vermitteln.

  • [user-scalable="no"]

[user-scalable="no"] verhindert das Zoomen auf Webseiten, was Barrierefreiheit einschränkt und negativen Einfluss auf die Suchmaschinenbewertung haben kann. Deshalb muss die Skalierbarkeit durch Zoomen gewährleistet sein.

  • role="dialog" Elemente oder role="alertdialog" Elemente mit barrierefreien Namen

Elemente mit role="dialog" oder "alertdialog" benötigen barrierefreie Namen, um ihre Funktion und Bedeutung für Nutzer von Assistenztechnologien klar zu kommunizieren, was die Zugänglichkeit und Nutzererfahrung wesentlich verbessert.

  • Dokument mit <title>-Element

<title>-Elemente sind essenziell für SEO und Barrierefreiheit, da sie Suchmaschinen und Assistenztechnologien den Inhalt und Zweck eines Dokuments klarmachen. Die Orientierung innerhalb einer Website wird erleichtert. Aber vor allem gehören <title>-Elemente zu den wichtigsten Faktoren für eine Indexierung in Suchmaschinen. Nebenbei: Die Vergabe von Meta Titles und Meta Descriptions gehört zum kleinen 1x1 der SEO Betreuung.

  • <html>-Element mit [lang]-Attribut

Das Fehlen eines lang-Attributs führt zu falscher Aussprache durch Screenreader, beeinträchtigt die Accessibility und Nutzererfahrung. Für SEO ist das korrekte Sprach-Targeting essenziell, um Inhalte der richtigen Zielgruppe zuzuordnen.

  • Formularelemente mit Labels

Labels verbessern die Formularzugänglichkeit für Screenreader-Nutzer, erhöhen die Nutzerinteraktion und -zufriedenheit, was indirekt die SEO fördert, indem es positive Nutzersignale und eine bessere Seitenerfahrung bietet.

  • Links sind ohne Farbe erkennbar.

Text mit geringem Kontrast und schlecht erkennbare Links verschlechtern die Lesbarkeit und Zugänglichkeit, beeinträchtigen die Nutzererfahrung und verringern dadurch die SEO-Leistung der Website.

  • Element hat [tabindex]-Wert größer als 0

Ein [tabindex]-Wert größer als 0 setzt eine künstliche Reihenfolge der Tastaturnavigation, was für Nutzer von Assistenztechnologien verwirrend sein kann. Diese Einstellungen beeinträchtigen die Zugänglichkeit, haben aber keinen direkten Einfluss auf SEO. Jedoch verbessern angepasste [tabindex]-Werte die Usability, was zu positiven User Signals führt.

Fazit: SEO Potenziale durch Barrierefreiheit

Die Verschmelzung von Barrierefreiheit und SEO stellt eine gewinnbringende Strategie für E-Commerce-Unternehmen dar. Durch die Implementierung barrierefreier Features, wie Screenreader-Unterstützung und Tastaturbedienung, wird nicht nur die Benutzererfahrung für eine diverse Nutzerschaft verbessert, sondern auch die Sichtbarkeit in Suchmaschinen erhöht.

Optimierungen wie Pagespeed, responsive Design und der Einsatz von Alt-Attributen für Bilder tragen wesentlich zur SEO-Performance bei und erschließen neue Märkte. Zudem lassen sich Umsatzpotenziale und Return on Investment schnell berechnen. Mit verhältnismäßig geringen Investitionen können oftmals erhebliche Umsatzsteigerungen erzielt werden. Eine barrierefreie Website ist auch aus SEO Sicht ein wirklicher Zugewinn.

12.4.2024

Websiteoptimierung nachhaltiger gestalten

learn more
3.4.2024

Structured Data für Produktvarianten

learn more
19.3.2024

Potenziale für E-Commerce und Revenue durch Barrierefreiheit & SEO

learn more