Barrierefreiheit: Den Wizard für Barrierefreiheit verwenden

Fokusindikatoren sind blaue Rahmen, die um interaktive Elemente herum angezeigt werden (wie zum Beispiel Buttons oder Links), wenn Besucher für die Navigation auf der Website die Tastatur verwenden.

Sie ermöglichen es deinen Besuchern zu sehen, wo auf deiner Website sie sich gerade befinden – das macht sie entscheidend für die Barrierefreiheit deiner Website. Erfahre mehr über Fokusindikatoren.

„Weiter zu den Hauptinhalten“ ist eine Funktion, die es Besuchern ermöglicht, die Tastaturnavigation zu verwenden, um die obersten Abschnitte einer Website (z. B. Menüs und Seitenüberschriften) zu umgehen und direkt zum Hauptinhalt der Seite zu springen. 

„Weiter zu den Hauptinhalten“-Links sind ein wichtiger Teil der Barrierefreiheit einer Website, da sie Besuchern einen schnellen Zugriff auf die benötigten Informationen bieten. Erfahre mehr über „Weiter zu den Hauptinhalten“.

Wenn du die Hauptsprache der Website festlegst, erhalten unterstützende Technologien die Informationen, die sie benötigen, um den Inhalt genau darzustellen. Das funktioniert, indem: 

Daher ist es wichtig, die Hauptsprache der Website festzulegen. So ist dafür gesorgt, dass Besucher, die diese Technologien verwenden, das bestmögliche Benutzererlebnis haben.

Wenn du deiner Website Wix Multilingual hinzugefügt hast, kann die bei der Einrichtung ausgewählte Hauptsprache nicht geändert werden.

Du kannst jedoch Folgendes tun:

Die DOM Order (Document Object Model) einer Website bestimmt die „Lesereihenfolge“ der Elemente auf der Seite.

Einige Website-Besucher verwenden Screenreader und andere unterstützende Technologien, um auf einer Website zu navigieren.

Screenreader scannen beispielsweise den Inhalt der Website und „lesen“ ihn dem Besucher vor. Diese Besucher sowie Besucher mit Einschränkungen hinsichtlich der Mobilität können auch die Tabulator-Taste verwenden, um durch Website-Inhalte zu navigieren. 

Die Organisation der DOM Order einer Website ist wichtig für die Barrierefreiheit. Damit wird sichergestellt, dass Besucher, die assistive und ergänzende Technologien verwenden, die Websites in logischer Reihenfolge durchsuchen und navigieren können. Erfahre mehr über DOM Order und Barrierefreiheit.

Das Title-Tag einer Seite ist der Titel, den Suchmaschinen normalerweise für die Seite in den Suchergebnissen anzeigen. Er wird von dem Namen übernommen, den du der Seite gibst, sowie dem Namen der Website. 

Der Assistent fordert dich auf, den Titel einer Seite zu ändern, wenn das Title-Tag „Neue Seite“ (die Standardeinstellung für neue Seiten, die du einer Website hinzufügst) oder „Kopie von“ (die Standardeinstellung für duplizierte Seiten) enthält.

Seiten Title-Tags liefern Besuchern, die Hilfstechnologien verwenden, wichtige Informationen über den Inhalt der Seite. Um ein hervorragendes Erlebnis zu gewährleisten, sollten die Seitentitel daher folgende Merkmale aufweisen:

Tipp: Passende Title-Tags für deine Website-Seiten sind auch ein wichtiger Teil der SEO deiner Website.

Überschriften-Tags sind Elemente im HTML-Code einer Website, die die Hierarchie/Struktur des Textinhalts auf einer Seite bestimmen. Überschriften-Tags folgen einer Hoch-Niedrig-Reihenfolge, von Überschrift 1 (H1) zu Überschrift 6 (H6) und dann dem Absatztext (P).

Unterstützende Technologien verwenden Überschriften-Tags, um die Reihenfolge des Seiteninhalts herauszufinden. Screenreader lesen zum Beispiel zuerst H1-Inhalte und erst danach Inhalte von H2, H3 usw. 

Daher ist eine genaue Überschriftenstruktur wichtig, da sie Besuchern, die diese Technologien verwenden, ein sinnvolles, logisches Erlebnis ermöglicht.

Du kannst viele Überschriften-Tags im Wizard für Barrierefreiheit anpassen. Einige Elemente sind jedoch derzeit nicht vollständig in den Wizard integriert und müssen manuell angepasst werden. 

Alternativtext (Alt-Text) ist eine Textbeschreibung eines Bildes auf einer Webseite.

Einige Besucher verwenden möglicherweise unterstützende Technologien wie Screenreader, um durch Websites zu navigieren. Diese lesen den Besuchern den Inhalt der Website vor, einschließlich des Alt-Textes. 

