Regionales Hochschulrechenzentrum Kaiserslautern-Landau
Regionales Hochschulrechenzentrum Kaiserslautern-Landau

Barrierefreiheit

Webseiten müssen barrierefrei gestaltet werden, um Menschen mit Handicap nicht daran zu hindern, diese zu nutzen.

  • Strukturierte Anordnung von Inhaltselementen
  • Anlegen von Alternativtexten und Titeln für alle Nicht-Textelemente (Bilder, Diagramme, Videos etc.)
  • Grafiken und Texte sollten ohne Farben verständlich sein.
  • Erklärende Texte für Links (nicht: "Hier Klicken")
  • Leicht lesbare Texte nutzen (Füllwörter vermeiden)
  • Aussagekräftige Benennung von Formularen und Dokumenten

Anlegen von Alternativtexten

Ein alternativer Text hilft sehbeeinträchtigten Menschen multimediale Inhalte wahrnehmen zu können. Daher sollte immer eine kurze Beschreibung, z.B. eines Bildinhaltes erfolgen.

Diese kann unter dem Reiter Medien, alternativer Text eingetragen werden.

Beispielelement aus dem Typo3 Backend: In der Bearbeitungsleiste ist im oberen Bildausschnitt der Reiter Medien mit einem roten Kasten hervorgehoben. In der unteren Bildhälfte links, ist ein weiterer roter Rahmen um das Textfeld und den Titel, Alternativer Text gelegt.
Beispielelement aus dem Typo3 Backend: Medien, Alternativer Text
Auf dem Bild ist ein roter Apfel abgebildet. Dieser liegt auf einem Bücherstapel, bestehend aus drei Büchern die ungleichmäßig aufeinander platziert sind. Der Bücherstapel liegt auf einer hölzernen Oberfläche im linken Bildbereich. Der Hintergrund setzt sich aus unterschiedlichen Grautönen zusammen.
Für dieses Bild wurde folgender Alternativtext angelegt:
Apfel liegt auf einem Bücherstapel

Linkziele

Beispielelement aus dem Frontend: Es sind drei Textfelder abgebildet die mit einer Verlinkung enden. Jede Verlinkung hat als Linktext "mehr", was durch rote Kästen hervorgehoben wird.
Beispielelement aus dem Frontend: Schlechte Verlinkung
Beispielelement aus dem Frontend: Es sind drei Textfelder abgebildet die mit einer Verlinkung enden. Jede Verlinkung hat als Linktext eine genauere Beschreibung, wo der Link hinführt, was durch rote Kästen hervorgehoben wird.
Beispielelement aus dem Frontend: bessere Verlinkung

Zu Beachten

Wie in oberen Bildausschnitt zu sehen ist, gibt es drei Verlinkungen mit dem Linktext "mehr". Gleiche Linktexte sind nur sinnvoll, wenn sie auf gleiche Inhalte referieren.

Verlinkte Texte müssen:

  • eindeutig sein
  • auf das Ziel hinweisen

"Hier Klicken" usw. sollte nicht verwendet werden.

In der unteren Abbildung wird ein eindeutiger Text mit Ziel, mit Angabe des Ziels verlinkt.

Sie befinden sich in der Selbstschulung und möchten zur Schulungsstartseite, dann klicken Sie auf  TYPO3 im Selbststudium für Einsteiger Teil 1.