XML-Know How

Media Overlays 3.0

Der Kombination von Text und Audio in EPUB-E-Books widmet sich eine eigene Spezifikation mit dem Titel „Media Overlays 3.0“. In ihr wird ein ­Dokumentformat beschrieben, das die Synchronisation von Text- und Sprachinhalten einer Publikation ermöglicht. Neben der Zugänglichkeit von E-Books kann der Einsatz dieses Features zukünftig auch für Bildungs- und Fachverlage als Lernwerkzeug für das Lesen oder Sprachen interessant werden.

Die Auszeichnungssprache für die EPUB Media Overlays basiert auf einer Teilmenge von SMIL, der XML-basierten Synchronized Multimedia Integration Language. Mit dieser Sprache wird die Zeiteinteilung für aufgezeichnete Sprachwiedergaben und deren Bezug zu den Textdokumenten beschrieben. Die Media Overlay-Dokumente haben die Dateiendung .smil und verwenden den Namespace http://www.w3.org/ns/SMIL.

Anhand des folgenden Listings soll zum Verständis eine einfache Struktur eines Media Overlay-Dokuments exemplarisch beschrieben werden.


<smil xmlns="http://www.w3.org/ns/SMIL" version="3.0" xmlns:epub="http://www.idpf.org/2007/ops">
  <body>
    <seq epub:textref="kapitel1.xhtml#section" epub:type="chapter">
      <par>
        <text src="kapitel1.xhtml#section_titel"/>
        <audio src="kapitel1.mp3" clipBegin="0:10:05.20" clipEnd="0:10:06.40"/>
      </par>
      <par>
        <text src="kapitel1.xhtml#absatz"/>
        <audio src="kapitel1.mp3" clipBegin="0:10:06.40" clipEnd="0:10:12.80"/>
      </par>
      <seq epub:textref="kapitel1.xhtml#aside" epub:type="marginalia">
        <par>
          <text src="kapitel1.xhtml#aside_absatz"/>
          <audio src="kapitel1.mp3" clipBegin="0:10:12.80" clipEnd="0:10:15.50"/>
        </par>
      </seq>
    </seq>
  </body>
</smil>
Listing 2.27 Ein Media Overlay-Dokument

Das Wurzelelement smil muss das version-Attribut mit dem Wert 3.0 zur Kennzeichnung der aktuellen SMIL-Version sowie den Namespace besitzen. Innerhalb der Struktur kann zunächst ein head-Element stehen, das mit ­metadata beliebige Metadaten zum Dokument enthalten kann.

Anschließend steht das Element body, das den Startpunkt des eigentlichen Dokumentinhalts darstellt. Die einzigen Kindelemente von body sind seq (Sequenz) und par (parallel). Mit dem seq-Element wird die Reihenfolge der Dokumentstrukturen, die wiedergegeben werden sollen, definiert, beispielsweise Kapitel, Randbemerkungen oder Fußnoten. Das Attribut epub:textref ist für seq verpflichtend und beinhaltet einen eindeutigen Verweis auf die entsprechende HTML-Dokumentstruktur. Im oberen Listing bezieht sich das erste seq-Element auf das Dokument kapitel1.xhtml mit der ID section [3].

Mit dem par-Element wird nun die Zuordnung von Text- und Audioschnipsel innerhalb dieser Struktur definiert. Das Element besteht immer aus dem Paar text und audio, das parallel aufgerufen wird. Das text-Element referenziert über das src-Attribut den zugehörigen Textabschnitt des Inhaltsdokuments [5]. Entsprechend verweist das Element audio über src auf die eingebundene Audioquelldatei [6]. Mit den Attributen clip­Begin und clipEnd werden die exakten Zeitpunkte der Audiodatei für Start und Ende der Audiowiedergabe festgelegt.

Im Beispiel wird ein Kapitel und innerhalb diesem eine Marginalie per seq strukturiert. Die drei par-Elemente legen eine Wiedergabe für Kapiteltitel, Kapitelabsatz und Absatz der Marginalie fest. Das Listing zeit des Weiteren, dass epub:type auch in SMIL-Dokumenten verwendet werden kann.

Mit entsprechenden Audio-Anwendungen und Plugins können die einzelnen Abschnitte einer Audiodatei benutzerfreundlich festgelegt werden. Die für die Overlays benötigte SMIL-Datei lässt sich dann automatisch exportieren.

