XML-Know How

Content Documents 3.0

Jedes EPUB-E-Book besteht aus einem oder mehreren Inhaltsdokumenten. Diese XHTML- bzw. SVG-Dokumente beschreiben den lesbaren Inhalt einer Publikation und referenzieren weitere Medieninhalte wie Abbildungen oder Videos. Die zulässigen Inhaltsformate und -strukturen einer EPUB-­Publikation sind in der IDPF-Spezifikation „Content Documents 3.0“ definiert. Des Weiteren deklariert das Dokument Konformitätsvoraussetzungen für diese Content Documents sowie für die Ausgabesysteme. Die Spezifikation umfasst die folgenden Bestandteile:

  • XHTML-Inhaltsdokumente
  • Das XHTML-Navigationsdokument
  • SVG-Inhaltsdokumente
  • Skripting-Inhalte
  • CSS-Stylesheets

Diese Dateien, die den darzustellenden Inhalt des EPUBs umfassen, befinden sich in der Regel in einem eigenen Open Publication Structure-Ordner innerhalb des EPUB-Containers.4 Das Unterverzeichnis ist nicht verpflichtend, bietet sich aufgrund der besseren Strukturierung der Ressourcen je­doch an.

8406.png
Abb. 2.3

In den folgenden Unterkapiteln werden die vornehmlich für Buchverlage relevanten Inhaltsdokumente des EPUB-Standards, mit einem Fokus auf die Kernmedientypen, beschrieben.

HTML 5-Inhaltsdokumente

Das grundlegende Vokabular für die textlichen Inhalte eines EPUB-E-Books ist das XHTML-Format basierend auf dem HTML 5-Webstandard. Die Spezifikation definiert HTML 5 entsprechend des aktuellen W3C Working Drafts mit wohlgeformter XHTML-Syntax für die Verwendung in EPUB.

Die Unterstützung der XHTML 5-Auszeichnungsstruktur wird lediglich in wenigen Punkten eingeschränkt und gleichzeitig um formatspezifische Erweiterungen ergänzt. Die Einschränkungen betreffen die Umsetzung der MathML- sowie SVG-Einbettung in die Quellstruktur, während die Erweiterungen die Verwendung semantischer Auszeichnungen an bestimmte Elemente ermöglichen.

Auf einige interessante und layoutrelevante Neuerungen in HTML 5 sowie die strukturellen EPUB-Erweiterungen wird im Folgenden eingegangen. Die Begriffe „HTML“ und „HTML 5“ beziehen sich dabei immer auf die XHTML 5-Syntax entsprechend der EPUB-Spezifikation.

Neue Strukturelemente

Mit HTML 5 wurden die semantischen Auszeichnungsmöglichkeiten von Dokumenten um einige Elemente ergänzt, die für die Abbildung von Buchinhalten sinnvolle Verbesserungen mit sich bringen. Der HTML 5-Entwurf spricht hier von dem sogenannten „Sectioning Content“, der das Auftreten des semantisch undifferenzierten div-Blocks reduzieren soll.

Eines dieser zentralen trukturierenden Elemente mit inhaltlicher Bedeutung ist section, mit welchem ein Dokument in logische, inhaltliche Abschnitte unterteilt werden kann. Diese Unterteilungen können auch verschachtelt werden. Eine identische Funktion kommt dem Element article zu, das im Vergleich zu section jedoch einen alleinstehenden, in sich geschlossenen Inhalt enthalten muss. Somit eignet es sich zum Beispiel für den Einsatz bei digitalen Zeitschriften.

Mit aside existiert eine weitere semantische Struktur, die für ergänzende oder eigenständige Informationen neben dem Hauptinhalt, wie beispielsweise gestalterische Hervorhebungen oder Fußnoten, eingesetzt werden kann. Dieses Element steht innerhalb bzw. anschließend an das Element, auf welches es sich bezieht.

Da dem Sectioning-Element nav in EPUB eine besondere Bedeutung zukommt, wird es in einem eigenen Abschnitt (siehe Kapitel 2.2.2) behandelt.

Inhaltliche Kopf- und Fußbereiche eines Dokuments oder einzelner Abschnitte lassen sich mit den Blockelementen header und footer umsetzen. Diese können jeweils eine Sammlung von einführenden bzw. abschließenden Inhalten umfassen. In der Regel werden sie dafür verwendet, ganze Dokumente zu umschließen. Sie können jedoch genau so gut innerhalb beliebiger Teilstrukturen, wie dem zuvor erläuterten section stehen.

Das nachfolgende Code-Listing verdeutlicht, wie mit den beschriebenen HTML 5-Tags ein Dokument semantisch strukturiert werden kann:


<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>EPUB 3</title>
  </head>
  <body>
    <section>
      <header>
        <h1>EPUB 3</h1>
        <p>Die neue Überarbeitung des E-Book-Formats.</p>
      </header>
      <section>
        <h1>Der Aufbau des Formats</h1>
        <p>EPUB-Inhalte werden mit HTML strukturiert.</p>
        <aside>HTML ist die zentralen Technologie zur Strukturierung von Webdokumenten.</aside>
        <section>
          <h1>HTML 5</h1>
          <p>HTML 5 ist die aktuellste Version.</p>
          <figure>
            <img src="logo_html5.jpg" alt="HTML5"/>
          </figure>
        </section>
      </section>
      <footer>
        <p>© 2012 pagina GmbH, Tübingen</p>
      </footer>
    <section>
  </body>
