Digitale Bücher im Format EPUB 2 selbst erstellen: Navigation

Gut Buch will Weile haben.
Friedrich Wilhelm Nietzsche

Projektmenü; Überblick; Erläuterungen zu EPUB 3; Erläuterungen zu EPUB 2

Inhalt

Überblick
Die Navigationskarte
Die Seitenliste
- Die Seiten der Seitenliste
- Beispiel: Seitenliste
Navigationsliste
- Die Seiten der Navigationsliste
- Beispiel: Navigationsliste

Das Inhaltsverzeichnis für den Leser oder die Navigation wird im Element navMap der NCX-Datei notiert. navMap ist ein Kindelement von ncx, welches auf die Kopfinformationen folgt.
Im einfachsten Falle wird für jedes Kapitel darin ein Navigationspunkt notiert. Dies ist jeweils ein Element navPoint mit entsprechenden Angaben zum Navigationspunkt.

Auf navMap kann dann optional ein Element pageList mit Informationen zu allen Seiten oder eher Dokumenten im Buch folgen, also ähnlich dem bereits für das OPF-Dokument diskutierten spine, nur hier für den Leser aufbereitet.
Optional folgen darauf weitere Elemente navList. Ähnlich wie mit navMap kann damit eine Navigation umgesetzt werden, aber ähnlich wie bei guide im OPF-Dokument besteht sie nur aus direkten Einstiegspunkten ohne weitere Verschachtelung.

Als wichtiger Hinweis: Die meisten Darstellungsprogramme scheinen nur Inhalte der navMap im Inhaltsverzeichnis zu berücksichtigen. Möchte man also einigermaßen sichergehen, daß auch alles Aufgeführte angezeigt wird, sollten alle Navigationspunkte in der navMap aufgeführt sind. Abweichend von der NCX-Empfehlung sollte man dann also darauf folgende optional mögliche Elemente nicht verwenden, damit dem Leser nicht durch grobe Mängel und Fehler der Darstellungsprogramme Teile des Inhaltsverzeichnisses verborgen bleiben.
Da hier allerdings primär die Empfehlung erläutert wird, werden auch die weiteren Möglichkeiten erklärt.

Die Navigationskarte

navMap soll ein komplettes Inhaltsverzeichnis für den Leser bieten, über alle Verschachtelungsebenen wie eigenständige Werke im Buch, deren Kapitel, deren Unterkapitel und Unterabschnitte etc. Dies ist dann die Navigationskarte.

Der typische Inhalt von navMap sind optionale navInfo-Elemente, optionale navLabel-Elemente und mindestens ein navPoint-Element.

navMap kann ein Attribut id für einen Fragmentidentifizierer haben.

Navigationspunkte

Ein Navigationspunkt der Navigationskarte wird mit einem Element navPoint repräsentiert. Das sind jeweils die normalen Inhaltsseiten eines Buches, theoretisch nicht solche mit technischen Informationen oder Metainformationen, letztere werden in der pageList notiert. Praktisch sollte man aber alle für das Inhaltsverzeichnis relevanten Seiten so notieren, weil die Darstellungsprogramme grobe Mängel und Fehler bei der Interpretation der anderen Navitationsstrukturen aufweisen.

Erforderlich ist für jedes navPoint in der Navigationskarte navMap ein Attribut id für einen Fragmentidentifizierer. Der Wert ist also einmalig für das Dokument und von der bereits beschriebenen Struktur, beginnend mit einem Buchstaben, optional dann weitere Buchstaben, Ziffern, Minuszeichen und Unterstriche.

Ebenfalls erforderlich ist für navPoint ein Attribut playOrder. Damit werden die Navigationspunkte durchnumeriert, angefangen mit 1 als Wert für den ersten Navigationspunkt, 2 für den zweiten und so weiter.

Optional kann ein Attribut class notiert werden, welches die gleiche Bedeutung hat wie bei XHTML.

Der Inhalt eines navPoint beginnt mit einen navLabel für die Beschriftung des Navigationspunktes. Bei Bedarf kann mehr als ein navLabel notiert werden.

Auf navLabel folgt dann ein Element content, welcher den Inhalt referenziert.

