Title: Beispiellösung - Fehlerhafte Textseite zum Üben
Course: Kurzworkshop | Erstellung barrierefreier Texte > Section: Selbst aktiv werden!

Diese Textseite enthält Hilfestellungen dazu, wie die Textseite aus der Übung barrierefrei gestaltet werden kann.

Barrierefreiheit in Moodle

Bei der Barrierefreiheit gibt es viel zu beachten, aber eigentlich ist es nicht so schwer, einen Text in Moodle barrierefrei zu gestalten, wenn man sich an ein paar Richtlinien hält.

Der Barrierefreiheitschecker, der im TinyMCE-Texteditor in Moodle integriert ist, kann dabei hilfreich sein. Er kann über "Werkzeuge" > "Tester zur Barrierefreiheit" aufgerufen werden. Bei dieser Beispielseite erkennt der Barrierefreiheitschecker zwei der fünf versteckten Fehler: Den fehlenden Alternativtext des Bildes sowie den zu geringen Kontrast zwischen Hintergrundfarbe und Textfarbe beim Wort "kontrastreich". Die übrigen drei Fehler werden vom Barrierefreiheitschecker nicht erkannt:

1. Die Aufzählung ist nicht korrekt formatiert, sondern lediglich über Bindestriche angedeutet.
2. Der Link ist nicht als Link eingebunden. Zudem besitzt er keine "sprechende" Bezeichnung.
3. Die Überschrift "Barrierefreiheit in Moodle" wirkt auf Betrachtende als sei sie korrekt als Überschrift formatiert. Tatsächlich ist sie jedoch als Paragraph formatiert, bei dem lediglich die Schriftgröße vergrößert wurde.

Hilfestellungen zur Behebung der Fehler auf der Übungsseite

Alternativtexte

Bilder sollten als dekorativ markiert sein oder über einen Alternativtext verfügen. Die entsprechenden Angaben können auf folgendem Weg eingefügt werden:

- Fall 1: Im Textfeld ist bereits ein Bild hinterlegt:
  1. Bild anklicken, sodass es markiert ist.
  2. Bild-Icon im Texteditor anklicken.
  3. Alternativtext für das Bild hinterlegen oder es als dekorativ markieren und auf "speichern" klicken.

- Fall 2: Ein Bild wird in ein Textfeld eingefügt:
  1. Bild-Icon im Texteditor anklicken, um ein Bild einzufügen.
  2. Alternativtext für das Bild hinterlegen oder es als dekorativ markieren und auf "speichern" klicken.

Farbkontraste

Schrift- und Hintergrundfarbe sollten kontrastreich sein, um gut erkennbar zu sein. An manchen Hochschulen kann die Hintergrund- und textfarbe innerhalb des Editors festgelegt werden. Der Editor auf MoodleNRW.de bietet diese Einstellmöglichkeiten nicht. Wenn Text innerhalb des Editors hinterlegt wird, ist dadurch automatisch sichergestellt, dass der Kontrast groß genug ist. Wenn jedoch Text aus anderen Programmen (z.B. Word) in das Textfeld kopiert wird, kann es wie in unserem Beispiel dazu kommen, dass die Schriftfarbe des eingefügten Texts sich nicht genug von der Hintergrundfarbe abhebt.

In diesem Fall kann das Problem des zu geringen Kontrasts gelöst werden, indem die Formatierung des Texts entfernt wird:

  1. Das Wort, das nicht kontrastreich genug ist, markieren.
  2. Über "Format" > "Formatierung entfernen" die Schriftfarbe wieder auf den Standard (hier dunkelblau) zurücksetzen.

Auszeichnung von Listen und Tabellen

Listen und Tabellen können mithilfe der Funktionen im Texteditor korrekt ausgezeichnet werden. Dies kann auf folgende Art umgesetzt werden:

- Fall 1: Im Textfeld ist bereits eine Liste hinterlegt:
  1. Liste markieren.
  2. Im Texteditor auf den Button "Aufzählung" oder auf den Button "Nummerierte Liste" klicken.
  3. Formatierung bei Bedarf anpassen.

- Fall 2: Eine Liste wird im Textfeld eingefügt:
  1. Auf den Button "Aufzählung" oder auf den Button "Nummerierte Liste" klicken.
  2. Listen-Elemente eingeben.

Verwendung von sprechenden Links

Bei der Einbindung von Links sollte zu erkennen sein, wohin der Link führt.

- Fall 1: Im Textfeld ist bereits ein Link hinterlegt, der angepasst werden soll:
  1. Link, der angepasst werden soll, im Texteditor anklicken.
  2. Link-Symbol im Texteditor anklicken.
  3. Im Menü den sprechenden Text als "Text zum Anzeigen" hinterlegen.
  4. Anschließend die URL eintragen und auf "Link anlegen" klicken.

- Fall 2: Im Textfeld wird ein Link hinzugefügt:
  1. Link-Symbol im Texteditor anklicken.
  2. Im Menü den sprechenden Text als "Text zum Anzeigen" hinterlegen.
  3. Anschließend die URL eintragen und auf "Link anlegen" klicken.

Der sprechende Link könnte dann z.B. so aussehen: Eine Checkliste, wie man Dokumente barrierefrei gestaltet, findet ihr zum Beispiel hier: Checkliste: Barrierefreie Dokumente vom Kompetenzzentrum digitale Barrierefreiheit.nrw (öffnet ein neues Fenster)

Korrekte Formatierung von Überschriften

Die Überschriftenhierarchie sollte im gesamten Kursraum konsistent sein. Abschnittstitel sind in Moodle von Haus aus eine Überschrift der Ebene 3. Da sich Text- und Medienfelder immer in einem Abschnitt befinden, sollten sie hierarchisch darunter liegen und entsprechend mit einer Überschrift 4 (H4) beginnen. Überschriften können auf folgende Weise formatiert werden:

- Fall 1: Im Textfeld ist bereits eine Überschrift hinterlegt, deren Formatierung überprüft/angepasst werden soll.
  1. Überschrift markieren.
  2. Über "Format" > "Formatierung entfernen" kann sichergestellt werden, dass im HTML-Code keine versehentlichen Formatierungen enthalten sind.
  3. Anschließend kann die Überschrift nochmals markiert werden und die korrekte Überschriftenformatierung (z.B. H4) ausgewählt werden.

- Fall 2: Im Textfeld wird eine neue Überschrift eingefügt.
  1. Überschrift tippen und anschließend markieren.
  2. Im Menü, das dann angezeigt wird, kann die Formatierung (z.B. H4) ausgewählt werden.