Navigation und Service

Einfach teilhaben (Link zur Startseite)


Alternativen für reine Audio-Inhalte

Begründung

Audio-Inhalte sind Tondokumente, die in Webseiten eingebunden werden. Dabei kann es sich um gesprochene Texte, um Musik oder um Geräusche handeln. Häufig besteht ein Audio-Inhalt auch aus einer Kombination von Text, Musik und Geräuschen. Audio-Inhalte können für sich alleine stehen, oder sie können mit einer Handlung im Video verbunden sein. In diesem Abschnitt wird nur das Einbinden von reinen Audio-Inhalten behandelt.

Reine Audio-Inhalte sind vergleichbar mit dem, was die meisten Menschen von einem Radio-Programm erwarten würden. Im Gegensatz dazu entsprechen Audio-Inhalte die mit einem Video synchronisiert sind dem, was die meisten Menschen aus dem Fernsehen kennen. Über die Verwendung von Audio-Inhalten in mit Video-Inhalten synchronisierten Medien lesen Sie bitte im Abschnitt Textalternativen für synchronisierte Medien.

Grundsätzlich ist der Nutzen von Audio-Inhalten auf Webseiten positiv zu werten. Audio-Inhalte helfen beim Abbau einiger Barrieren, sie fördern zum Beispiel die Aufmerksamkeit bei kognitiven Problemen und das Textverständnis bei Lese-Rechtschreib-Schwäche oder bei allgemeinen Leseschwächen. Allerdings entstehen durch die Beschränkung auf den Hörsinn Barrieren für gehörlose und hörbehinderte Menschen oder auch für Menschen, die aus einem anderen Grund die Audio-Informationen nicht verstehen können. Dabei kann es sich um Menschen in lauten Umgebungen handeln, aber auch ganz einfach um Menschen, die an einem Computer ohne Lautsprecher arbeiten. Um diesen Menschen die Information der Audio-Inhalte nicht vorzuenthalten, muss für Audio-Inhalte eine nutzbare und gleichwertige Alternative angeboten werden.

Ziel der BITV-Bedingungen ist es, Nutzerrinnen und Nutzern alle Informationen die akustisch vorliegen, durch die Bereitstellung geeigneter Textalternativen, zur Verfügung zu stellen. Wenn eine Audioinformation selbst schon eine Alternative bzw. eine Alternativversion für ein anderes Format ist, zum Beispiel für einen Text oder ein Video, dann braucht dieser Audio-Inhalt keine weitere Alternative.

Anleitung

Diese Anleitung beschreibt, wie Sie reine Audio-Inhalte barrierefrei verwenden. Wenn Sie einen Audio-Inhalt verwenden möchten, der Teil eines Videos ist, lesen Sie bitte im Abschnitt Textalternativen für synchronisierte Medien weiter. Eine Übersicht über die verschiedenen Arten von Multimedia-Inhalten und die jeweils zu erfüllenden BITV-Bedingungen finden Sie in dieser "Tabelle zur Bestimmung der zu erfüllenden BITV-Bedingungen für Audio- und Video-Inhalte".

Text-Alternative

Zunächst ist ein Audio-Inhalt gemäß BITV-Bedingung 1.1.1 ein "Nicht-Text-Inhalt", für den eine durch Software bestimmbare Text-Alternative zu Verfügung gestellt werden muss. Da ein Audio-Inhalt aber ein zeitgesteuertes Medium ist, gilt hier in der BITV-Bedingung 1.1.1 die Ausnahme, dass die Text-Alternative noch nicht gleichwertig zum Audio-Inhalt sein muss. Die Text-Alternative muss aber den Audio-Inhalt kurz beschreiben und dadurch identifizierbar machen.

Wie diese Text-Alternative in eine Webseite eingebunden wird, hängt von der Art der Einbindung des Audio-Inhalts ab:

  • Wird ein Audio-Inhalt durch einen einfachen Hyperlink eingebunden, dann gilt der Linktext als Text-Alternative.
Die <a href="leyen.mp3">Rede von Dr. Ursula von der 
Leyen als Audio-Datei zum Runterladen</a>.
  • Wird ein Audio-Inhalt aber mittels eines Flash-Players und dem object-Element eingebunden, ist die durch Software bestimmbare Text-Alternative der Inhalt des object-Elements.
<object data="flashplayer.swf" type="application/x-shockwave-flash">
   <param name="flashvars" value="file=rede.mp3" />
   ...
   <p>
      Rede von Dr. Ursula von der Leyen zur 
      UN-Behindertenrechtskonvention vor dem 
      Deutschen Bundestag am 1.12.2011.
   </p>
