In der Realität gibt es viele barrierefreie Infrastrukturen wie Aufzüge, Rollstuhlrampen oder spezielle Bodenmarkierungen für Sehbehinderte, um unsere Gesellschaft für alle Menschen integrativer zu machen.
Inhaltsverzeichnis
Wenn es jedoch um die digitale Welt geht, ist Barrierefreiheit oft noch ein Thema, das von vielen ignoriert wird. Aber wie das Übereinkommen der Vereinten Nationen über die Rechte von Menschen mit Behinderungen besagt, hat jeder Mensch das Recht, gleiche Rechte und Grundfreiheiten zu genießen. Die digitale Barrierefreiheit umfasst mehrere Themen. Vom Code über das Design bis hin zur Erstellung von Inhalten. Deshalb zeigen wir dir, wie du digital inklusiver werden und Webinhalte erstellen kannst, die Barrierefreiheit für alle gewährleisten.
Einhaltung der Vorschriften über barrierefreie Webinhalte
Um einen gleichberechtigten Zugang zu digitalen Informationen zu gewährleisten, haben der Americans with Disabilities Act (ADA) und der European Accessibility Act (EAA) bereits einige Richtlinien für die Erstellung barrierefreier Inhalte aufgestellt.
Da viele Länder auch ihre eigenen Regeln und Vorschriften haben, kann es schwierig sein zu verstehen, wie du das Richtige tust, um deine Website barrierefreier zu machen. Deshalb gibt es die Barrierefreiheitsrichtlinien für Webinhalte (WCAG). Diese Richtlinien sind heute ein wichtiger Standard für Websites, Dokumente und Software.
Wir sind jedoch der Meinung, dass diese Leitlinien für die Barrierefreiheit von Websites als das absolute Minimum betrachtet werden sollten, das für Menschen mit Behinderungen getan werden kann. Man kann die Barrierefreiheit in drei Kategorien einteilen:
- A (gering)
- AA (mittel)
- AAA (hoch)
Obwohl AAA immer das Ziel sein sollte, ist AA in der Regel erreichbar, aber A ist einfach zu wenig, um als barrierefrei bezeichnet zu werden. Schließlich geht es nicht nur um Rechtssicherheit, sondern auch um die Schaffung eines inklusiven digitalen Raums, in dem jeder die Inhalte auf die gleiche Weise genießen kann. Und du kannst dadurch ein größeres Zielpublikum gewinnen.
Die vier Grundsätze für barrierefreie Webinhalte
Der Leitfaden für die Barrierefreiheit von Webinhalten besteht aus 13 präzisen Leitlinien und vier Grundsätzen, die du bei der Erstellung von Inhalten immer im Hinterkopf behalten solltest. Wenn du diese Grundsätze befolgst, wirst du mit Sicherheit in der Lage sein, barrierefreie Inhalte und ein barrierefreies Design deiner Website zu erstellen.
1. Erkennbar
Dieser Grundsatz besagt, dass Informationen und Benutzeroberflächen so gestaltet sein sollten, dass sie von allen Benutzern unabhängig von ihren Einschränkungen wahrgenommen werden können. Dazu gehört auch die Bereitstellung von Alternativen für nicht-textliche Inhalte wie Bilder, Videos oder Audiodateien, damit auch Nutzer mit Sehbehinderungen oder anderen Einschränkungen die Inhalte wahrnehmen können.
2. Bedienbar
Dies bezieht sich darauf, dass die Nutzer in der Lage sein sollten, die Benutzeroberfläche und die Navigation der Website zu bedienen, unabhängig von der Art ihrer Behinderung oder den von ihnen verwendeten Geräten. Dazu gehören Funktionen wie Tastaturnavigation, ausreichend große Klickflächen für Nutzer mit motorischen Beeinträchtigungen und vermeidbare oder anpassbare Zeitlimits für Nutzer mit kognitiven Beeinträchtigungen.
3. Verständlich
Dieser Grundsatz besagt, dass Webinhalte klar und verständlich sein sollten, damit alle Nutzer, auch diejenigen mit kognitiven oder sprachlichen Einschränkungen, den Inhalt leicht erfassen können. Dazu gehören die Verwendung einer klaren und einfachen Sprache, eine einheitliche Navigation und ein einheitliches Layout sowie die Bereitstellung von Hilfe und Erklärungen bei Bedarf.
4. Robust
Webinhalte sollten so robust sein, dass sie von einer Vielzahl von Benutzer-Agenten, einschließlich assistiver Technologien, interpretiert und verarbeitet werden können. Das bedeutet, dass die Website in verschiedenen Browsern und auf verschiedenen Geräten korrekt funktionieren sollte und keine technischen Barrieren für Nutzer mit Behinderungen aufweisen sollte.
7 Tipps für barrierefreie Webinhalte
Eine gut zugängliche Website zeichnet sich durch ein besonders nutzerzentriertes, klares und einfaches Design aus und erfüllt die verschiedenen Anforderungen von Menschen mit Behinderungen. Die Sicherstellung bestimmter Standards für die Zugänglichkeit von Webinhalten bietet für dich eine ganze Reihe von Vorteilen:
- größere Sichtbarkeit und Reichweite, da mehr Menschen dein Angebot nutzen können
- positive Benutzererfahrung für alle Nutzer
- bessere Chancen auf hohe Platzierungen in den SERPs
- höhere Kundenzufriedenheit
- mehr Conversions und Umsatzsteigerungen
- Rechtssicherheit durch Übereinstimmung mit den geltenden Vorschriften
Um sicherzustellen, dass deine Inhalte für alle geeignet sind, haben wir hier einige unserer besten Tipps zusammengestellt. So kannst du gemäß den Richtlinien für die Barrierefreiheit von Webinhalten integrativere Inhalte erstellen. Und keine Sorge, in der digitalen Welt gibt es noch keine 100%ige Barrierefreiheit. Aber es geht darum, sich Mühe zu geben und das Beste daraus zu machen.
Intuitive Struktur und Navigation
Intuitive Struktur und Navigation bedeutet, dass die Website so aufgebaut ist, dass die Nutzer leicht erkennen können, wo sie sich befinden und wie sie zu den gewünschten Inhalten gelangen. Dazu gehören die Verwendung klarer Menüs, eine einheitliche Seitenstruktur und gut platzierte Navigationslinks. Andere Navigationselemente sind klar erkennbar und leicht zugänglich.
Eine klare Hierarchie der Überschriften (z. B. H1, H2, H3 usw.) und eine logische Anordnung des Inhalts erleichtern die Navigation. Dazu gehören Elemente wie Aufzählungspunkte, Tabellen oder Infografiken. Dadurch wird sichergestellt, dass sich die Nutzer auf der Website zurechtfinden, insbesondere diejenigen, die Bildschirmlesegeräte verwenden.
Klare, einfache Sprache
Die Verwendung einer klaren und einfachen Sprache ist entscheidend, um sicherzustellen, dass alle Nutzer den Inhalt der Website leicht verstehen können. Dazu gehört, dass komplexe Fachbegriffe, Jargon und unnötig komplizierte Formulierungen vermieden werden. Stattdessen sollte der Text klar, prägnant und leicht verständlich sein, damit Nutzer mit unterschiedlichen sprachlichen Fähigkeiten den Inhalt leicht erfassen können.
Denke auch daran, kürzere Sätze und einen einfachen Wortschatz zu verwenden. Du willst immer sicherstellen, dass Kinder oder Fremdsprachige deinen schriftlichen Inhalt verstehen können.
Barrierefreie Überschriften und Links
Barrierefreie Überschriften und Links beinhalten die Verwendung von aussagekräftigem und beschreibendem Text für Überschriften und Links, sodass Benutzer mit Bildschirmlesegeräten oder anderen unterstützenden Technologien leicht verstehen können, wohin die Links führen. Oder welchen Abschnitt der Seite sie darstellen.
Links sollten selbsterklärend sein, d. h., auch wenn sie aus dem Zusammenhang gerissen sind, sollten sie für den Besucher noch einen Sinn ergeben. Texte wie “hier klicken” sind das Gegenteil davon. Es gibt Benutzer, die ihre Hilfsmittel darum bitten, ihnen eine Linkliste zu geben. Wenn die Mehrzahl der Links “hier klicken” heißt, ergibt das keinen Sinn. Und nicht zu vergessen: Google ist blind, d. h. nicht beschreibende Linktexte sind auch eine verpasste SEO-Chance.
Achte darauf, dass deine Inhalte in der richtigen Reihenfolge gekennzeichnet sind, damit die Hierarchie einen Sinn ergibt und die Bedeutung des Textes verstärkt wird. Dies verbessert die Navigation und macht es Nutzern mit Sehbehinderungen leichter, den Inhalt der Website zu verstehen und zu navigieren und der Botschaft zu folgen.
ALT-Texte für Bilder
Wie du wahrscheinlich weißt, sind alternative Texte (ALT-Texte) für Bilder kurze Beschreibungen, die in den HTML-Code eingefügt werden, um den Inhalt und die Funktion von Bildern zu beschreiben. Diese Texte werden von Bildschirmleseprogrammen verwendet, um Nutzern mit Sehbehinderungen den Inhalt von Bildern zu vermitteln.
Es ist wichtig, dass deine ALT-Texte wirklich die Bedeutung des Bildes vermitteln. Sie sollten aber auch nicht zu lang sein und schon gar nicht die Worte “Bild von” enthalten. Durch aussagekräftige ALT-Texte können alle Nutzer den Inhalt der Bilder erfassen, unabhängig von ihrer Fähigkeit, die Bilder visuell wahrzunehmen.
Transkripte für Audio- und Videoinhalte
Transkripte sind schriftliche Versionen von Audio- und Videoinhalten, die den gesprochenen Inhalt wiedergeben. Sie sind für Nutzer mit Hörbehinderungen von entscheidender Bedeutung, da sie den Inhalt des Audio- oder Videoinhalts durch das Lesen der Abschrift verstehen können. Die Bereitstellung von Transkripten verbessert auch die Auffindbarkeit von Inhalten über Suchmaschinen und ermöglicht es Nutzern, die Inhalte in Umgebungen zu konsumieren, in denen Audio nicht geeignet ist.
Wenn es um Videoinhalte geht, solltest du auch Closed Captions verwenden. Dabei handelt es sich um die schriftliche Wiedergabe von Medieninhalten, die parallel zu den gezeigten Inhalten abgespielt wird. In der Annahme, dass die Zuschauer keine Elemente einer Tonspur wahrnehmen können, werden auch die Soundeffekte niedergeschrieben. Closed Captions werden normalerweise als Untertitel am unteren Rand des Videobildschirms angezeigt und können je nach den Präferenzen des Nutzers ein- oder ausgeschaltet werden. Die Bereitstellung von Untertiteln hat mehrere Vorteile:
- Sie werden von Google indexiert
- Die Benutzer können sie nach Belieben ein- und ausschalten und auch ihre Größe wählen
- Die meisten Softwareprogramme, die Untertitel erzeugen können, erzeugen auch das Transkript
Bereitstellung barrierefreier Dokumente
Bei barrierefreien Dokumenten handelt es sich um elektronische Dokumente wie PDF- oder Word-Dokumente, die so gestaltet sind, dass sie von Nutzern mit verschiedenen Behinderungen verwendet werden können.
Dazu gehören die Verwendung strukturierter Dokumente, eine klare Formatierung und ALT-Texte für nichttextliche Inhalte innerhalb der Dokumente. Genau wie bei den Inhalten deiner Website solltest du auch Elemente wie Überschriften und Zwischenüberschriften einbeziehen, du solltest eine klare und einfache Sprache verwenden und du könntest auch ein Inhaltsverzeichnis erstellen.
Bei barrierefreien Formularen musst du vor allem darauf achten, dass die Eingabefelder richtig beschriftet sind. Insbesondere Platzhaltertexte können bei Menschen mit Beeinträchtigungen, die Bildschirmlesegeräte verwenden, für Verwirrung sorgen, weshalb korrekte Beschriftungen äußerst wichtig sind.
Versuche auch, alle Schritte des Formulars klar zu kommunizieren. Gib klare Anweisungen, was zu tun ist, wie es zu tun ist und wie viele Schritte zum Ausfüllen des Formulars erforderlich sind. Wenn Informationen falsch eingegeben wurden, kommuniziere die Fehler so einfach und klar wie möglich.
Allerdings sollte das Feedback nicht nur negativ sein. Positives Feedback ist ein wichtiger Bestandteil einer guten Kommunikation. Gib daher klare Hinweise, wenn alles gut gelaufen ist. Jeder Erfolg beim Ausfüllen eines Formulars sollte erwähnt werden, um Orientierung zu geben. Und vergiss nicht, nach dem korrekten Ausfüllen des Formulars eine Erfolgsnachricht zu geben.
Kontrastreiche Farbpalette
Eine kontrastreiche Farbpalette bezieht sich auf die Verwendung von Farbkombinationen mit ausreichendem Kontrast zwischen Text und Hintergrund, um die Lesbarkeit für Nutzer mit Sehbehinderungen zu verbessern. Ein ausreichender Kontrast sorgt dafür, dass der Text deutlich sichtbar ist und sich leicht vom Hintergrund abhebt, was für Nutzer mit Sehbehinderungen besonders wichtig ist.
Verzichte jedoch auf einen zu hohen Kontrast. Beachte auch, dass für manche Menschen, insbesondere für Legastheniker, ein sehr kontrastreiches Farbschema das Lesen erschweren kann. Um das Lesen auf dem Bildschirm zu erleichtern, ist es eine gute Idee, statt eines weißen Hintergrunds cremefarben zu wählen. Oder einen dunkelgrauen Text auf weißem Hintergrund anstelle eines rein schwarzen Textes.
Teste deine Website, um die Barrierefreiheit zu gewährleisten
Um barrierefreie Inhalte auf deiner Website zu erstellen, kannst du einige praktische Tools verwenden und auch einige Tests durchführen, um die Barrierefreiheit zu prüfen. Manuelle Tests umfassen:
- Kontrolle der Website mit der Tastatur. So kannst du sicherstellen, dass alle Funktionen und Inhalte mit der Tastatur barrierefrei sind, ohne auf die Maus angewiesen zu sein.
- Vergewissere dich, dass der Kontrast zwischen Text und Hintergrund ausreichend ist, und prüfe die Lesbarkeit von Text und Schrift.
- Achte darauf, dass die Navigation logisch und einheitlich ist und dass alle Links und Schaltflächen deutlich beschriftet sind.
- Prüfe deine Website mit einem Bildschirmleseprogramm, um sicherzustellen, dass alle Inhalte korrekt vorgelesen werden und dass für Bilder ein angemessener ALT-Text verfügbar ist.
- Wirf einen Blick auf die Core Web Vitals. Sie messen das allgemeine Nutzererlebnis auf deiner Website und berücksichtigen auch, wie barrierefrei sie für Nutzer mit Behinderungen ist. Generell solltest du bedenken, dass Barrierefreiheit eine wichtige Kennzahl für das Ranking deiner Website in den Suchmaschinen ist.
- Der wichtigste Weg, deine Website auf Barrierefreiheit zu testen, ist die Zusammenarbeit mit behinderten Menschen. Sie wissen in der Regel am besten, was für ihre Inklusion wichtig ist, wenn es um digitale Inhalte geht.
Um sicherzustellen, dass deine Inhalte von Anfang an für jeden Benutzer mit oder ohne Beeinträchtigung verfügbar sind, haben wir von Greyd ständig daran gearbeitet, ein immer barrierefreieres Erlebnis zu ermöglichen. Da Greyd sicherstellt, dass die gesamte Code-Ausgabe in Bezug auf die Barrierefreiheit passt, kannst du dich also zu 100 % auf die Erstellung von barrierefreiem Design und Inhalt konzentrieren.
Wenn du mit der Greyd.Suite arbeitest, erhältst du ein barrierefreies Werkzeug, das dir Blöcke mit geeignetem semantischem HTML und möglichst barrierefreie Themes zur Verfügung stellt. Egal, ob du Popups, Dropdowns oder klickbare Boxen mit Inhalt einbauen willst. Es gibt keine Probleme mehr mit bestimmten Elementen und deren Barrierefreiheit auf deiner Website.
Wenn du daran interessiert bist, mehr über die Barrierefreiheit deiner WordPress-Website mit Greyd zu erfahren und die Funktionen aus erster Hand auszuprobieren, kannst du gerne eine Demo mit einem unserer Experten buchen.