Alt-Text ist daher ein wichtiger Bestandteil einer Website. Über ihn bekommen Besucher, die diese Technologien verwenden, Zugang zu diesen Inhalten und verstehen, was das jeweilige Bild enthält. Mehr erfahren über Alt-Text und Barrierefreiheit.

Der Farbkontrast ist ein Maß für den Unterschied in der wahrgenommenen Helligkeit zwischen zwei Farben und wird als Verhältnis im Bereich von 1:1 (kein Kontrast) bis 21:1 (starker Kontrast) wiedergegeben. Ein starker Kontrast sorgt dafür, dass Website-Inhalte gut zu sehen und zu lesen sind.

Das erforderliche Farbkontrastverhältnis hängt von der Art des Elements und dem Level an Web Content Accessibility Guidelines (WCAG)ab, das du erreichen möchtest - AA (die Mindestanforderung), oder AAA (verbessert) an:

Du kannst den Kontrast der meisten Website-Inhalte im Wizard für Barrierefreiheit anpassen. Einige Elemente sind derzeit jedoch nicht vollständig in den Wizard integriert und müssen manuell angepasst werden. Erfahre mehr über das Anpassen des Farbkontrasts.

Hinweis: Für den Wizard für Barrierefreiheit ist derzeit nur das Level AA erforderlich.

Der Assistent identifiziert möglicherweise Elemente und Inhalte auf der Seite, die für Website-Besucher nicht vollständig zugänglich sind. Je nach Elementtyp kannst du es möglicherweise durch eine Alternative aus dem „Elemente hinzufügen“-Panel ersetzen. Wenn keine passenden Optionen verfügbar sind, empfehlen wir, es von der Website zu entfernen.

Einige Website-Besucher haben möglicherweise eine oder mehrere Behinderungen, die ihr Seh- und/oder Hörvermögen beeinträchtigen. Du kannst dafür sorgen, dass Mediendateien barrierefrei sind, indem du Alternativen bereitstellst (z. B. Transkripte und Audiobeschreibungen), um diesen Besuchern zu ermöglichen, auf die Inhalte zuzugreifen, sie zu verstehen und zu nutzen. Erfahre mehr über Alternativen zu Medien.

Text oder Elemente, die auf andere Seiten, Abschnitte oder Websites verlinken, sollten so beschreibend wie möglich sein. So ist zum Beispiel „Mehr über unsere neuesten Studien erfahren“ eindeutiger als „Mehr erfahren“. Es sollte auch klar sein, ob Texte zu einer Aktion führen, z. B. dem Absenden eines Formulars. Informiere dich in den Web Content Accessibility Guidelines (WCAG) über den Zweck von Links.

Informationen, die durch die Farbwahl vermittelt werden, sollten zusätzlich separate Indikatoren haben, wie zum Beispiel Muster, Schriftart und Symbole. Verlinkter Text sollte beispielsweise unterstrichen sein und Grafiken sollten auch Daten mit unterschiedlichen Mustern oder Texturen anzeigen. Informiere dich in den Web Content Accessibility Guidelines (WCAG) über die Verwendung von Farben.

Text auf Bildern (z. B. Fotos von Zeichen oder Slogans) kann von Screenreadern nicht gelesen werden. Wir empfehlen, diese Bilder, wenn möglich, durch echten Text zu ersetzen. 

Wenn der Bildtext ein wichtiger Bestandteil des Website-Inhalts ist oder zur Vermittlung von Informationen dient, füge den Text in die Bildbeschreibung (Alt-Text) ein. Erfahre mehr über Text auf Bildern.

Website-Elemente/-Komponenten sollten auch beim Zoomen im Browser sichtbar sein. Dadurch soll sichergestellt werden, dass Nutzer mit Sehbehinderungen die Website vergrößern und trotzdem den gesamten Inhalt der Seite sehen können. Du kannst dies überprüfen, indem du eine Vorschau der Website anzeigst und den Zoom deines Browsers auf 200 % änderst. Erfahre mehr über herangezoomte Inhalte.

Web-Barrierefreiheit ist in mehreren Ländern eine gesetzliche Anforderung. Auch wenn dies in deiner Region nicht gesetzlich vorgeschrieben ist, empfehlen wir dennoch, die Erklärung hinzuzufügen. Sie zeigt das Engagement der Website oder deiner Kunden, eine Website bereitzustellen, die von allen Besuchern genutzt werden kann. Mehr erfahren über Barrierefreiheitserklärungen.

Es kann auf einer Website Farbkontraste geben, die der Wizard nicht erkennt. Um sicherzustellen, dass der gesamte Website-Inhalt für Besucher deutlich erkennbar und sichtbar ist, empfehlen wir, den Kontrast des Website-Inhalts manuell zu überprüfen und bei Bedarf anzupassen.