</object>

Die Text-Abschnitte "Rede von Dr. Ursula von der Leyen als Audio-Datei zum Runterladen" und "Rede von Dr. Ursula von der Leyen zur UN-Behindertenrechtskonvention ..." genügen hier als einfache Text-Alternative. Der Audio-Inhalt ist identifizierbar und der Inhalt wurde kurz beschrieben.

Die Text-Alternative ist aber noch keine inhaltliche Alternative zur Rede für gehörlose und hörbehinderte Menschen gemäß BITV-Anforderung 1.2. Um auch diese BITV-Anforderung zu erfüllen, sind weitere Bedingungen zu einzuhalten. Die BITV 2.0 unterscheidet dabei, ob die Audio-Inhalte live übertragen werden oder aufgezeichnet sind.

Aufgezeichnete Audio-Inhalte

Für aufgezeichnete Audio-Inhalte verlangt die BITV-Bedingung 1.2.1 bereits in der Priorität I eine "Text-Alternative mit gleichwertigen Informationen". Für live-übertragene Audio-Inhalte wird die "Text-Alternative mit gleichwertigen Informationen" gemäß Bedingung 1.2.9 erst für Webseiten gefordert, die der Priorität II unterliegen. Da Live-Audio-Inhalte andere Konzepte zum Einbinden von Alternativen erfordern, wird dieser Fall im nächsten Abschnitt gesondert behandelt.

Wichtig ist, dass die hier geforderte Alternative wirklich gleichwertig sein muss. Beachten Sie, dass neben einem gesprochenen Dialog oder Monolog auch Geräusche und andere Töne wesentlich zum Verständnis des Audio-Inhalts beitragen können. Kommen in einem Dialog mehrere sprechende Personen vor, muss die Alternative die verschiedenen Personen benennen. Sind wichtige Emotionen in den Stimmen der Akteure erkennbar, sollten diese ebenfalls in der Alternative beschrieben werden. Erfüllt ein Text alle oben erwähnten Eigenschaften, muss dieses Transkript gemeinsam mit dem Audio-Inhalt in einer Webseite eingebunden werden.

Die einfachste Möglichkeit einen Audio-Inhalt einzubinden, ist die Verwendung eines einfachen Links. Die Audio-Datei wird dabei einfach direkt mit einem a-Element verlinkt. Der Link-Text muss als einfache Text-Alternative den Audio-Inhalt identifizieren und der Link zur ausführlichen Textalternative muss dem Audio-Link im selben HTML-Abschnitt folgen. Folgendes rudimentäre Beispiel zeigt diese Verlinkung:

<p>
  Die <a href="leyen.mp3">Rede von Dr. Ursula von der Leyen 
  zum Runterladen</a> (<a href="protokoll-leyen.html">Protokoll
  der Rede Dr. Ursula von der Leyen</a>)
</p>

Dadurch, dass beide Links in einem HTML-Abschnitt stehen, ist es sichergestellt, dass die Alternative auch gefunden wird.

Häufiger wird jedoch ein Audio-Inhalt nicht direkt über einen Link eingebunden. Meist wird ein Abspielprogramm als Flash-Objekt eingebunden und dieses Programm spielt dann den Audio-Inhalt ab. Der Nutzerin oder dem Nutzer stehen dabei Schaltflächen zum Starten, Stoppen, Vor- und Rückspulen und so weiter zur Verfügung. In der Regel werden solche Abspielprogramme durch das HTML-Element object eingefügt. Das object-Element bietet die Möglichkeit eine kurze Alternative zwischen dem öffnenden und dem schließenden object-Tag zu platzieren.

Die kurze Alternative muss an dieser Stelle den Audio-Inhalt lediglich beschreiben und auf die, in der BITV-Bedingung 1.1.1 geforderte "Text-Alternative mit gleichwertigen Informationen" verweisen oder zumindest auf sie Bezug zu nehmen.

Der Einfachheit halber zeigt das folgende Beispiel das Einbinden einer Audiodatei mittels des HTML5-Elements audio. Eine Einbindung mittels Flashplayers und dem object-Elements würde ähnlich aussehen.

<audio controls="controls">
  <source src="leyen.ogg" type="audio/ogg" />
  <source src="leyen.mp3" type="audio/mpeg" />
  <p>
    <a href="leyen.mp3">
       Rede von Dr. Ursula von der Leyen zum Herunterladen.
    </a>
    Ein Link zum Protokoll der Rede Dr. von der Leyens 
    folgt im Anschluss.
  </p>
</audio>
<p>
   <a href="protokoll-leyen.html">
      Protokoll der Rede Dr. von der Leyens.
   </a>