Die Voraussetzung für eine Synchronisation ist neben den Overlay-Dokumenten eine entsprechend feingranulare Auszeichnung der HTML- bzw. SVG-Inhalte, um eine exakte Zuordnung einer Audiowiedergabe zum Textabschnitt definieren zu können. Die zugehörige HTML-Datei zum Media Overlay aus Listing 2.27 sieht wie folgt aus:


<html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops" >
  <head>
    <title>Kapitel 1</title>
  </head>
  <body>
    <section id="section" epub:type="chapter">
      <h1 id="section_titel">Kapiteltitel</h1>
      <p id="absatz">Absatz in Kapitel.</p>
      <aside id="aside" epub:type="marginalia">
        <p id="aside_absatz">Absatz in Marginalie.</p>
      </aside>
    </section>
  </body>
</html>
Listing 2.28 Ein Quellinhaltsdokument für Media Overlays

Die Auszeichnung der Inhaltsstrukturen, für die Media Overlays definiert werden, erfolgt über das id-Attribut. Hierbei zeigt sich, dass die Granularität der Media Overlays beliebig fein sein kann. Während die kleinste Komponente im Listing ein Absatz ist, lässt sich über das inzeilige span-Element ein einzelner Satz oder auch nur ein Wort für die synchronisierte Wiedergabe festlegen. Dabei muss klar sein, dass der Aufwand und die Dateigröße der Media Overlay-Dokumente steigt, je feingranularer die Synchronisation umgesetzt wird.

in EPUB eingebettete SMIL-Dokumente müssen in das Manifest der OPF-Datei aufgenommen werden. HTML- bzw. SVG-Dokumente, für die Media Overlays existieren, müssen im Manifest mit dem Attribut media-overlay ausgezeichnet werden, das einen Verweis auf den entsprechenden Manifest-Eintrag des Overlays enthält.


<item id="kapitel1" href="kapitel1.xhtml" media-type="application/xhtml+xml" media-overlay="kapitel1_audio"/>
<item id="kapitel1_audio" href="kapitel1.smil" media-type="application/smil+xml"/>
Listing 2.29 Manifest-Einträge für Media Overlays

Darüber hinaus müssen einige Metainformationen zu den Overlay-Dokumenten in das metadata-Element der Paket-Datei aufgenommen werden. Hierzu gehört verpflichtend die Dauer der einzelnen eingebetteten Media Overlay-Audiodateien sowie deren Gesamtlänge. Zusätzlich kann der Sprecher der Audiodatei(en) und die CSS-Klasse, die die Visualisierung der Overlays steuert, angegeben werden.

Die Media Overlay-Metadaten werden mit dem meta-Element ausgezeichnet, dessen property-Attributwerte das Präfix media: besitzen.


<package>
  <metadata>
    […]
    <meta property="media:duration" refines="#kapitel1_audio">0:10:15</meta>
    <meta property="media:duration" refines="#kapitel2_audio">0:25:00</meta>
    <meta property="media:duration">0:35:15</meta>
    <meta property="media:narrator">Name Vorname</meta>
    <meta property="media:active-class">-epub-overlay-aktiv</meta>
    […]
Listing 2.30 Media Overlay-Metadaten in der OPF-Datei

Die durch das Overlay-Dokument aktuell wiedergegebenen Inhalte eines E-Books können über eine CSS-Deklaration visuell veranschaulicht werden. Dafür muss im CSS-Stylesheet eine Deklaration mit einer beliebig benannten Klasse definiert werden, die in die Metadaten der Paket-Datei mit dem meta-Element und der Eigenschaft property="media:active-class" aufgenommen wird [8]. Über diese Auszeichnung wird bei der Wiedergabe von Media Overlays die entsprechende CSS-Deklaration angewandt.

Über eine solche CSS-Deklaration kann beispielsweise eine farbliche Unterlegung des gerade gesprochenen Textes umgesetzt werden:


.-epub-overlay-aktiv {
  background-color: orange;
}
Listing 2.31 CSS-Deklaration für Media Overlays

Media Overlays sind eine optionale Funktionalität des EPUB-Standards, deren Unterstützung von Ausgabesystemen nicht vorausgesetzt wird. Bei Nicht-Unterstützung werden die Media Overlay-Dokumente und Verweise darauf vom Gerät ignoriert.