Anleitungen zum Erstellen barrierefreier Webseiten

Um die Richtlinien der WCAG zu erfüllen und allen gesetzlichen Verpflichtung hinsichtlich digitaler Barrierefreiheit nachzukommen, sind eine Vielzahl von Dingen auf einer Webseite umzusetzen. Neben den Dokumenteneigenschaften und einer sauberen Seitenstruktur sind hier auch die eingebetteten Einzelelemente wie Bilder, Tabellen, Listen, Links usw. korrekt einzusetzen. Hier ist unter anderem auf korrekte Kontraste und die Tastaturbedienbarkeit zu achten.

Die folgende Liste zeigt eine Reihenfolge von Schritten, welche man durchführen sollte, um technische Barrieren einer Webseite zu entfernen. Die Punkte werden mit kleinen Anleitungen direkt verlinkt, welche weiter unten auf der Seite zu finden sind. Wenn Sie diese Schritte durchgeführt haben, dann werden Sie schnell merken, dass die nächste Seite schon deutlich schneller geht bzw. Sie beim Erstellen neuer Inhalte immer direkt an die barrierefreien Merkmale denken.

Sollten Sie ein CMS für Ihren Webauftritt einsetzen, dann könnten einige grundlegende Fehler meist gleich auf allen bzw. mehreren Unterseiten mit entfernt werden. Wir versuchen, das Thema CMS mit in unsere Anleitungen zu berücksichtigen.

  1. Die Seite benötigt einen Seitentitel.
  2. Für die Seite muss eine Dokumentensprache definiert sein.
  3. ...

Fragen zum Erstellen einer barrierefreien Webseite

Wie gebe ich der Seite eine Seitentitel?

Den Titel einer Seite können Sie im HTML-Kopf (<head>) eingeben. Dies geschieht im Titel-Tag (<title>). Darin muss mit wenigen Worten der Inhalt der kompletten Seite stehen. Der Titel muss aussagekräftig sein und sollte die Bezeichnung des Internetauftrittes (getrennt mit senkrechtem Strich | ) enthalten. Also würde der HTML-Code so aussehen:

<!DOCTYPE html>
<html lang="de">
<head>
<title>Anleitungen zum Erstellen barrierefreier Webseiten | Barrierefreie Dokumente erstellen</title>
...
</head>
<body>
...
</body>
</html>

Wenn Sie ein CMS System (Joomla, Wordpress, TYPO3, ...) für Ihren Internetauftritt benutzen, dann gibt es hier in Normalfall auch die Möglichkeit über den Adminbereich einen Titel zu jeder Seite zu hinterlegen. Dies finden Sie entweder bei den Menüeinstellungen oder direkt im jeweiligen Artikel z. B. unter dem Punkt "Metadaten".

Zuletzt aktualisiert am 14.11.2024 von Uwe Dombeck.

Wie definiere ich die Dokumentensprache einer Seite?

Die Dokumentensprache Ihrer Seite wird direkt im HTML-Tag (<html>) angegeben, welcher Ihre komplette Seite umschließt. Hier müssen Sie einfach über das Universalattribut "Language" (lang) die Sprache als Sprachenkürzel (z. B. de, en, en-US, ...) mit hinterlegen. Für eine deutschsprachige Seite würde der Code so aussehen:

<!DOCTYPE html>
<html lang="de">
<head>
...
</head>
<body>
...
</body>
</html>

Das Universalattribut "Language" (lang) kann übrigens in jedem Tag benutzt werden, um so anderssprachige Absätze etc. zu markieren.

Wenn Sie ein CMS System (Joomla, Wordpress, TYPO3, ...) für Ihren Internetauftritt benutzen, dann gibt es hier in Normalfall auch die Möglichkeit über den Adminbereich die Dokumentensprache zu hinterlegen. Dies finden Sie meist bei den Seiteneigenaften bzw. unter den Spracheinstellungen der Seite.

Zuletzt aktualisiert am 14.11.2024 von Uwe Dombeck.

Beim Onlinestart dieser Seite stehen hier nur einige Anleitungen. Wir werden diese immer weiter ergänzen. Wenn Sie Fragen zu einzelnen noch nicht hier zu findenden Umsetzungsschritten haben, dann können Sie uns diese kurz beschreiben. Wir erklären diese und werden diese dann hier mit aufnehmen. Bitte nutzen Sie dafür wieder unser Kontaktformular.