<p>

Falls ein Nutzer-Client das audio-Element noch nicht unterstützt, wird automatisch die Text-Alternative mit dem Link zum Herunterladen der Rede und dem Hinweis auf das Protokoll ausgegeben. Es ist auch denkbar, das ausführliche Protokoll der Rede direkt auf der Webseite unterhalb des Links zur Audio-Datei zu platzieren und auf eine Verlinkung zu verzichten.

Live-Audio-Inhalte

Schwieriger wird die Bereitstellung einer "Text-Alternative mit gleichwertigen Informationen" bei Live-Audio-Übertragung, falls die Webseite die Priorität II erfüllen muss. Während der Live-Übertragung des Audio-Inhalts muss die Text-Alternative der Nutzerin und dem Nutzer in Echtzeit beziehungsweise mit einer minimalen Verzögerung zur Verfügung stehen.

  • Handelt es sich bei dem Audio-Inhalt zum Beispiel um eine bereits vorbereitete Rede, kann als Text-Alternative auch das Manuskript der Rede verlinkt werden. Die Rede kann also live mitgelesen, beziehungsweise schon zeitlich vorher gelesen werden. Die Rede darf dann nicht wesentlich vom Manuskript abweichen.
  • Ist der Inhalt der Audio-Übertragung nicht bekannt, muss ein Dienst in die Webseite integriert werden, welcher eine Live-Untertitelung anbietet. Gleichwertige Live-Untertitel können von einer geübten und geschulten menschlichen Fachkraft in Echtzeit erstellt werden.

Zur technischen Umsetzung sind mehrere Möglichkeiten denkbar. Bei der Beschränkung auf HTML-Technologien bieten sich sogenannte Ajax-Techniken an. Dabei werden während der Audio-Inhalt abläuft, die als Text umgesetzten Abschnitte vom Webserver nachgeladen und unmittelbar auf der Webseite eingeblendet. Der Bereich auf der Webseite, der die Untertitel darstellt, sollte durch die Benutzung der WAI-ARIA-live-Eigenschaften so markiert sein, dass die Texte auch von Braillezeilen-Nutzenden sinnvoll verwendet werden können.

Häufiger Fehler

Sie sollten nicht versuchen die ausführlichen Text-Alternativen im Inhalt des object-Elements zu platzieren. Einem hörbehinderten oder gehörlosen Menschen wird diese Alternative in der Regel nicht zur Verfügung gestellt!

Beispiele

Aufgezeichneter Audio-Inhalt — einfache Verlinkung

Das Beispiel zeigt eine einfache Möglichkeit, Audio-Inhalte und die "Text-Alternative mit gleichwertigen Informationen" mit einem a-Elemente zu verlinken. Als Link dienen in diesem Fall zwei Symbole. Dadurch, dass beide Links durch einem li-Element in einem Listenpunkt zusammengefasst sind, ist die Zuordnung von Audio-Inhalt und Alternative eindeutig.

Beispiel-Screenshot: Beispielhafte Einbindung von Audio-Inhalten und deren Alternativen anhand von Bundestagsreden und deren Protokolle mittels einfachen Hyperlinks Beispiel-Screenshot: Beispielhafte Einbindung von Audio-Inhalten und deren Alternativen anhand von Bundestagsreden und deren Protokolle mittels einfachen Hyperlinks

Die Inhalte der alt-Attribute der Symbole beschreiben und identifizieren die jeweiligen Links gemäß der BITV-Bedingung 1.1.1. title-Attribute erzeugen Tooltips, die die Symbole zusätzlich beschreiben.

<li>
  Bundesministerin Dr. Ursula von der Leyen
  <a href="leyen.mp3">
    <img src="audio.png" title="Audiodatei"
        alt="Die Rede der Bundesministerin Dr. Ursula von der Leyen"/>
  </a> 
  <a href="protokoll-leyen.html">
    <img src="text.png" title="Plenarprotokoll"
         alt="Protokoll der Rede Dr. Ursula von der Leyen"/>
  </a>
</li>

Aufgezeichneter Audio-Inhalt — Alternative im Text

Die Einbindung einer Rede der Ministerin Dr. von der Leyen erfolgt in diesem Beispiel mittels eines Audio-Players. Als einfache Text-Alternative nach Bedingung 1.1.1 steht ein Link zu einem Download bereit und zusätzlich wird auf das auf der Webseite folgende Protokoll der Rede hingewiesen. Das Protokoll beinhaltet neben den wörtlichen Reden auch die Namen der jeweiligen Sprecher und die Beschreibungen des Verhaltens der anderen Abgeordneten. Das Protokoll ist damit eine "Text-Alternative mit gleichwertigen Informationen" und erfüllt somit die BITV-Bedingung 1.2.1 für reine Audio-Inhalte.