</html>
Listing 2.10 Exemplarischer Einsatz der HTML 5-Strukturelemente

Überschriften

Der Ausschnitt zeigt ein weiteres HTML 5-Konzept, welches die Überschriftstrukturen betrifft. Die inhaltliche Hierarchie eines Dokuments wird durch die sechs Überschriftselemente h1 bis h6 festgelegt. Zusätzlich zu den Überschriften beeinflusst nun auch die Tatsache, ob sie in den neuen strukturierenden Containern stehen, diese Hierarchie, wodurch unbeschränkte Überschriftsebenen umgesetzt werden können.

Dieser neue Outline-Algorithmus ist schnell erklärt. Bei jedem Sectioning Element (hiervon ausgenommen sind header und footer) beginnt die Zählung der Überschriftenebenen von neuem, jedoch eine Hierarchieebene tiefer als in dem umschließenden Strukturelement. Die h1-Elemente [12 und 16] in Listing 2.8 ergeben trotz selber Elementebene die folgende Überschriftsstruktur:

1. Der Aufbau des Formats
1. HTML5

Zusätzlich können mit dem neuem Element hgroup Überschriften nun gruppiert werden, dies kommt zum Beispiel bei aufeinanderfolgendem Titel und Untertitel zum Einsatz. Für die beschriebene Outline wird lediglich das Überschriftselement mit höchstem Rang innerhalb der hgroup-Gruppe ausgewertet.

Die Elemente audio und video

Auch im Bereich der multimedialen Inhalte halten neue Elemente Einzug in den HTML 5-Standard. Hierzu gehören zentral die Elemente audio und video zur nativen Einbettung von Audio- bzw. Video-Inhalten, wodurch diese Inhalte erstmals nahtlos in EPUB-E-Books integriert werden können.

Das audio-Element kann zum Einbinden lokaler Audiodateien und für externe Streams genutzt werden. Bei einer bestehenden Internetverbindung wäre somit auch das nachträgliche Laden von Audio-Inhalten aus dem Web möglich.


<audio controls="true">
  <source src="alice.mp4" type="audio/mp4"/>
  <source src="alice.mp3" type="audio/mpeg"/>
  <p>Die Audio-Datei kann nicht wiedergegeben werden.</p>
</audio>
Listing 2.11 Das audio-Element

Über das src-Attribut des source-Elements wird die Datei oder der Stream eingebunden, das type-Attribut gibt den MIME-Type der Audioquelle an. Das controls-Attribut am audio-Element regelt die Anzeige von Steuer­elementen zum Starten, Stoppen oder zur Lautstärkeregelung.

Innerhalb des Elements besteht zusätzlich die Möglichkeit, Ersatzinhalte anzugeben, falls der Audiotyp vom Browser oder E-Book-Reader nicht wiedergegeben werden kann. So kann neben eines textlichen Hinweises [4] auch ein alternatives Dateiformat in Form eines weiteren source-Elements angegeben werden [3]. Die einzelnen source-Elemente werden vom Ausgabesystem dabei in der Sequenz ihres Auftretens auf Verwendbarkeit überprüft.

EPUB-Reader, die Audio wiedergeben können, müssen mindestens das .mp3-Format unterstützen, darüber hinaus gehört das .mp4-Format zu den Kernmedientypen von EPUB.

Das Einbinden des video-Elements ist dem Prinzip des audio-Elements in vielerlei Hinsicht sehr ähnlich. Es erlaubt ebenfalls einen Verweis auf externe Ressourcen anstelle von lokalen Dateien, die Code-Syntax folgt ähnlichen Regeln und auch die meisten Attribute sind identisch.


<video controls="true" width="450" height="260" poster="bigbuck.jpg">
  <source src="bigbuck.mp4" type="video/mp4"/>
  <source src="bigbuck.ogg" type="video/ogg"/>
  <p>Die Video-Datei kann nicht wiedergegeben werden.</p>
</video>
Listing 2.12 Das video-Element

Die Attribute width und height regeln hier zusätzlich noch die Anzeige­größe des video-Elements. Das poster-Attribut definiert das Platzhalterbild, welches dargestellt wird, solange das Video noch nicht abgespielt wurde.

Wie beim audio-Element, ist innerhalb des video-Elements der Einsatz mehrerer source-Elemente zulässig. Auch bei den Video-Codecs5 bestehen zwischen den verschiedenen Browsern und Readern große Unterschiede. Im Gegensatz zu Audio definiert die EPUB-Spezifikation für die Video-Einbindung kein verbindliches Format für Lesegeräte und empfiehlt lediglich die Verwendung der verbreiteten Codecs H.264 und VP8. Aus diesem Grund wird bei der Anreicherung von E-Books mit Videos empfohlen, grundsätzlich mehrere Videoformate einzubinden.

Das object-Element

Während die audio- und video-Elemente von HTML 5 zur Einbettung nativer Audio- und Video-Inhalte gedacht sind, können mit dem überarbeiteten object-Element alle Arten externer Inhalte eingebunden werden. In erster Linie ist es für die Einbettung externer Plugin-Inhalte wie Java-Applets oder Flash-Animationen konzipiert, es lassen sich damit jedoch auch XML-Grammatiken oder weitere Multimedia-Inhalte integrieren.