Optional können darauf als weitere Kindelemente von navPoint weitere Elemente navPoint notiert werden, das stellt dann die nächste Navigationsebene für Unterkapitel oder Unterabschnitte dar.

Navigationsbeschriftungen

Mit navLabel werden in den Elementen navMap, navPoint, pageList, pageTarget, navList, oder navTarget Navigationsbeschriftungen notiert. Diese sollten kurz gehalten werden.

Die Beschriftung steht als Text im Kindelement text.
Außerdem kann als weiteres Kindelement auch noch ein Bild mit img referenziert werden.

Mit xml:lang kann wieder eine Sprachangabe erfolgen, mit dir die Angabe der Schreibrichtung. Zu beachten ist dabei, daß Unicode die Schreib- oder Leserichtung für Zeichen automatisch festlegt. Im Normalfalle muß man sich also um dieses Problem nicht kümmern, lediglich, wenn man davon abweichen möchte. Mit dem Wert 'ltr' geht die Richtung von links nach rechts, wie man das für lateinische Schrift kennt. Mit 'rtl' geht es von rechts nach links, wie man das von hebräisch oder arabisch kennt.

Insbesondere kann mit mehreren navLabel mit unterschiedlichen Angaben zu xml:lang eine mehrsprachige Beschriftung erreicht werden.

Navigationsinformationen

Mit navInfo können in den Elementen navMap, pageList oder navList Navigationsinformationen notiert werden. Anders als bei navLabel können hier ausführlichere Informationen stehen.

Die Beschriftung steht als Text im Kindelement text.
Außerdem kann als weiteres Kindelement auch noch ein Bild mit img referenziert werden.

Mit xml:lang kann wieder eine Sprachangabe erfolgen, mit dir die Angabe der Schreibrichtung.

Insbesondere kann mit mehreren navInfo mit unterschiedlichen Angaben zu xml:lang eine mehrsprachige Information erreicht werden.

Inhaltsreferenz

content referenziert den Inhalt, auf den mit einem Navigationspunkt navPoint oder navTarget verwiesen werden soll. Dazu wird mit src als Attribut von content eine Inhaltsdatei oder ein Fragment davon referenziert. Der Wert ist eine URI zum gewünschten Inhalt, im Bedarfsfalle mit angehängtem # und Fragmentidentifizierer, um auf den Beginn des Fragmentes zu verweisen.

Optional kann bei content auch mit id ein Fragmentidentifizierer notiert werden.

Text

Mit dem Element text wird in navLabel, docTitle, docAuthor oder navInfo die eigentliche Information als Text notiert.

Als Attribut kann bei text ein id mit einem Fragmentidentifizierer notiert werden. Zusätzlich kann noch das Attribut class notiert werden, welches ebenfalls die gleiche Bedeutung hat wie bei XHTML.

Bild

Nach einem text kann in navLabel, docTitle, docAuthor oder navInfo jeweils optional auch noch ein Bild angegeben werden. Dazu dient das Element img.
Mit dem Attribut src von img wird die URI der Bilddatei referenziert. Außerdem können wie bei text die Attribute id und class notiert werden.

Beispiel: Navigationskarte