Beispiel-Screenshot: Einbindung eines Audio-Inhalts mittels Player und Verlinkung des Protokolls Beispiel-Screenshot: Einbindung eines Audio-Inhalts mittels Player und Verlinkung des Protokolls

Der HTML-Code für dieses Beispiel zeigt das Prinzip der Einbindung eines Flash-Players. Für eine konkrete Anwendung beachten Sie bitte die Dokumentation der von Ihnen bevorzugten Abspielsoftware.

<object type="application/x-shockwave-flash" data="player.swf">
  . . .
  <param name="FlashVars" value="src=leyen.mp3" />
  <p>
     Die Rede von <a href="leyen.mp3">Frau Dr. Ursula von der Leyen 
     zur UN-Behindertenrechtskonvention zum Runterladen</a>. Das 
     Protokoll der Rede folgt im Anschluss.
  </p>
</object>
<h3>Plenarprotokoll</h3>
<p class="ext">
   (Unruhe)
</p>
<p class="speaker">
   Präsident Dr. Norbert Lammert:
</p>
<blockquote><p>
   Das Wort hat nun die Bundesministerin für Arbeit und 
   Soziales, Frau Dr. von der Leyen.
</p></blockquote>
<p class="ext">
   (Beifall bei der CDU/CSU und der FDP)
</p>
<p class="speaker">
   Dr. Ursula von der Leyen, Bundesministerin für Arbeit und Soziales:
</p>
<blockquote><p>
   Herr Präsident! Meine Damen und Herren! Frau Ferner, ich habe die 
   Kritik im Detail gehört. Aber ich glaube, es gibt auch sehr große 
   Gemeinsamkeiten. Ich möchte zwei, drei Gedanken über diese 
   Gemeinsamkeiten vorwegschicken. Denn das ist auch der zentrale 
   Leitgedanke der UN-Behindertenrechtskonvention, der dies deutlich 
   formuliert, nämlich die Idee der Inklusion.
   . . .
</p></blockquote>

Live-Audio-Inhalt (Priorität II)

Wird eine Live-Übertragung einer Rede in eine Webseite eingebunden, muss für die Rede eine "Text-Alternative mit gleichwertigen Informationen" angeboten werden, wenn die Webseite die Priorität II erfüllen muss. Eine Live-Mitschrift kann zum Beispiel in Echtzeit mittels einer Ajax-Technologie auf derselben Webseite, wie der Audio-Inhalt eingefügt werden. Die verwendeten WAI-ARIA-Attribute sorgen dafür, dass die eingefügten Texte auch auf assistiven Technologien, wie zum Beispiel einer Braillezeile, dargestellt und bei Bedarf aktualisiert werden.

<object type="application/x-shockwave-flash" data="player.swf">
 . . .
 <param name="FlashVars" value="src=stream.mp3" />
 <p>
    Live-Übertragung der Rede von Frau Dr. Ursula von der 
    Leyen zur UN-Behindertenrechtskonvention. Eine Live-Mitschrift 
    folgt.
 </p>
</object>
<div aria-relevant="additions text" aria-live="polite"> 
  <h3>Live-Mitschrift</h3>
  <p id="text-stream" aria-atomic="true">
     Dr. Ursula von der Leyen: Herr Präsident! 
     Meine Damen und Herren! Frau Ferner ...
  </p>
</div>

BITV 1.0 zu BITV 2.0

In der BITV von 2002 wurden Audio-Inhalte in den Bedingungen 1.1 und 1.4 behandelt. Streng genommen musste demnach bereits für jeden Audio-Inhalt, egal ob als Teil eines Videos oder als reiner Audio-Inhalt und egal ob aufgezeichnet oder live, eine äquivalente Text-Alternative angeboten werden. Eine Webseite, die die BITV 1.0 vollständig erfüllt, müsste demnach für Audio-Inhalte bereits die nach BITV 2.0 geforderten äquivalenten Text-Alternativen bereithalten.

Stichproben und BITV-Tests der letzten Jahre zeigen, dass die wenigsten Audio-Inhalte, ob alleinstehend oder mit einem Video synchronisiert, über Text-Alternativen oder Untertitel verfügen. Zur Erfüllung der BITV sollten Sie deshalb alle Audio-Inhalte daraufhin überprüfen, ob Text-Alternativen oder Untertitel neu erstellt werden müssen.

© Bundesministerium für Arbeit und Soziales