<object data="videoplayer.swf" type="application/x-shockwave-flash">
  <param name="flashvars" value="image=bigbuck.jpg&file=bigbuck.mp4"/>
  <p>Dieses Flash-Video kann leider nicht wiedergegeben werden. Bitte installieren Sie das Flash-Plugin.</p>
</object>
Listing 2.13 Einbindung einer Flash-Anwendung per object

Die einzubindende Datei wird im data-Attribut referenziert, dessen MIME-Type im bereits bekannten type-Attribut angegeben wird. Mit dem param-Element lassen sich ein oder mehrere Parameter an das eingebettete Object übergeben, sofern dies vom Plugin unterstützt wird. In diesem Fall wird das vom Player abzuspielende Video beschrieben.

Auch für das object-Element können alternative Inhalte definiert werden, für den Fall, dass das eigentliche Objekt vom Ausgabesystem nicht dargestellt werden kann.

Die Elemente audio, video und object lassen sich grundsätzlich auch kombinieren, wodurch eine umfangreiche Fallback-Kaskade gebildet werden kann. Dies ist für EPUB spätestens dann relevant, wenn Multimedia-Inhalte auf Readern abgespielt werden sollen, die keine Unterstützung für die neuen video- oder audio-Elemente bieten.

Über die beschriebenen Neuerungen hinaus existieren zahlreiche weitere HTML 5-eigene Strukturen, die für das EPUB-Format neue spannende Möglichkeiten bieten, wie beispielsweise Formulare, die Geolocation-API zur Beschreibung von GPS-Positionen, die Drag&Drop-API, oder die Java­Script-gesteuerte canvas-Malfläche. Aufgrund des Umfangs können diese im Rahmen dieses Buches nicht vollständig behandelt werden.

Zum Zeitpunkt der Drucklegung dieses Buches ist der HTML 5-Standard noch nicht offiziell verabschiedet.6 Da zukünftige EPUB-inkompatible Entwicklungen erst in folgenden Updates der EPUB-Spezifikationen berücksichtigt werden können, ist es wichtig, sich dieses Risikos bei der Verwendung spezieller HTML 5-Strukturen in EPUB-Publikationen bewusst zu sein.

Das Attribut epub:type

Mithilfe der Attribut-Erweiterung epub:type, die prinzipiell an alle HTML-Elemente angehängt werden kann, lässt sich unter anderem der Inhalt der beschriebenen neuen Strukturelemente semantisch klassifizieren.

Das Dokument „EPUB 3 Structural Semantics Vocabulary“, das Teil des EPUB-Standards ist, definiert zu diesem Zweck zahlreiche semantische Dokumenteigenschaften für dieses Attribut, die von Ausgabesystemen ausgewertet werden und ein bestimmtes Verhalten auslösen können. Durch ein Leerzeichen getrennt, können mehrere Werte für das Attribut definiert werden. Grundsätzlich muss bei der Verwendung der epub-Erweiterungen der Namespace http://www.idpf.org/2007/ops am Wurzelelement html deklariert werden. Eine vollständige Referenzübersicht zu den epub:type-Attributwerten befindet sich im Anhang dieses Buches.

Mit Hilfe dieser Konstruktion kann beispielsweise einem section-Element die Information mitgegeben werden, welches Buchelement sie repräsentiert (zum Beispiel das Vorwort oder ein Kapitel):


<html […] xmlns:epub=“http://www.idpf.org/2007/ops“>
<section epub:type="preface">
  […]
</section>
Listing 2.14 epub:type-Erweiterung an section

Eine weitere Einsatz-Möglichkeit ist die Umsetzung von Fußnoten:


<html […] xmlns:epub=“http://www.idpf.org/2007/ops“>
  […]
  <p>Das <a epub:type="noteref" href="fußnote1">epub:type</a>-Attribut …</p>
  <aside epub:type="footnote" id="fußnote1">Dieses Attribut dient der semantischen Anreicherung von …</aside>
  […]
Listing 2.15 epub:type-Erweiterung für die Auszeichnung von Fußnoten

Der Verweis auf die Fußnote wird innerhalb des Fließtextes mit dem Ankerelement a, das den Typ noteref und eine Referenz auf die Fußnote besitzt, ausgezeichnet. Die Fußnote selbst stellt das aside-Element mit dem footnote-Typattribut und entsprechendem Verweisziel id dar.

Ein Beispiel für die Auswertung dieses Attributs ist die Fußnoten-Darstellung von iBooks. Die Anwendung von Apple unterstützt seit Version 2.1.1 einige Teilbereiche des EPUB 3-Standards. Dazu gehört unter anderem die Umsetzung der beschriebenen epub:type-Werte für die Auszeichnung von Fußnoten. Die Inhalte des aside-Elements entsprechend Listing 2.15 sind zunächst ausgeblendet und werden beim Aufruf des Verweises in Form eines Pop-ups dargestellt.

02_04_ibooks_fussnote.png
Abb. 2.4 epub:type-Umsetzung für Fußnoten in iBooks

Das Element epub:switch

Zur Referenzierung von XML-Grammatiken in HTML-Inhaltsdokumenten wurde als spezifische EPUB-Erweiterung das Element epub:switch definiert. Für XML-Strukturen, deren Integration laut Standard zwar erlaubt ist, von Ausgabegeräten jedoch nicht zwingend unterstützt werden muss, bietet diese Erweiterung eine einfache Umsetzung einer Fallback-Kaskade. Somit können Inhalte in nicht nativ unterstützten Strukturen in ein EPUB integriert werden, auch wenn deren Darstellung für den Lesefluss zwingend notwendig ist.