Dazu ein ausführlicheres Beispiel mit einem Buch mit Kapiteln und Unterkapiteln:

  <navMap>
    <navInfo>
      <text>
        Das Konzept der Navigation durch die Sammlung von Pflanzenbüten:
        Es wird zwischen Bäumen, Sträuchern, Stauden und einjährigen Pflanzen
        unterschieden.
      </text>
      <img src="Logo.svg" />
    </navInfo>
    <navLabel>
      <text>Navigation Pflanzenblüten</text>
      <img src="Logo.svg" />
    </navLabel>  
    <navPoint id="titel" 
              playOrder="1">
      <navLabel>
        <text>Titel</text>
        <img src="titelnav.svg" />
      </navLabel>
      <content src="titelseite.xhtml"/>
    </navPoint>
    
    <navPoint id="b0" 
              playOrder="2">
      <navLabel>
        <text>Bäume</text>
        <img src="Eiche07.jpg" />
      </navLabel>
      <content src="baeume1.xhtml"/>
      <navPoint id="b1" 
              playOrder="3">
        <navLabel>
          <text>Eichen</text>
          <img src="Eiche03.jpg" />
        </navLabel>
        <content src="eichen1.xhtml"/>     
      </navPoint>     
      <navPoint id="b2" 
              playOrder="4">
        <navLabel>
          <text>Kastanien</text>
          <img src="Kastanie02.jpg" />
        </navLabel>
        <content src="kastanien1.xhtml"/>     
      </navPoint>
      <!-- etc noch mehr Bäume ... -->
    </navPoint>
    
    <navPoint id="s0" 
              playOrder="67">
      <navLabel>
        <text>Sträucher</text>
        <img src="Blutjohannisbeere01.jpg" />
      </navLabel>
      <content src="strauch1.xhtml"/>
      <navPoint id="s1" 
              playOrder="68">
        <navLabel>
          <text>Johannisbeere</text>
          <img src="Johannisbeere08.jpg" />
        </navLabel>
        <content src="johannisbeeren1.xhtml"/>     
      </navPoint>     
      <navPoint id="s2" 
              playOrder="69">
        <navLabel>
          <text>Stachelbeere</text>
          <img src="Stachelbeere02.jpg" />
        </navLabel>
        <content src="stachelbeeren1.xhtml"/>     
      </navPoint>
      <!-- etc noch mehr Sträucher ... -->      
     
    </navPoint>
  <navMap>

Die Seitenliste

Auf navMap folgt optional ein Element pageList mit Informationen zu allen Seiten oder eher Dokumenten im Buch, also ähnlich dem bereits für das OPF-Dokument diskutierte spine, nur hier für den Leser aufbereitet.

Als Inhalt hat pageList optional die bereits beschriebenen Elemente navInfo und navLabel in beliebiger Anzahl und es muß wenigstens ein Element pageTarget enthalten.
Für jedes Inhaltsdokument des Buches sollte ein pageTarget notiert werden.

Optional können bei pageList auch id und class mit beschriebener Bedeutung notiert werden.

Die Seiten der Seitenliste

Innerhalb von pageList werden mittels pageTarget Dokumente in der Seitenliste referenziert. Der Inhalt von pageTarget entspricht weitgehend dem eines Navigationspunktes, aber ohne weitere Unterlisten.

Zunächst können navInfo und navLabel notiert werden, mindestens ein navLabel. Dann ist ein content zu notieren.

Erforderliche Attribute von pageTarget sind id und playOrder wie für navPoint bereits beschrieben. Optional ist hier auch wieder class.

type ist ein weiteres erforderliches Attribut. Es kann die Werte 'front', 'normal' oder 'special' haben.
'front' bedeutet, daß eine Seite des Buches vorne vor dem eigentliche Inhalt mit römischer Numerierung angeordnet ist.
'normal' steht für normale Inhaltsseiten mit arabischer Numerierung.
'special' steht für sonstige Inhalte.

Optional ist ein Attribut value. Wert ist eine positive ganze Zahl als Seitenzahl der referenzierten Seite. Sofern das Attribut value verwendet wird, muß die Zuordnung der Seitenzahlen für jeden Wert von type eindeutig sein, dieselbe Zahl darf also nicht für mehrere Seiten des selben Typs notiert werden.

Beispiel: Seitenliste

Dazu ein ausführlicheres Beispiel:

  <pageList>
    <navInfo>
      <text>
        Übersicht über alle Pflanzenseiten.
      </text>       
      <img src="Logo.svg" />
    </navInfo>
    <navLabel>
      <text>Pflanzenblüten</text>
      <img src="Logo.svg" />
    </navLabel> 

    <pageTarget 
            id="titelnav" 
            playOrder="117"
            type="front">
      <navLabel>
        <text>Titel</text>
        <img src="titelnav.svg" />
      </navLabel>
      <content src="titelseite.xhtml"/> 
    </pageTarget>
        
    <!-- ... viele Seiten mit Blütenbildern ... -->   
    
    <pageTarget 
            id="lwz" 
            playOrder="158"
            type="normal">
      <navLabel>
        <text>Löwenzahn</text>
        <img src="Lwz02.jpg" />
      </navLabel>
      <content src="lwz.xhtml"/> 
    </pageTarget>    
    <pageTarget 
            id="gaensebl" 
            playOrder="159"
            type="normal">
      <navLabel>
        <text>Löwenzahn</text>
        <img src="Gaensebl02.jpg" />
      </navLabel>
      <content src="gaensebl.xhtml"/> 
    </pageTarget>    
    <!-- ... viele weitere Seiten mit Blütenbildern ... -->
    
    <pageTarget 
            id="pfindex" 
            playOrder="251"
            type="special">
       <navLabel>
        <text>Pflanzenindex</text>
        <img src="pfindex.svg" />
       </navLabel>
       <content src="pfindex.xhtml"/> 
    </pageTaget>   
  </pageList>

