Barrierefreie Webseiten und Online-Shops – das gilt es zu beachten
Was bedeutet Barrierefreiheit für Webseiten und Online-Shops?
Barrierefreiheit für Webseiten und Online-Shops bezieht sich auf die Gestaltung von Produkten, Dienstleistungen und deren Umgebung, die für so viele Menschen wie möglich zugänglich ist. Barrierefreiheit wird oft im Zusammenhang mit der Zugänglichkeit und Verständlichkeit von digitalen Inhalten und Produkten wie Shops und Webseiten verwendet.
In Deutschland gilt die Barrierefreie-Informationstechnik-Verordnung (BITV). Sie ist eine nationale Umsetzung des EAA und beruht auf den Mindeststandards und Prinzipien, die im EAA festgelegt sind. Die BITV dient dazu, sicherzustellen, dass digitale Produkte und Dienstleistungen in Deutschland die Anforderungen des EAA erfüllen.
Das macht Barrierefreiheit nicht mehr zu einem „Nice to have”, sondern zu einem unabdingbaren Bestandteil eines Markenauftritts. Denn ohne eine entsprechende Kennzeichnung der EU ist dann eine Positionierung der Produkte oder Dienstleistungen gar nicht mehr möglich. Seit 2018 sind barrierefreie Webseiten auch in Deutschland bei allen staatlich finanzierten Institutionen und Behörden verpflichtend.
Von Barrierefreiheit profitieren alle
Barrierefreie Webseiten sind nicht nur für Menschen mit Behinderungen von Vorteil, sondern sie bereichern die Online-Erfahrung für alle Nutzer. Die Grundidee von Barrierefreiheit im Web ist, digitale Inhalte so zu gestalten, dass sie für jeden leicht zugänglich und nutzbar sind, unabhängig von ihren Fähigkeiten oder technischen Voraussetzungen. Warum ist dies so wichtig, und wie profitieren alle davon?
Die Prinzipien der Barrierefreiheit führen zu einer besseren Benutzererfahrung für alle. Eine klare Website-Struktur, gut lesbare Texte, alternative Texte für Bilder und einfache Navigation helfen nicht nur Menschen mit Behinderungen, sondern erleichtern auch allen anderen Nutzern das Finden und Verstehen von Inhalten. Das spart Zeit und Frustration.
Barrierefreiheit hilft:
- Senioren sowie Personen, die Webseiten mit Smartphone oder Tablet besuchen
- Sehbeeinträchtigte, blinde Personen sowie Schwerhörige, gehörlose Personen
- Personen mit einer geistigen, körperlichen Beeinträchtigung oder geringen Sprachkenntnissen
Barrierefreie Webseiten sind in einer Welt, in der Menschen auf einer breiten Palette von Geräten und in verschiedenen Situationen auf das Internet zugreifen, von unschätzbarem Wert. Ob auf einem Desktop-Computer, einem Tablet, einem Smartphone oder einem sprachgesteuerten Gerät – die Barrierefreiheit gewährleistet, dass die Website auf jedem dieser Geräte optimal funktioniert.
Barrierefreiheit nützt allen – Ein barrierefreies Lebensumfeld zu schaffen kommt allen Menschen zugute. Denn jeder Mensch hat im Laufe des Lebens – manche erst im Alter, manche früher – mit Barrieren zu kämpfen.
Ursula Naue, Universität Wien
Was ändert sich ab dem Jahr 2025?
Ab dem 28. Juni 2025 tritt das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Es stellt sicher, dass die Vorgaben der BITV eingehalten werden müssen. Von den Bestimmungen des BFSG sind Produkthersteller, Händler und Dienstleister betroffen. Das bedeutet, dass alle Webseiten und Online-Shops ab dem 28. Juni 2025 barrierefrei sein müssen. Es gelten dabei dieselben Richtlinien wie für staatlich finanzierte Institutionen und Behörden.
Ist Ihre Webseite oder Ihr Online-Shop noch nicht barrierefrei? Dann sollten Sie umgehend beginnen, mit Ihrer Agentur einen Webseiten-Relaunch zu planen, oder den bestehenden Webauftritt entsprechend zu erweitern, damit noch genug Zeit dafür bleibt. Denn die Herausforderungen bei der Umsetzung barrierefreier Webseiten und Online-Shops sollten nicht unterschätzt werden. Es bietet sich dabei zudem eine ideale Gelegenheit, die Webseiten auch technisch auf den neuesten Stand zu bringen. Wenn Sie kürzlich einen Webseiten-Relaunch durchgeführt haben, lohnt es sich, sich mit Ihrer Agentur abzustimmen, wie diese Ihre Webseite oder Ihren Online-Shop sparsam, aber dennoch effektiv barrierefrei machen kann.
Barrierefrei – bei ECONSOR Standard
Wir als Internetagentur programmieren standardmäßig barrierefrei, da wir uns für sämtliche Projekte an den Vorgaben von Google orientieren, die für Ihren Crawler eine barrierefreie Darstellung zwingend benötigen. Konkret: Wir beachten die Standards „AA“ oder „AA+“ der WCAG 2.0-Richtlinien der Europäischen Union.
Erweiternd könnte man noch die Kriterien des BIENE-Awards der Aktion Mensch abgleichen – aber in den bisherigen Projekten haben sich die o. g. WCAG-Anforderungen bis dato als ausreichend erwiesen. Auch im Hinblick auf Responsive Webdesign passen wir Ihre Webseite an, vom kleinen Handy bis zum großen Monitor.
Kompetenzgewinn durch barrierefreies Webdesign
Kompetenz in Kommunikation und Technik – dazu zählt barrierefreies Webdesign wie auch die Zugänglichkeit Ihrer Webseite. Ihre Inhalte müssen den Fokus auf Usability und Accessibility legen. Dann sind alle Menschen in der Lage, Ihr Angebot uneingeschränkt zu nutzen.
Barrierefreiheit – was müssen Sie beachten?
Das Internet soll prinzipiell allen Menschen zugänglich sein, unabhängig von soziodemografischen Merkmalen. Als barrierefrei gelten Webseiten laut BITV, die unabhängig von körperlichen oder geistigen Einschränkungen der Nutzer, Informationen so aufbereitet haben, dass deren Verarbeitung allen Nutzern uneingeschränkt möglich ist.
Beispielsweise können Nutzer mit einer Sehbehinderung Texte schlecht lesen, wenn die Schrift sich farblich kaum vom Hintergrund abheben oder ein viel zu kleine Schriftart gewählt wurde. Weiterhin können gehörlose oder schwerhörige Besucher Videos ohne Untertitel nicht nutzen und Blinde können die komplette Webseite nicht nutzen, wenn Bildern, Formularen oder Buttons keine textliche Beschreibung zugrunde liegt. 7,5 Millionen Menschen in Deutschland haben eine anerkannte Schwerbehinderung. Sie nutzen das Internet überdurchschnittlich intensiv und bilden eine besonders relevante Gruppe von Online-Kunden. Für ihren Zugang verwenden sie zum Beispiel reine Tastatursteuerung, Braille-Zeilen, Sprachausgabe oder Joysticks. Eine barrierefreie Webseite, die sich an den Anforderungen der BITV orientiert, ist darauf abgestimmt.
Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Checkliste zur Barrierefreiheit
Wir haben eine Checkliste für Sie erstellt, um all diesen Zielgruppen eine problemlose Nutzung Ihres Internetauftrittes zu gewährleisten.
Mit diesen 9 Tipps erreicht Ihr Online-Auftritt mehr Menschen aus Ihrer Zielgruppe:
1. Ermöglichen Sie eine einfache Bedienung
Achten Sie darauf, dass Ihre Bedienoberfläche mit Touchscreen, Maus und Tastatur nutzbar ist. Zusätzlich muss Ihr Auftritt auf allen verschiedenen Gerätetypen (Tablet, Handy, Desktop) bedienbar sein. Um Ihren Nutzern eine einfache Bedienung zu ermöglichen, beziehen Sie alle Standards für Tastenkombinationen und Tab-Navigation mit in die barrierefreie Anpassung ein. Benennen Sie außerdem alle Bedienelemente korrekt.
Bei Formularen stoßen einige Nutzer an Ihre Grenzen. Hier ist eine barrierefreie Bedienung besonders wichtig, damit Ihnen kein Kauf und keine Anfrage entgeht. Ordnen Sie die Namen und Eingabefelder richtig zu, um Ihre Formulare jedem zugänglich zu machen.
2. Strukturieren Sie Ihre Webseite übersichtlich und intuitiv
Gestalten Sie Ihre Webseite linear und logisch. Je klarer und eindeutiger Ihre Struktur und Navigation, desto leichter findet sich Ihr Nutzer auf Ihrer Seite zurecht. Nur wenn Ihre Webseite linear aufgebaut ist, haben Nutzer des Screenreaders leichten Zugang zu Ihrem Webangebot. Zu einer guten Webseiten-Struktur gehört auch, dass die Überschriften H1 bis H6 richtig gesetzt sind. Wichtig dabei ist, dass es nur eine Hauptüberschrift gibt, die als H1-Überschrift definiert werden muss. Auf diese Überschrift folgen anschließend H2- bis H6-Überschriften. Tabellen stellen für diese Nutzer eine Herausforderung dar, da der Screenreader diese nur sehr schlecht auslesen kann. Schließen Sie niemanden von der Nutzung Ihrer Webseite aus, indem Sie auf Frames und Tabellen verzichten oder nur sehr reduziert einsetzen.
3. Geben Sie Acht bei der Auswahl von Schriftgrößen und Kontrasten
Personen mit einer Sehschwäche können Ihre Inhalte nur aufnehmen, wenn eine ausreichend große Schriftgröße verwendet wird. Auch hohe Kontraste tragen zu einer guten Lesbarkeit bei. Wir empfehlen Ihnen, wichtige Elemente mithilfe von Symbolen und Sonderzeichen hervorzuheben und hier nicht nur auf die Verwendung von Farben zu setzen. Zusätzlich sollten Sie in Betracht ziehen, gut sichtbare Schaltflächen zu integrieren, die einen besseren Farbkontrast bieten und die Schriftgrößen anpassbar machen, um sicherzustellen, dass Ihre Inhalte für Menschen mit unterschiedlichen Sehbedürfnissen zugänglich sind. Dies erhöht die Nutzerfreundlichkeit Ihrer Website oder Anwendung erheblich.
Einstellung von Kontrast und Schrift am Beispiel vhs-bw.de
4. Bieten Sie eine zoomfähige Oberfläche
Einige Nutzer Ihres Webangebots können nicht alle Inhalte erkennen. Geben Sie diesen Personen die Möglichkeit, auf Ihrer Webseite zu zoomen. So kann jeder Nutzer die für ihn passende Größe Ihres Inhalts wählen.
Tipp
Unsere Empfehlung: Ermöglichen Sie es Ihren Nutzern bis zu 200 % auf Ihrem Onlineauftritt zu zoomen.
5. Geben Sie Alternativtexte für Grafiken ein
Eine barrierefreie Webseite benötigt keine Grafiken oder Bilder. Wenn Sie dennoch visuelle Elemente verwenden um Ihren Webauftritt aufzuwerten, bieten Sie unbedingt Alternativen in Form von Texten an. Je nach System können Sie diese Bildbeschreibungen ganz einfach beim Einfügen der Grafik oder des Bildes einfügen. Hinterlegen Sie hier Bildaussage und -inhalt. Für einen barrierefreien Webauftritt sollten Sie auf Hintergrundgrafiken weitestgehend verzichten. Diese erschweren Screenreader-Nutzern das Lesen Ihrer Webseite erheblich.
Definierte Alt-Tags am Beispiel db-anwaelte.de
6. Verwenden Sie einfache Sprache für Ihre Texte
Die Bereitstellung von Texten in einfacher Sprache ermöglicht die Zugänglichkeit Ihrer Inhalte für alle Menschen. Hier haben Sie zwei Möglichkeiten, dies umzusetzen:
- Formulieren Sie Ihren ganzen Internetauftritt in einfacher, leicht verständlicher Sprache
- Bieten Sie eine Version Ihrer Seite, die in einfacher Sprache geschrieben ist
Nutzen Sie für Texte in einfacher Sprache kurze Sätze und einen simplen Satzbau. Erklären Sie zusätzlich Fachbegriffe und verzichten größtenteils auf die Nutzung von Fremdwörtern.
Einfache Sprache am Beispiel mlr.baden-wuerttemberg.de
7. Wählen Sie ein passendes Farbschema
Die Farbe ist ein sehr wichtiger Faktor, wenn es um barrierefreie Webseiten geht. Alle Inhalte auf Ihrer Seite müssen deutlich lesbar sein. Darum müssen Farben kontrastreich sein. Zudem sollen Sie einladend auf den Seitenbesucher wirken.
Oliver Wehle, Teamleiter UI/UX unserer Webdesign-Agentur in Stuttgart
Nicht jede Person kann alle Farben sehen. Vermeiden Sie zwingend die Kombination von Rot- und Grüntönen in Text und Hintergrund. So ermöglichen Sie auch Personen mit Rot-Grün-Schwäche, Ihre Webseite zu lesen und mit Ihnen in Kontakt zu treten.
8. Bieten Sie Alternativen zu Multimedia- und Audiodateien
Beachten Sie, dass manche Personen aufgrund von Einschränkungen Ihre Multimedia-Inhalte nicht sehen oder hören. Stellen Sie aus diesem Grund alternative Texte für diese Nutzer bereit, die den Inhalt Ihrer multimedialen Elemente wiedergeben. Auch synchronisierte Untertitel (im Format SMIL) machen Ihren Webauftritt barrierefrei. Der Screenreader erfasst so Ihre Inhalte korrekt und kann diese an Ihre Nutzer übermitteln.
9. Optimieren Sie Links und Buttons
Links sollen leicht von anderen Inhalten zu unterscheiden sein. Gestalten Sie Ihre Buttons und alle klickbaren Links ausreichend groß. So garantieren Sie, dass jede Personengruppe diese anklicken kann. Achten Sie auch darauf, dass alle klickbaren Elemente mit der Tastatur steuerbar sind. So verlieren Sie keinen potenziellen Kunden.
Warum eine barrierefreie Webseite? 5 überzeugende Gründe:
Grund 1: Sie möchten mehr Kunden erreichen
Durch eine barrierefreie Webseite erreichen Sie mehr Menschen und somit eine weiter gefächerte Zielgruppe. Und in einer Gesellschaft, die immer bunter und auch älter wird, müssen Sie sich für Ihre potenziellen Kunden auch breiter aufstellen. Nur so ist zukünftig eine erfolgreiche Kommunikation möglich.
Grund 2: Sie wollen zufriedenere Kunden
Usability – die Benutzerfreundlichkeit – ist maßgeblich für den Erfolg Ihrer Webseite oder Ihres Online-Shops. Wenn Ihre Inhalte nur schwer zugänglich sind und Ihre Inhalte nicht eindeutig strukturiert sind, der Nutzer also verwirrt ist, wenn er sich bei Ihnen zurechtfinden möchte, dann generieren Sie Unzufriedenheit. Achten Sie auf eine durchgängige Usability, die eine gute Bedienbarkeit für alle Ihre Nutzer garantiert und bedenken Sie, dass ein barrierefreier Auftritt letztendlich für 100 Prozent Ihrer Nutzer hilfreich ist.
Grund 3: Ihre Reichweite ist zu gering
Google und andere Suchmaschinen belohnen Sie für eine barrierefreie Webseite, indem sie besser rankt. Denn die Kriterien hinsichtlich UX/UI, die Google an Ihre Seite oder Ihren Shop anlegen, entsprechen in großen Teilen den Kriterien Zugänglichkeit und Barrierefreiheit. Mit der Einhaltung dieser Kriterien erhöhen Sie Ihr Ranking und somit Ihre Sichtbarkeit. Das wirkt sich positiv auf Ihre Reichweite aus.
Grund 4: Nehmen Sie eine Vorreiterstellung ein
Der Ruf nach Barrierefreiheit im Web wird immer lauter und findet immer mehr Aufmerksamkeit und Anspruch in gesetzlichen Anforderungen. Wenn Ihre Webseite oder Ihr Online-Shop über eine barrierefreie User Experience verfügt, kommunizieren Sie dies und geben Sie bekannt, wie erfolgreich Sie damit sind. Noch dazu zeigen Sie mit Ihrem barrierefreien Online-Auftritt soziale Verantwortung. Erreichen Sie mit Ihrer Webseite oder Ihrem Online-Shop Nutzer mit und ohne Behinderung!
Grund 5: Pushen Sie digitale Teilnahme
Wirtschaftlichkeit und soziales Engagement widersprechen sich nicht. Sie gewinnen sogar auf beiden Seiten. Sie erreichen mit Ihrem barrierefreien Webauftritt Menschen mit wie auch ohne Behinderung und tragen zu digitaler Teilhabe bei. Wir als Webdesign-Agentur empfehlen Ihnen, Ihre Webseite hinsichtlich Barrierefreiheit zu optimieren!
Assistive Technologien für Menschen mit Behinderung
Es gibt verschiedene Technologien, die es Menschen mit Einschränkungen überhaupt erst ermöglichen das Internet richtig benutzen zu können. So können sich blinde Menschen beispielsweise über Screenreader den gesamten Inhalt einer Webseite (Texte, Grafiken, …) vorlesen lassen. Die Soundausgabe erfolgt über Lautsprecher oder Kopfhörer. Allerdings funktioniert speziell diese Technologie nur richtig, wenn Ihre Webseite so programmiert wurde, dass der Screenreader die Seitenstruktur Ihrer Webseite erkennt.
Sie sehen also, dass Barrierefreiheit nicht nur die Optik Ihrer Webseite umfasst. Nur wenn Webseiten vollständig barrierefrei sind, können Menschen mit Einschränkungen das Internet problemfrei benutzen.
Barrierefreiheit als unverzichtbarer Bestandteil Ihres Webauftrittes
Heutzutage geht nichts mehr ohne Barrierefreiheit – so auch im Web. Inhalte müssen für alle Zielgruppen – egal ob mit oder ohne Einschränkungen – zugänglich sein und eine gute Bedienbarkeit und Verständlichkeit aufweisen. Zudem darf niemand von der Nutzung einer Webseite oder eines Online-Shops ausgeschlossen sein. Auch in Zukunft wird die Barrierefreiheit eine große Rolle spielen. Wir bei ECONSOR liefern Ihnen garantiert barrierefreie Internetseiten mit WordPress und TYPO3 und barrierefreie Online-Shops mit Shopware und Magento.
Beitrag kommentieren
Wir freuen uns auf Ihr Feedback!