Zur Veranschaulichung dieses Mechanismus soll ein einfacher Anwendungsfall dienen, der die Abwärtskompatibilität für EPUB-Lesegeräte, die MathML nicht unterstützen, gewährleistet.


<epub:switch>
  <epub:case required-namespace="http://www.w3.org/1998/Math/MathML">
    <math xmlns="http://www.w3.org/1998/Math/MathML">
      <mfrac>
        <mrow>
          <mi>x</mi>
        </mrow>
        <mrow>
          <mn>2</mn>
        </mrow>
      </mfrac>
    </math>
  </epub:case>
  <epub:default>
    <p>x/2</p>
  </epub:default>
</epub:switch>
Listing 2.16 Die epub:switch-Erweiterung

Das epub:case-Element beinhaltet eine Instanz bezogen auf eine XML-Grammatik, deren Namespace im Attribut required-namespace deklariert wird. Das verpflichtende epub:default-Element repräsentiert denselben Inhalt in einer Struktur, die in XHTML-Dokumenten valide ist [14]. Kann ein Lesegerät die Inhalte des epub:case-Elements nicht darstellen, wird die epub:default-Struktur prozessiert. Bei komplexeren MathML-Formeln wäre die Einbindung einer Grafik als Fallback denkbar.

Durch die Kombination mehrerer case-Elemente kann eine Fallback-Kaskade gebildet werden. Dabei muss jedes Element eine alternative Darstellung desselben Inhalts beinhalten. Das Auftreten eines Switches in einem Inhaltsdokument muss im Manifest mit der Eigenschaft properties="switch" am item-Element ausgezeichnet werden.


<item id="kapitel1" href="kapitel1.xhtml" media-type="application/xhtml+xml" properties="switch"/>
Listing 2.17 Auszeichnung eines epub:switch-Vorkommens am item-Element

Das Element epub:trigger

Individuelle Schaltflächen zur Steuerung von Multimediaobjekten wie Audio- oder Videowiedergaben können mit dem epub:trigger-Element, der dritten EPUB-Erweiterung der HTML-Syntax, ohne den Einsatz von ­JavaScript definiert werden. Mit dieser Struktur werden Elementen bestimmte Auslöser, welche die Wiedergabe steuern, zugeordnet. epug:trigger kann für eine globale Definition im head des HTML-Dokuments oder direkt innerhalb eines HTML-Elements stehen.

Ein einfaches Beispiel einer Videowiedergabe soll die Auszeichnungsmöglichkeiten verdeutlichen.


<epub:trigger ev:observer="pause" ev:event="click" action="pause" ref="video"/>
<epub:trigger ev:observer="wiedergabe" ev:event="click" action="resume" ref="vid"/>
<epub:trigger ev:observer="mute" ev:event="click" action="mute" ref="vid"/>
<epub:trigger ev:observer="unmute" ev:event="click" action="unmute" ref="vid"/>
<video id="vid" controls="true" width="450" height="260">
  <source src="bigbuck.mp4" type="video/mp4"/>
  <p>
    <button id="wiedergabe">Wiedergabe</span>
    <button id="pause">Pause</span>
    <button id="mute">Mute</span>
    <button id="unmute">Unmute</span>
  </p>
</video>
Listing 2.18 Die epub:trigger-Erweiterung

Das leere epub:trigger-Element muss die Pflichtattribute ev:observer, ev:event, action und ref besitzen. Die ersten beiden Attribute mit ev-Namespace sind dem W3C-Standard „XML Events“ entlehnt. ev:observer gibt das Quellobjekt des Auslösers an. Im Listing bezieht es sich jeweils auf die button-Elemente (id-Attribut) innerhalb des video-Elements. ev:event definiert das Ereignis, das den Auslöser aktiviert. Mit action wird die auszuführende Aktion beschrieben, zu den möglichen Werten gehören show (anzeigen), hide (ausblenden), play (wiedergeben), pause (pausieren), resume (fortsetzen), mute (stumm) und unmute (Lautschaltung). Das ref-Attribut identifiziert das Multimediaobjekt, welches über die Schaltflächen gesteuert wird. Im Beispiel handelt es sich um das video-Element mit der ID vid.

Abstrakt beschrieben bedeutet das: Wenn das ev:event am ev:observer ausgelöst wird, wird action am ref-Object ausgeführt. Im Beispiel kann über die vier Textbuttons die Wiedergabe somit pausiert und fortgesetzt und eine Stummschaltung aktiviert und deaktiviert werden.

Lesesysteme, die Audio- oder Videoinhalte unterstützen, müssen das epub:trigger-Element auswerten können.

Alternate Style Tags

Hinsichtlich der Einbindung von CSS wird das HTML-Profil zusätzlich um sogenannte alternative Stylesheets erweitert. Diese Alternativen bieten über das Standard-Stylesheet hinaus dem Nutzer die Möglichkeit, eine abweichende Darstellung der Inhalte auszuwählen. Die EPUB-Spezifikation definiert hier Werte für abweichende Darstellungsrichtungen sowie Tag- und Nachtmodus.


<link rel="stylesheet" href="styles.css"/>
<link rel="alternate stylesheet" href="night.css" title="Nacht" class="night"/>
Listing 2.19 Standard- und alternatives CSS-Stylesheet

