Direkt zum Inhalt
ovau-logo-b

5 einfache Tests zur Barrierefreiheit ihrer Hotel-Website Fangen Sie noch heute an und prüfen sie, wie barrierefrei ihre Website ist.

Es ist – zugegeben – nicht immer ganz einfach, die Regeln der Barrierefreiheit im Web zu verstehen. Mit den folgenden Tipps können sie aber ganz einfach testen, wie weit ihre Website schon barrierefrei ist.

  1. Tastaturbedienung

    Besuchen sie ihre Website und versuchen sie dann, ohne Maus, nur mit ihrer Tab-Taste zu navigieren. Die Tab-Taste ist auf der Tastatur ganz links in der dritten Reihe. Sie enthält als Symbol einen Pfeil nach rechts mit einer senkrechten Linie vor der Pfeilspitze: ⇥. Normalerweise wird sie genutzt, um Texte einzurücken. Sie können damit aber auch von Link zu Link oder Button oder Formularfeld gelangen. Haben sie Schwierigkeiten, Links, Buttons oder Formularfelder auf ihrer Website zu erreichen? Dann schreiben sie auf, welche das sind.

  2. Sichtbarer Tastaturfokus

    Vielleicht sind sie sich nicht ganz sicher, auf welchem Element sie mit der Tab-Taste gerade sind. Dann kann es sein, dass ihre Website keine Kennzeichnung des Tastatur-Fokus besitzt. Das ist eine optische Hervorhebung des Elementes, das sie gerade mit der Tab-Taste angesteuert haben. Der Zustand ist vergleichbar mit dem „hovern“ des Mauszeigers über einem Link oder Button. Haben sie das Gefühl, dass der Tastatur-Fokus auf ihrer Website nur schlecht oder gar nicht zu sehen ist? Dann schreiben sie sich die Elemente auf. Machen sie jeweils einen Screenshot der Elemente mit und ohne Fokus.

  3. Ausreichend Kontrast

    Schauen sie sich ihre Website genauer an. Gibt es dort sehr hellen Text, den sie kaum lesen können? Gibt es sehr kleine Schrift? Steht bei ihnen die Schrift über einem Foto oder einer Illustration? Machen sie auch hier Fotos dieser Stellen.

  4. Alternativtexte

    Haben sie Zugang zum Backend ihrer Website? Dann schauen sie sich doch mal ihre Bilder dort genauer an. Es gibt zu jedem Bild ein Textfeld, in das sie einen sogenannten Alternativtext eingeben können. Jedes Content-Management-System löst das ein wenig anders, aber es gibt dieses Feld sicher auch bei ihnen. Ist das Feld leer? Dann können sie sofort etwas tun: Schreiben sie eine kurze Bildbeschreibung zu den Bildern, die ihnen wichtig sind – also zum Beispiel zu Bildern ihres Hotels, zu den Zimmern und den Aussenanlagen. Schreiben sie nicht mehr als zwei oder drei kurze Sätze. Es geht nicht um Einzelheiten sondern um das, was ihnen auf diesem Bild wichtig ist. Ein Beispiel: Sie haben Zimmer mit Meerblick. Dann erwähnen sie auf jeden Fall das Fenster mit Blick auf das Meer.

  5. Vergrößerung

    Vergrößern sie die Ansicht ihrer Website auf dem Bildschirm ihres Desktop-PCs. Sie können dazu in ihrem Edge-Browser einfach die Taste „Ctrl“ drücken und dazu jeweils die „+“ oder „-“-Taste einmal oder mehrmals. Andere Browser haben ähnliche Kurzbefehle. Ihre Website vergrößert sich dann (bei +) oder verkleinert sich (bei -). Achten sie auf das Layout ihrer Website. Ist Text verdeckt? Sind große Teile des Inhalts z.B. durch eine angeheftete Navigation verdeckt? Oder wird alles einwandfrei dargestellt? Je nach Vergrößerung – und sie sollten da schon auf bis zu 200% gehen – wird ihre Website in der Mobilansicht dargestellt. Das ist ein gutes Zeichen, denn dann ist sie responsiv und passt sich der Bildschirmgröße an.

Haben sie alle Ergebnisse notiert? Prima, dann fassen sie alles in einem Word- oder einem anderen Text-Dokument zusammen. Schicken sie diese Liste an ihre Webagentur, ihre Webdesignernin oder ihren Webdesigner. Sagen sie, dass sie Barrieren auf ihrer Website entdeckt haben und folgende Punkte umgesetzt haben möchten (nicht zutreffendes bitte streichen):

  • Alle Links, Formularfelder und Buttons sollen mit der Tastatur bedienbar sein
  • Der Fokus-Zustand aller interaktiven Elemente soll gut sichtbar sein, wenn sie mit der Tastatur angesteuert werden.
  • Text bis zu einer Größe von 18px soll immer einen guten Kontrast zum Hintergrund von mindestens 4.5:1 haben (auch vor Bildern). Bei größerem Text reicht ein Kontrast von 3:1 aus.
  • Alle inhaltlich wichtigen Bilder auf ihrer Website sollen einen Alternativtext haben. Auch alle Icons mit Links oder Funktion, die kein Textlabel haben, sollen einen aussagekräftigen Alternativtext bekommen.
  • Bei starken Vergrößerungen dürfen keine Texte oder Navigationselemente von anderen Elementen verdeckt werden. Es darf kein Text abgeschnitten werden.

Gratuliere jetzt haben Sie schon viel erreicht! Zur vollständigen Erfüllung der Vorgaben des neuen Barrierefreiheitsstärkungsgesetzes ist zwar noch ein wenig mehr nötig, aber sie sind einen großen Schritt weitergekommen und haben damit begonnen, ihre Website für alle Menschen zugänglich zu machen!