Skip to main content

    Ziel: Barrierefreie Webseiten

    Wie kann man bei Webseiten die Barrierefreiheit verbessern

    Handlungsempfehlungen

    Mit Inkrafttreten des Barrierefreiheitsstärkungsgesetzes (BFSG) ist die Barrierefreiheit verpflichtend.
    Was hierzu technisch machbar und automatisierbar ist, wurde vom Rechenzentrum vorbereitet.

    Was auf Redakteursseite notwendig ist, müssen Sie als Redakteur/Redakteurin erledigen.

    Beschriftung von Bildern, ALT Tags

    Bilder müssen mit einem Alternativtext versehen werden, wenn sie für den Kontext der Seite relevant sind.
    Formulierungen wie etwa „auf dem Bild sieht man“ oder „in der Graphik wird dargestellt“ sind ungeeignet.
    Vergeben Sie direkt beim Hochladen der Bilder in die Dateiliste einen passenden Alternativtext.
    Ist eine Bild nur zur Dekoration in eine Seite eingebaut, soll der Alternativtext leer bleiben.
    Bieten Sie eine Textalternative für komplexe Bilder wie Diagramme, Grafiken oder Karten als separates Textelement an.
    Bei Bildern die Text enthalten, sollten Sie diesen Text bei “Alternativer Text” eintragen.

    Wo trägt man den Alternativtext ein:

    Gehen Sie dazu in Datei – Dateiliste in ihr Verzeichnis.
    Im Verzeichnis können Sie dann bei der Bilddatei den Stift anklicken und gelangen so zu „Alternativer Text“.
    Füllen Sie diesen aus und drücken Speichern.

    Audio/Video

    Bieten Sie bei Audio oder Video Alternativen an.
    Dies sind Untertitel, Transskripte, Audio Beschreibungen.
    Starten Sie Audio / Video nicht automatisch.

    Strukturierung von Texten

    Unterteilen Sie ihre Texte in sinnvolle Abschnitte.
    Platzieren Sie nicht den gesamten Text in einem Inhaltselement.
    Jeder Abschnitt sollte ein eigenes Inhaltselement in Typo3 sein, bei dem die Überschrift bzw. die Unterüberschrift ausgefüllt ist.
    Verwenden Sie klare Formulierungen für Überschriften.
    Strukturieren Sie nicht über die Schriftgröße oder Fettschrift,
    sondern setzen Sie Uberschrift 3 bis 5. (Im Texteditor ist dies auswählbar bei Absatz)

    Listen

    Verwenden Sie für Aufzählungen nicht einfach Striche oder Punkte.
    Markieren Sie die gesamte Auflistung. 
    Wählen Sie im Texteditor „Nummerierte Liste“ oder „Aufzählungsliste“.

    Linktexte

    Vermeiden Sie Linktexte wie „hier“ oder „herunterladen“ oder „asdf12345.pdf downloaden“ als Link.
    Geben Sie den Links aussagekräftige Bezeichnungen wie z.B. Studien und Prüfungsordnung, Liste der Messestände o.ä., selbst wenn die Datei auf die verlinkt wird asdf5678.pdf heißt.
    Vermeiden Sie es, Bilder als Link zu verwenden.
    Stellen Sie sicher, dass Links als Linktexte zu erkennen sind.

    Sprache

    Verwenden Sie eine klare und einfache Sprache. Vermeiden Sie unnötig komplizierte Sätze.
    Dies kann Menschen mit Lernschwierigkeiten oder Menschen, die Ihre Sprache lernen, den Zugang zu den Inhalten Ihrer Seite erleichtern.

    Screenreader lesen in einer durch die Seiteneinstellung definierte Sprache vor.
    Verwenden Sie möglichst keine fremdsprachigen Wörter.
    Bereits eingedeutschte übliche Worte wie z.B. „E-Mail“ sind erlaubt.

    Farbkontraste

    Der Ideale Farbkontrast ist der Maximalkontrast schwarz auf weiß.
    Wenn Sie farbigen Hintergrund verwenden, in unserem Fall „light blue grey“, müssen Sie den Text in schwarz darstellen.

    Tabellen

    Bei Tabellen muss entweder die erste Zeile als Kopfzeile definiert werden oder die erste Spalte als Kopfspalte.

    Tabelle im Element Text, Kopfzeile festlegen:

    Klicken Sie dazu in einer vorhandenenTabelle in die erste Zeile.
    Nun erscheint ein kleines Menu. Hier die Zeilen-Darstellung aufklappen. 
    Dann erscheint ein Schalter „Kopfzeile“, diesen Schalter setzten sie auf grün. Speichern.

    Tabelle im Element Text, Kopfspalte festlegen:

    Klicken Sie in einer vorhandenen Tabelle in die erste Spalte.
    Es erscheint ein kleines Menu. Hier die Spaltendarstellung aufklappen.
    Nun erscheint ein Schalter „Kopfspalte“, diesen setzen Sie auf grün. Speichern.

    Tabelle als Inhaltselement Tabelle

    Wählen sie die Karteikarte Erscheinungsbild, bei Position des Tabellenkopfes wählen Sie oben oder links. Speichern.
     

    Neues Inhaltselement : gelistete Links in 2 Spalten

    Erstellen Sie dazu ein 2 Spalten Element 2 columns mit oder ohne Überschrift.
    In die rechte und/oder linke Spalte erstellen Sie ein Custom Element List
    Füllen Sie den Inhalt mit ihren Linktexten und setzen Sie die Links. 
    Markieren Sie den Stil der Links z.B. mit Arrow. 
    Nun markieren Sie den gesamten Link-Block und versehen ihn mit der Markierung Aufzählunglisten, das Icon hat zwei Punkte und zwei Striche.
     

    PDF Dateien

    PDF Dateien dürfen ab sofort nur noch als barrierefreie PDFs eingestellt werden.
    Ältere PDF-Dateien müssen nach und nach durch barrierefreie PDFs ersetzt werden.
    Wenn möglich sollte auf PDFs verzichtet werden.