Alternative Stylesheets werden bei der Einbindung über den Wert alternate stylesheet des rel-Attributs sowie dem verpflichtenden title-­Attribut vom Standard-CSS unterschieden [2]. Die vordefinierten Werte des EPUB-Standards für das class-Attribut lauten

  • horizontal (horizontale Darstellung)
  • vertical (vertikale Darstellung)
  • day (Farbschema für Tag)
  • night (Farbschema für Nacht)

Die Unterstützung dieser CSS-Darstellungsvarianten ist für Lesesysteme ­optional.

Das HTML-Navigationsdokument

Eines der Ziele der EPUB Working Group war, die proprietären Umsetzungen im EPUB-Standard weiter zu verringern. Im Zuge dessen wurde das im EPUB 2-Standard verwendete Inhaltsverzeichnisformat NCX in der neuen EPUB-Überarbeitung vollständig durch eine universelle XHTML-Lösung ersetzt. Das XHTML-Inhaltsverzeichnis basiert auf dem HTML 5-Element nav. Das Navigationsdokument ist eine Komponente, die in einer EPUB-Publikation entsprechend des Standards zwingend vorhanden sein muss.

9734.png
Abb. 2.5

Diese Datei stellt das navigierbare Inhaltsverzeichnis des E-Books dar, welches je nach Ausgabegerät bzw. -software unterschiedlich umgesetzt werden kann, zum Beispiel als Seitenleiste neben dem Inhalt. Sie enthält die hierarchische Gliederung des E-Books und ermöglicht dem Leser die direkte Ansteuerung der jeweiligen Publikationsinhalte.


<nav epub:type="toc">
  <h1>Inhaltsverzeichnis</h1>
  <ol class="ebene1">
    <li><a href="cover.xhtml">Cover</a></li>
    <li><a href="titel.xhtml">Titel</a></li>
    <li><a href="inhalt.xhtml">Inhaltsübersicht</a></li>
    <li><a href="einleitung.xhtml">Einleitung</a></li>
    <li><a href="kapitel1.xhtml">Kapitel 1</a>
      <ol class="ebene2">
        <li><a href="kapitel1#unterkapitel1.xhtml">Kapitel 1.1</a></li>
        <li><a href="kapitel1#unterkapitel2.xhtml">Kapitel 1.2</a></li>
      </ol>
    </li>
    <li><span>Weitere Inhalte</span>
      <ol class="ebene2">
        <li><a href="ueber.xhtml">Über dieses Buch</a></li>
        <li><a href="impressum.xhtml">Impressum</a></li>
      </ol>
    </li>
  </ol>
</nav>
Listing 2.20 Das nav-Element

Das nav-Element dient generell der Auszeichnung von Navigationselementen. Die EPUB-Spezifikation grenzt das Inhaltsmodell des nav-Elements für die Verwendung in EPUB ein. Neben einem optionalen Titelelement für das Inhaltsverzeichnis ist als direktes Kindelement das ol-Element festgelegt, das eine geordnete Liste auszeichnet [3]. Diese Liste entspricht der obersten Ebene der Inhaltsstruktur. Die nachfolgenden li-Listeneinträge beinhalten die einzelnen Navigationspunkte. In der Regel sind das die Überschriftsstrukturen der textlichen Inhaltsdokumente. Es lassen sich aber auch definierte Fragment-Bezeichner7 innerhalb eines Dokuments ansteuern. Die Reihenfolge der Listeneinträge muss der Sequenz der Inhaltsdokumente im spine-Element der OPF-Datei entsprechen. Innerhalb der Listeneinträge werden die Verweise auf die Zielstruktur mit dem Ankerelement a ausge­zeichnet.

Um eine weitere Hierarchieebene umzusetzen, kann anschließend an den Verweis eine weitere, untergeordnete ol-Liste innerhalb eines Eintrags stehen. Hierdurch ist die rekursive Verschachtelung von Listen möglich [9].

Das Listing 2.20 zeigt des Weiteren, dass statt des a-Elements auch ein span-Element eingesetzt werden kann [14], um eine Hierarchieebene mit einer nicht verlinkten Überschrift zu versehen.

Die Spezifikation schränkt das HTML 5-Inhaltsmodell der Elemente span und a nicht ein. Dadurch können neben normalem Text auch Textauszeichnungen oder eingebettete Inhalte als Überschrift oder Verweis verwendet werden. Eingebettete Abbildungen und andere nichttextliche Strukturen müssen dabei eine Textalternative als Fallback enthalten.

Eine entsprechende Ausgabeunterstützung vorausgesetzt, ist mit den Möglichkeiten der neuen Navigationsstruktur beispielsweise ein vollständig bebildertes Inhaltsverzeichnis für ein Kinderbuch umsetzbar.

Der EPUB-Standard definiert mehrere Typen von nav-Elementen für die Verwendung im Navigationsdokument, denen unterschiedliche Aufgaben zukommen. Der Typ wird über das epub:type-Attribut deklariert. Wichtige Typen sind in der folgenden Tabelle gelistet.

epub:type

Vorkommen

Bedeutung

toc

verpflichtend

Zentrale Navigationsstruktur einer Publikation (entspricht dem Print-Inhaltsverzeichnis)

page-list

optional

Navigationsstruktur mit Bezug auf die Seitenzahlen der Print-Publikation (ersetzt das NCX-Element pageList der EPUB-Version 2)

landmarks

optional