Navigationsliste

Mit navList kann auf pageList, beziehungsweise navMap folgend eine weitere Navigationsliste angeboten werden. Diese Liste ist vorrangig für die Listung von Seiten mit Sekundärinformation gedacht, etwa Index, Fußnoten, Verzeichnis aller Abbildungen oder Tabellen oder Literaturverzeichnis etc.

Die Struktur des Inhaltes ist ähnlich wie für pageList. Optional gibt es die bereits beschriebenen Elemente navInfo und navLabel in beliebiger Anzahl, aber wenigstens eines. Und es muß wenigstens ein Element navTarget enthalten.

Optional können bei navList auch id und class mit beschriebener Bedeutung notiert werden.

Die Seiten der Navigationsliste

Innerhalb von navList werden mittels navTarget Dokumente der Navigationsliste referenziert. Der Inhalt von navTarget entspricht weitgehend dem eines Navigationspunktes, aber ohne weitere Unterlisten.

Zunächst können navLabel notiert werden, mindestens eines. Dann ist ein content zu notieren.

Erforderliche Attribute von navTarget sind id und playOrder wie für navPoint bereits beschrieben. Optional ist hier auch wieder class.

Optional ist ein Attribut value. Wert ist eine positive ganze Zahl als Seitenzahl der referenzierten Seite. Sofern das Attribut verwendet wird, muß die Zuordnung der Seitenzahlen für die navList eindeutig sein, dieselbe Zahl darf also nicht für mehrere Seiten der Liste notiert werden.

Beispiel: Navigationsliste

Dazu ein ausführlicheres Beispiel:

  <navList>
    <navInfo>
      <text>
        Zusätzliche Navigation, Seitenindex, Stichwortverzeichnis.
      </text>       
      <img src="Logo.svg" />
    </navInfo>
    <navLabel>
      <text>Pflanzenblüten</text>
      <img src="Logo.svg" />
    </navLabel>
    
    <navTarget id="bib" playOrder="317">
       <navLabel>
        <text>Literatur</text>
        <img src="biblio.svg" />
       </navLabel>
       <content src="biblio.xhtml"/> 
    </navTarget>
    
    <navTarget id="bluetenindex" playOrder="318">
       <navLabel>
        <text>Blüten</text>
        <img src="bluetenindex.svg" />
       </navLabel>
       <content src="bluetenindex.xhtml"/> 
    </navTarget>
   
    <navTarget id="bilderindex" playOrder="319">
       <navLabel>
        <text>Bilder</text>
        <img src="bilderindex.svg" />
       </navLabel>
       <content src="bilderindex.xhtml"/> 
    </navTarget>
    
    <navTarget id="illuindex" playOrder="320">
       <navLabel>
        <text>Illustrationen</text>
        <img src="illuindex.svg" />
       </navLabel>
       <content src="illuindex.xhtml"/> 
    </navTarget>     
   
    <navTarget id="tabellenindex" playOrder="321">
       <navLabel>
        <text>Tabellen</text>
        <img src="tabellenindex.svg" />
       </navLabel>
       <content src="tabellenindex.xhtml"/> 
    </navTarget>     
    
    <navTarget id="stichwort" playOrder="322">
       <navLabel>
        <text>Stichwörter</text>
        <img src="stichwort.svg" />
       </navLabel>
       <content src="stichwort.xhtml"/> 
    </navTarget>    
    
    <navTarget id="meta" playOrder="323">
       <navLabel>
        <text>Metainformationen</text>
        <img src="meta.svg" />
       </navLabel>
       <content src="meta.xhtml"/> 
    </navTarget>   
    
  </navList>