Farbkontrast

Achten Sie darauf, dass der Text auf dem Bildschirm einen ausreichenden Kontrast zum Hintergrund hat. Dies umfasst:

  • Allgemeiner Text
  • Illustrationen
  • Übergänge und Abschnittsüberschriften
  • Namen von Teilnehmern und Überschriften
  • Untertitel

Weitere Informationen finden Sie unter "Farbkontrast" und "Farbkontrastwerkzeuge".

Farbkontrast beschreibt, wie sich eine Farbe von einer anderen Farbe abhebt. Es ist insbesondere wichtig, den Farbunterschied zwischen Text und Hintergrund und zwischen Abschnitten, die wichtige Informationen darstellen - wie Tortendiagramme, Karten usw. - zu berücksichtigen.

Das folgende Beispiel zeigt, wie schwierig es ist, Text mit unzureichendem Kontrast zu lesen.

Die meisten Menschen bevorzugen einen guten Kontrast - er ist für alle leichter zu lesen. Ein schlechter Kontrast wirkt sich jedoch besonders auf Menschen mit Sehschwäche und Farbblindheit aus. Beispiel: Poor Contrast Event Flyer

Bewährte Verfahrensweisen

  • Nutzen Sie ein Werkzeug zur Farbkontrastüberprüfung.
  • Wählen Sie ein Farbschema, das einen hohen Kontrast zwischen dem Text und dem Hintergrund bietet. Wenn Sie einen dunklen Hintergrund haben, sollte der Text hell sein, und umgekehrt. (Schwarz und Weiß bieten den größten Kontrast.)
  • Vermeiden Sie die folgenden Farbkombinationen: Grün und Rot (oder verwandte Farben), Blau und Gelb (oder verwandte Farben)
  • Verwenden Sie größeren Text und einfache (nicht verschnörkelte) Schriftarten. Sans-Serif-Schriften sind zu bevorzugen.
  • Verlassen Sie sich nicht auf die Farbe als einziges Mittel zur Vermittlung von Informationen. Verwenden Sie z. B. Farbe nicht als einzige Methode zur Kennzeichnung von Überschriftenebenen.
  • Verwenden Sie zur Hervorhebung fettgedruckte Schriften anstelle von Farbe.
  • Text kann auf fotografischen Hintergründen oder Hintergründen mit Farbverläufen schwer zu lesen sein. Setzen Sie den Text nach Möglichkeit vor einen einfarbigen Hintergrund.

Der Colour Contrast Analyser (CCA) ist kostenlos und sowohl für Mac als auch für PC erhältlich. Verwenden Sie nach dem Herunterladen die Pipette, um Ihre Vorder- und Hintergrundfarben auszuwählen.

Überprüfen Sie die Ergebnisse anhand des WCAG-Levels AA. Text gilt als groß, wenn er 18pt und größer ist, oder 14pt und größer, wenn er fett ist. In diesem Fall bestehen Orange und Grün nur AA für großen Text:

Das WAVE Tool ist eine kostenlose Chrome-Erweiterung, die einen Farbkontrast-Checker enthält. Dieses Tool prüft nur Inhalte innerhalb eines Browsers. Überprüfen Sie die Ergebnisse anhand des WCAG-Levels AA.

Sie können die Pipette verwenden, um den Kontrast sowohl innerhalb als auch außerhalb des Browsers zu prüfen. Klicken Sie auf die Farbe, um RGB-Codes einzugeben, oder wählen Sie die Pipette.

Auto-Untertitel aktivieren

Die folgenden Plattformen verfügen über eine automatische Untertitelung. Vermeiden Sie es, eine Videoplattform zu verwenden, die nicht über automatische Untertitel verfügt.

  • Echo360 & Kaltura: Auto-Untertitel sind automatisch verfügbar.
  • Microsoft PowerPoint:

    Aktivieren Sie die Untertitel für jede Präsentation im Menüband "Slide Show" - setzen Sie das Häkchen bei "Immer Untertitel verwenden".

    Der Nachteil ist, dass man die Untertitel nicht abschalten kann. Mit anderen Programmen als PowerPoint können die Benutzer steuern, ob Untertitel angezeigt werden oder nicht.

  • Microsoft Teams:

    Klicken Sie auf das Menü "..." und wählen Sie "Live-Untertitel einschalten (Vorschau)".

    Dadurch wird die Live-Transkription für Benutzer verfügbar, die diese Funktion aktivieren, und außerdem als permanente Untertitel gespeichert, wenn Sie die Besprechung aufzeichnen.

  • YouTube: Auto-Untertitel sind automatisch verfügbar.
  • Zoom:

    Klicken Sie im Tab Kontoeinstellungen > Meeting unter Meeting (Erweitert) auf die Schaltfläche Untertitel, um sie zu aktivieren.

    Bei institutionellen Konten sollte dies auf der Verwaltungsebene für alle Konten aktiviert werden.