Verweisstruktur für den Zugang zu festen Bestandteilen einer Publikation durch das Ausgabegerät (ersetzt das OPF-Element guide der EPUB-Version 2)

Tab. 2.2 Varianten des nav-Elements

Die page-list-Navigation

Mit page-list beschreibt der EPUB-Standard eine Navigationsstruktur, die einen Bezug auf die Seiten des gedruckten Buchs ermöglicht – sofern entsprechende Seiteninformationen in den Quelldaten vorhanden sind. Diese Funktion ist vor allem für Fach- und Sachbuchverlage wichtig, bei denen die Referenzierung auf die gedruckte Ausgabe von Bedeutung ist (zum Beispiel um die Zitierfähigkeit zu gewährleisten). In der Inhaltsverzeichnis-Datei des EPUBs kann durch ein zusätzliches nav-Element mit dem Attribut epub:type="page-list" ein klassisches Seitenverzeichnis mit Bezug zur Print-Publikation umgesetzt werden. Die Struktur ist mit der toc-Navigation identisch, die Verweisziele stellen in diesem Fall in den Inhaltsdateien hinterlegte Seitenzahlen dar. Eine solche Seitenreferenz kann wie folgt notiert werden:


<span epub:type="pagebreak" id="100"/>
Listing 2.21 Seitenreferenz im EPUB-Inhaltsdokument

Es können darüber hinaus weitere, optionale nav-Container für individuelle Verzeichnisse eingebunden werden. Diese sollten jeweils ein eigenes epub:type-Attribut (siehe Übersicht im Anhang) sowie eine verpflichtende Überschrift als erstes Kindelement besitzen.

Das XHTML-Inhaltsverzeichnis muss im Manifest der OPF-Datei mit dem properties-Attributwert nav ausgezeichnet werden. Um die Abwärtskompatibilität des EPUB-Formats für Lesegeräte, die nur mit der früheren EPUB-Version umgehen können, zu gewährleisten, kann das abgelöste NCX-­Format weiterhin eingebunden werden. Die NCX-Datei gehört zu den wenigen Strukturen, die von EPUB 2 benötigt wurden und vom neuen EPUB 3-Standard nicht mehr unterstützt werden.

MathML

Durch die konsequente Unterstützung des HTML 5-Standards adaptiert die neue EPUB-Überarbeitung weitere Webstandards, welche in HTML 5 enthalten sind. Hierzu gehört die XML-Auszeichnungssprache Mathematical Markup Language, die der Darstellung komplexer mathematischer Ausdrücke und Formeln dient. Besonders für Wissenschafts- und Bildungsverlage stellt dieses Feature eine wichtige Neuerung dar.

Bisher war die einzige Möglichkeit, derartige Inhalte in ein E-Book zu integrieren, eine Umsetzung als Grafik. In Zukunft kann natives MathML direkt in den EPUB-Quellcode integriert werden. EPUB 3-Ausgabesysteme müssen laut Standard die Presentation MathML-Sprache unterstützen. Diese Teilsprache des Standards konzentriert sich auf die Beschreibung der Darstellung der Formeln. Ein einfaches Beispiel soll dieses Präsentationsmarkup von MathML veranschaulichen.


<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mrow>
    <mi>x</mi>
    <mo>=</mo>
    <mfrac>
      <mrow>
        <msqrt>
          <msup>
            <mi>b</mi>
            <mn>2</mn>
          </msup>
        </msqrt>
      </mrow>
      <mrow>
        <mn>2</mn>
        <mo>&#x2062;</mo>
        <mi>a</mi>
      </mrow>
    </mfrac>
  </mrow>
</math>
Listing 2.22 Presentational MathML-Markup

Mit dem Element mrow werden zusammengehörige Ausdrücke gruppiert. Im Beispiel werden damit Zähler und Nenner im mfrac-Bruch deklariert. mi zeichnet eine Variable oder Konstante aus, mo einen Operator und mn eine Ziffer. Innerhalb der msqrt-Wurzel wird durch msup eine Potenz deklariert, wobei das erste Kindelement die Basis und das folgende Kindelement den Exponenten bildet. Eine mögliche Darstellung dieser Formel in einer EPUB-Leseanwendung zeigt die folgende Abbildung.

02_05_mathml_formel.jpg
Abb. 2.6 Darstellung einer MathML-Formel

Enthält ein HTML-Dokument eine MathML-Struktur, muss es im Manifest mit der Eigenschaft properties="mathml" notiert werden. Die ausführliche MathML 3.0-Spezifikation des W3C befindet sich unter http://www.w3.org/TR/MathML3.

SVG

Neben dem Abbildungsaufruf über das img-Element und der erweiterten Einbettung von SVG-Konstrukten in XHTML-Dokumenten, deklariert die EPUB 3-Spezifikation SVG in der Version 1.1 nun als weiteres zentrales Inhaltsformat neben XHTML. Dies ermöglicht die Umsetzung grafiklastiger Publikationen mit festen Seitenverhältnissen, wie beispielsweise Comics oder Bildbände, ohne dass ein XHTML-Dokument als Inhaltscontainer für die SVG-Dateien dienen muss.

Das Scalable Vector Graphics-Format ist eine XML-Anwendung zur Beschreibung zweidimensionaler Vektorengrafiken und -texte. Diese können auch dynamische Animationen oder interaktive Events enthalten. Vektorengrafiken beschreiben eine Abbildung durch einfache, mathematisch definierte Grundformen. Bei diesen Objekten handelt es sich um Rechtecke, Kreise, Ellipsen, Linien, Polygonlinien, Polygone und Pfade, für die jeweils Füllung, Kontur und Transparenz definiert werden können.