Bereitstellung von Transkripten in Verbindung mit Untertiteln

  • Echo360 & Kaltura – Transkripte werden automatisch erstellt und zusammen mit den Untertiteln angeboten. Wenn Sie feststellen, dass keine Transkripte verfügbar sind, handelt es sich möglicherweise um ein älteres Video, das neu bearbeitet werden muss, da diese Funktion erst kürzlich entwickelt wurde.
  • Microsoft PowerPoint – Transkripte werden nicht automatisch erstellt. Laden Sie eine PowerPoint-Aufnahme auf eine der anderen Plattformen hoch, um eine Abschrift zu erstellen.
  • Microsoft Stream – Transkripte werden automatisch erstellt, aber Sie müssen das Transkript herunterladen und es separat als herunterladbare Datei für die Nutzer bereitstellen.

Verwendung eines Videoplayers mit interaktiven Transkripten

Interaktive Transkripte sind Text, der mit einem Video synchronisiert wird.

Diese Funktion ist besonders hilfreich für Lehrinhalte. Für kürzere Marketingvideos ist sie hingegen nicht unbedingt erforderlich. Zu den Playern, die interaktive Transkripte anbieten, gehören:

  • Echo360
  • Kaltura
  • 3Play Media
  • YouTube

Bereitstellung von Audiodeskriptionen für Videos

Lösungen für die Audiodeskription von Videos reichen von Outsourcing bis hin zu DIY-Methoden.

YouDescribe für YouTube

  • Dies ist eine DIY-Option zum Hinzufügen von Audiodeskriptionen zu bestehenden YouTube-Videos
  • Erfordert ein Google-Konto
  • Der Nachteil besteht darin, dass die Videos auf einer anderen Website als YouTube gehostet werden

Video-Player-Unterstützung für Audiodeskriptionen

Nicht alle Videoplayer können eine Audiodeskriptionsspur abspielen, einige funktionieren nur auf Desktop-Computern. Bei denjenigen, die diese Funktion unterstützen, befindet sich die Audiobeschreibung in einer separaten Datei, die als zusätzliche Spur zum Video hinzugefügt werden kann.

Player mit nativer Unterstützung für Audiodeskriptionen:

  • Able Player
  • OzPlayer
  • BrightCove
  • HTML5 unterstützt eine WebVTT-Deskriptionsspur, obwohl diese Funktion noch nicht von allen Browsern und Playern unterstützt wird.

Video und Animationen in der Website

  1. Stellen Sie Textalternativen zur Verfügung: Bei Videoinhalten ist es wichtig, eine Textversion bereitzustellen, damit auch gehörlose oder schwerhörige Nutzer Zugang zu den Informationen haben. Dies kann in Form einer Beschreibung oder einer Volltexttranskription des Videos erfolgen.
  2. Stellen Sie Untertitel und Audiobeschreibungen zur Verfügung: Untertitel helfen gehörlosen oder schwerhörigen Nutzern, den Dialog und wichtige Soundeffekte in einem Video zu verstehen. Audiodeskriptionen beschreiben wichtige visuelle Elemente in einem Video, so dass blinde oder sehbehinderte Nutzer folgen können
  3. Bereitstellung von Kontrollelementen: Die Benutzer sollten die Möglichkeit haben, die Wiedergabe von Videos und Animationen zu steuern, einschließlich Wiedergabe/Pause, schneller Vor- und Rücklauf und Lautstärke. Dies kann über das HTML-Element <video> erfolgen.
                            
                                 <video controls>
                                <source src="video.mp4" type="video/mp4">
                                Your browser does not support the video element.
                                </video>
                            
                        
  4. Automatische Wiedergabe vermeiden: Das automatische Abspielen von Videos und Animationen kann für die Benutzer störend oder erschreckend sein, insbesondere für diejenigen, die Screenreader verwenden. Wenn Sie die automatische Wiedergabe verwenden müssen, stellen Sie sicher, dass Sie eine eindeutige Stopp- oder Stummschalttaste bereitstellen.

Weitere Informationen finden Sie unter BITV 9.1.2.1.

Hier sind Links für Einführungen in Video und Audio in HTML und HTML-Video-Element.

Erstellung barrierefreier Inhalte in Opal

Hier ist ein Link für eine Einführung in Videocampus Sachsen: Erstellung von Untertiteln für Videos (TU Chemnitz)

Hier ist ein Link für eine Einführung in Erstellung barrierefreier Inhalte in Opal.

Lernmodul HTML in Ilias

Hier ist ein Link für eine Einführung in Lernmodul HTML in Ilias.