Ein großer Vorteil des Vektorformats für den Einsatz in EPUB ist die ­Skalierbarkeit. Während Rastergrafiken (JPG, PNG und GIF) immer in einer absoluten Abbildungsgröße vorliegen, können SVG-Grafiken unbegrenzt skaliert werden.

Anhand einfacher eingebetteter SVG-Strukturen soll das Konzept der Auszeichnungssprache exemplarisch vorgestellt werden.


<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="110.375" height="50.375">
  <rect width="110" height="50" fill="#FF4000" stroke="#000000" stroke-width="0.75"/>
</svg>
Listing 2.23 Ein SVG-Rechteck

Das Wurzelelement svg enthält neben Version und Namespace des Standards die Attribute width und height, welche die Breite und Höhe der gesamten Grafik festlegen. Ist keine Maßangabe angegeben, werden Pixel verwendet. Innerhalb dieses Containers stehen die einzelnen grafischen Elemente bzw. Gruppen von Elementen.

Im Beispiel des Listings 2.14 wird mit rect ein Rechteck definiert, dessen Attribute Informationen über Größe, Füllung und Kontur enthalten.

8475.jpg
Abb. 2.7 Darstellung des SVG-Rechtecks

Ein etwas komplexeres Markup erfordern Pfad-Elemente, mit welchen freie Linien- oder Objektformen beschrieben werden können. Diese werden mit dem path-Element ausgezeichnet, der eigentliche Verlauf wird mit dem Attribut d festgelegt. Der Wert besteht aus einer alphanumerischen Zeichenkette, wobei ein Buchstabe jeweils den Pfadverlauf festlegt, die Zahlen bestimmen die Koordinaten bzw. Winkel dieses Verlaufs.


<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
  <path fill="#FF4000" d="M92.638,46.338C92.638,20.758,71.886,0,46.306,0C20.761,0,0,20.758,0,46.338 C0,71.92,20.76,92.657,46.306,92.657c3.209,0,6.341-0.328,9.363-0.947L22.053,54.508L60.028,12.49L70.3,19.749L38.831,54.508 l29.497,32.584C82.8,79.254,92.638,63.949,92.638,46.338z"/>
</svg>
Listing 2.24 Ein SVG-Pfad

Dieser nicht mehr menschenlesbare Code zeigt, dass für die Erstellung und Bearbeitung von SVG-Grafiken prinzipiell SVG-Editoren wie zum Beispiel Adobe Illustrator verwendet werden und diese in der Regel nicht manuell geschrieben werden. Die grafische Darstellung des Pfads sieht wie folgt aus:

8481.png
Abb. 2.8 Darstellung des SVG-Pfads

Durch die Definition des SVG-Formats als Core Media Type müssen EPUB-Ausgabesysteme in der Lage sein, SVG-Inhalte zu rendern. SVG- sowie HTML-Inhaltsdokumente, die eingebettete SVG-Objekte enthalten, müssen im Manifest der OPF-Datei mit der Eigenschaft properties="svg" ausgezeichnet werden.

JavaScript

Mit der neuen EPUB-Überarbeitung wird das viel diskutierte Thema Skripting offizieller Bestandteil des E-Book-Formats. Die Unterstützung der Sprache JavaScript ermöglicht die Implementierung umfangreicher dynamischer, interaktiver Inhalte in EPUB. Dies reicht von der Manipulation von HTML- und CSS-Quelldaten bis hin zu integrierten Anwendungen.

Mit der JavaScript-Unterstützung können die Grenzen zwischen den Möglichkeiten nativer Apps und EPUB-E-Books langfristig verschwimmen. Die Technologie ermöglicht beispielsweise die Umsetzung von Überblendungen, Popup-Elementen, Slideshows oder interaktiven Lerneinheiten.

Nachfolgend wird die Technologie mit einem Fokus auf die Integration in das EPUB-Format vorgestellt.

Bei JavaScript handelt es sich um eine clientseitige Skriptsprache8, die hauptsächlich in der Webprogrammierung Einsatz findet. Mit dem Element script kann JavaScript-Code in ein HTML-Dokument (im head oder an beliebiger Stelle ) direkt eingebunden oder mit Hilfe des src-Attributs darauf verwiesen werden. Über das type-Attribut wird die Skriptsprache definiert. EPUB-Inhaltsdokumente, welche JavaScript enthalten, müssen im Manifest mit der Eigenschaft properties="scripted" ausgezeichnet werden.


<head>
  <script type="text/javascript">document.write("Hello World!")</script>
</head>
Listing 2.25 Direkte Integration eines JavaScripts im Kopf eines HTML-Dokuments

<head>
  <script type="text/javascript" src="bildergalerie.js"/>
</head>
Listing 2.26 Verweis auf ein JavaScript im Kopf eines HTML-Dokuments

Während der Einsatz von JavaScript in EPUB erlaubt ist, legt der Standard die Unterstützung der Technologie durch Endgeräte explizit als optional fest. Die Interpretation und Darstellung von Skripting-Inhalten wird also nicht verpflichtend von Lesegeräten gefordert.

Die Spezifikation definiert zwei Szenarien für den Einsatz von Skripten in EPUB. Es wird unterschieden zwischen

  • script-Elementen, die direkt in einem Inhaltsdokument enthalten sind, welches im spine-Container gelistet wird (spine-level) und
  • script-Elementen, die in einem Inhaltsdokument enthalten sind, das nicht im spine -Container gelistet wird und auf welches stattdessen durch die Containerelemente object, embed oder iframe innerhalb eines anderen Inhaltsdokuments verwiesen wird, für das Fallback-Inhalte angegeben werden können (container-constrained).

Generell wird in der Spezifikation die Verwendung von sekundären, container-constrained Skripting-Inhalten sowie die Deklaration von Fallback-Lösungen empfohlen. Bei den spine-level-Skripten verfolgt der Standard den Ansatz des Progressive Enhancements. Das bedeutet, dass Inhalte, die fester Teil des Leseflusses sind, auch von Endgeräten ohne JavaScript-Unterstützung uneingeschränkt dargestellt werden müssen. Sind zentrale Publikationsinhalte in einem Skript enthalten, müssen entsprechende Fallback-Strukturen deklariert werden. Dies kann durch elementeigene Strukturen oder dem fallback-Attribut im Manifest erfolgen. Ein skriptbedingter Zugang zu Inhalten ist gemäß Standard nicht erlaubt.

Endgeräte, die JavaScript darstellen können, müssen container-constrained Skripte unterstützen, die Darstellung von spine-level Skripten ist optional. Des Weiteren können Endgeräte die JavaScript-Umsetzung auf­grund eigener Darstellungs- oder Sicherheitskriterien weiter einschränken.

Beim Einsatz von JavaScript besteht die Gefahr, plattformabhängige Publikationen zu produzieren, die je nach Implementierungsstand der Ausgabesysteme eine inkonsistente Interpretation der Skriptsprache zur Folge haben. Aus diesem Grund ist grundsätzlich zu empfehlen, Skripte bewusst für die optionale Anreicherung einer Publikation einzusetzen und deren Implementierung und die Dokumentkonsistenz auf verschiedensten Ausgabemedien zu testen.

CSS

8494.png
Abb. 2.9

Dem Thema CSS ist ein eigenes Kapitel („Vergleich der Formate“) gewidmet. Aus diesem Grund wird an dieser Stelle lediglich auf die Besonderheiten des CSS-Profils in EPUB 3 eingegangen.

Der Standard definiert CSS in der Version 2.1 als Grundlage für die Formatierung von EPUB-Inhalten. Darüber hinaus wurden einige Module und Eigenschaften der in der Entwicklung befindlichen CSS-Version 3 adaptiert, welche zum Teil eigene epub-Präfixe erhielten. Eine Übersicht über den aktuellen Stand des CSS 3-Entwurfs findet sich unter http://www.w3.org/Style/CSS. Die folgenden Bestandteile wurden aus dem CSS 3-Entwurf aufgenommen.

  • Eigenschaften des „Speech”-Moduls, welches die akustische Sprachaus­gabe von Dokumenten steuert,
  • die @font-face-Regeln zur Deklaration und Einbettung von Fontdateien,
  • Varianten des „Text”-Moduls zur verbesserten Umbruchsteuerung,
  • das „Writing Modes”-Modul zur Steuerung der Schreibrichtung wie rechts-nach-links oder vertikal,
  • Media Queries, die eigene Stylesheets für individuelle Ausgabegeräte (z. B. unter Berücksichtigung der Displaygröße oder Ausrichtung) ermöglichen,
  • das Modul „Multi-column Layout”, mit dem mehrspaltige Layouts umgesetzt werden können sowie
  • die ruby-position-Eigenschaft zur Positionierung von Schriftanmerkungen, deren Einsatz nur im asiatischen Sprachraum gebräuchlich ist.

Darüber hinaus wurde die display-Eigenschaft von CSS 2.1 bereits in EPUB 2 um die spezifischen Werte oeb-page-head and oeb-page-foot ergänzt, die dem Kopf- bzw. Fußbereich eines gedruckten Dokuments entsprechen. Bislang (Ende 2012) wurde dieses Eigenschafts-Paar jedoch noch von keinem Lesegerät implementiert.

Wie bereits in der Vorgängerversion wird auch für die EPUB-Version 3 die Unterstützung des CSS-Profils nicht als verpflichtend für Lesegeräte festgelegt. Gleichzeitig wird eine optionale Unterstützung weiterer CSS-Eigenschaften, die nicht explizit im Standard beschrieben werden, nicht ausgeschlossen.


4 Während der Name des Verzeichnisses nicht festgelegt ist, ist diese Bezeichnung basierend auf dem früheren E-Book-Standard „Open Publication Structure“ sehr verbreitet.

5 Ein Codec ist eine Art Treiber, der zur Entschlüsselung und damit zur Wiedergabe einer Multimedia-Datei benötigt wird.

6 Die Arbeit an HTML 5 wird voraussichtlich 2014 abgeschlossen sein, vgl.
http://http://dev.w3.org/html5/decision-policy/html5-2014-plan.html

7 Ermöglicht die direkte Adressierung eines Dokumentelements. toc.xhtml#kapitel1 verweist zum Beispiel auf das HTML-Element mit der ID „kapitel1“ der Datei toc.xhtml.

8 Clientseitige Anwendungen laufen im Unterschied zu serverseitigen Anwendungen direkt auf dem Endgerät des Anwenders ab.