EPUB E-Book erstellen

Um eigene E-Books zu erstellen müssen Sie zuerst entscheiden, in welchem Format Sie das E-Book später ausgeben möchten (siehe oben). Wenn Sie ein Skript mit Bildern und Grafiken in ein E-Book umwandeln möchten, nutzen sie hierfür am besten ein Textverarbeitungsprogramm wie Word und konvertieren die Inhalte am Ende in ein PDF oder EPUB.

Die Herausforderung bei einer Konvertierung in EPUB liegt beim HTML Code. Word erstellt erfahrungsgemäss keinen sauberen HTML Code, dies kann bei der Validierung für EPUB zu Problemen führen.

Um interaktive Bücher im EPUB3 Format zu erstellen, müssen Sie sich mit HTML5 auseinandersetzten. Apple bietet zwar mit iBooks Author eine sehr einfache Software für das Erstellen von interaktiven E-Books. Allerdings läuft iBooks Author nur auf OSX und die damit erstellen E-Books können aktuell ausschliesslich über die App iBooks von Apple auf dem iPad geöffnet werden.

Vorformatierung im Word [Bearbeiten]

Am Anfang eines jeden E-Books steht ein Skript. Das Skript können Sie mit Microsoft Word erstellen. Wichtig dabei ist, dass sie sich auf die Inhalte konzentrieren und das Dokument sauber und einfach formatiert ist. Sie bereiten im Word nur die Inhalte vor, die Formatierung für das fertige E-Book findet später, in einem anderen Programm statt. Formatierungen von Word führen bei der Validierung von EPUB zu Problemen, deshalb ist es am besten, wenn Sie so wenig Formatierungen nutzen wie möglich, d.h.

  • Korrekt formatierte Überschriften mit Überschrift 1, Überschrift 2 usw.
  • Korrekt formatierte Absätze mit Erstzeileneinzug oder Absatzformat (Abstand nach Absatz z.B. 6 Pt).
  • Absatzwechsel nur am Ende eines Absatzes, keinesfalls sollten nach einem Absatz mehr als vier Absatzwechsel nacheinander folgen.
  • Keine Tabulatoren
  • Keine Texte in Spalten
  • Keine Texte in Tabellen
  • Keine Texte in Textkästchen
  • Keine exotische Schriften

Das mag langweilig klingen, ist aber für die korrekte Darstellung auf verschiedenen Endgeräten unverzichtbar.

  1. Erstellen Sie eine Sicherungskopie Ihres ursprünglichen Skriptes, bevor sie mit der Formatierung beginnen.
  2. Blenden Sie die Formatierungssymbole ein.
    Formatierungssymbole
  3. Falls Sie Textkästchen genutzt haben, löschen Sie diese und stellen Sie die als normalen Text dar (Textkästchen werden in E-Books nicht richtig angezeigt).
  4. Formatieren Sie das ganze Skript im Standard Stil. Dieser Schritt ist nötig um alle Sonderformatierungen zu entfernen und sicherzustellen, dass überall dieselbe Schriftart, Schriftgrösse und derselbe Zeilenabstand und Spiegelsatz (linksbündig) verwendet wird.
    Standardformatierung
  5. Die Standardschrift können Sie in der Formatvorlage selber definieren. Die ZHAW nutzt als Standardschrift Arial, 9 Punkt. Für E-Books eignet sich z.B. Times New Roman, Arial and Garamond, 11 bis 12 Punkt gut. Um die Standarschrift zu ändern klicken Sie auf den kleinen Pfeil unterhalb von Formatvorlage ändern.
    Formatvorlage ändern
  6. Wählen Sie in der Liste (erscheint normalerweise rechts) die Standardschrift aus und klicken im Kontextmenü auf Ändern.
    Ändern der Formatvorlage
  7. Nun können Sie die gewünschte Schrift und Schriftgrösse wählen.
    Schriftgrösse und Schrift ändern
  8. Jetzt können Sie ihr Skript nochmals durchgehen und die verloren gegangenen Formatierungen, wie z.B. Fett oder zentriert wieder einsetzten. Nutzen Sie für die Überschriften konsequent die Formatvorlagen und achten Sie darauf, dass keine Überschrift grösser als 14 Punkt ist.
    Formatforlage auswählen

Hyperlink

Sie können sowohl im PDF als auch im EPUB Format Hyperlinks setzen. Klicken Sie auf den Text, den Sie verlinken möchten und dann im Register Einfügen auf Hyperlink.
Hyperlink einfügen

Achten Sie darauf, dass der Hyperlink mit http:// erfasst wird:
Hyperlin mit http erfassen

Seitenumbruch und Abschnittswechsel

EPUB kennt keine Seitenumbrüche und Seitenumbrüche aus Word werden bei der Validierung zu EPUB oft als fehlerhaft erkannt. Lassen Sie die Seitenumbrüche weg, sie können Sie später in einem Programm für die Bearbeitung des EPUBs einfügen.
Seitenumbruch

Auch Abschnittswechsel können nicht übernommen werden, ersetzten Sie die Abschnittswechsel durch drei bis vier Absatzwechsel ().
Abschnittswechsel
Sie können Kapitel auch optisch durch zentrierten Text wie z.B. „****“ oder einem Icon/Grafik, z.B. dem ZHAW Logo trennen. Benutzen Sie keine Trennlinien, um die Kapitel zu trennen.

Bilder

Bilder in E-Books müssen als separate Bilder in einem Ordner abgelegt werden. Achten Sie darauf, die Bilddateien klar zu benennen und legen Sie die Originaldatei in einem Ordner ab, Sie werden sie später brauchen. Sie müssen die Bilder später im EPUB nochmals neu setzen, weil die Bildpfade aus dem Word nicht übernommen werden. Sie können die Bilder deshalb auch erst in einem späteren Schritt hinzufügen und im Skript nur auf die Bilder hinweisen, z.B. mit einer Notiz in Klammern [Bild: Bambus].

Bildformat

Für EPUB nutzen Sie idealerweise das PNG (.png) Bildformat, weil es dank seiner Transparenz auf farbigen Hintergründen schöner dargestellt wird. JPEG (.jpg) Bilder sind jedoch auch erlaubt.

Bildgrösse

Bildschirmfüllende Bilder sollten nicht grösser als 600 x 800 Pixel sein. Damit passen sie noch auf eine E-Book Seite auf einem Tablet. Bilder im Text sollten nicht breiter als 300 Pixel sein. Die meisten E-Book Reader verkleinern die Bilder automatisch, damit sie auf den Bildschirm passen. Um Bilder zuzuschneiden nutzen Sie Microsoft Office 2010, Photoshop oder die kostenlose online Bildbearbeitungssoftware http://pixlr.com/editor oder www.fotor.com.

Um ein Bild mit Microsoft Office 2010 zu bearbeiten klicken Sie mit der rechten Maustaste auf die Bilddatei im Dateibrowser > Öffnen mit > Microsoft Office 2010

Microsoft Office 2010

Dateigrösse

Die Dateigrösse sollte 5 MB nicht überschreiben. Sie können die Dateigrösse reduzieren, in dem Sie  in Microsoft Office 2010 auf Bild komprimieren klicken. Wählen Sie eine Komprimierung für E-Mail (96 dpi).
Bilder komprimieren

Videos

Sie können in EPUB E-Books Videos einfügen. Es macht jedoch keinen Sinn, diese bereits ins Word Dokument einzubetten. Weisen Sie im Skript mit einer Notiz in Klammern [Video: Bären] auf das Video hin.

Formatierungen und Sonderzeichen

Die können Text fett, kursiv, unterstrichen und durchgestrichen darstellen. Bei Sonderzeichen ist hingegen eher Vorsicht geboten. Symbole, die über Einfügen > Symbol eingefügt werden, werden in einigen E-Readern nur als Fragezeichen dargestellt.

Kopf- und Fusszeilen

Weil EPUB keine fixen Seitenenden kennt, gibt es auch keine Kopf- und Fusszeilen. Wenn Sie also ein EPUB E-Book erstellen möchten, müssen Sie alle Kopf- und Fusszeilen aus Ihrem Skript entfernen. Dazu gehören auch das ZHAW Logo, der Hinweis der Zürcher Fachhochschulen und die Seitenzahlen in den ZHAW Vorlagen. Für Anmerkungen können Sie Endnoten verwenden.

Navigation

EPUB E-Books bestehen aus mehreren Dateien, die über eine Navigation zugänglich gemacht werden. Die Leser können so einzelne Kapitel im Buch direkt ansteuern. Jedes EPUB E-Book beinhaltet ein sog. Navigation Document in dem die Hauptnavigation bzw. die logische Reihenfolge der Inhalte (Kapitel) gespeichert ist.

Viele Programme, welche Word in EPUB umwandeln können, nutzen die Überschriften, um daraus eine Navigation zu erstellen. Leider können Sie für das Erstellen eines Inhaltsverzeichnisses nicht das Inhaltsverzeichnis von Microsoft Word nutzen, da dieses und auf Seitenzahlen verweist. Seiten sind im EPUB Format nicht relevant, weil die Seitenzahl von der Bildschirmgrösse des Endgerätes abhängig ist.

Das Inhaltsverzeichnis sollte aus Hyperlinks bestehen. Sie können es später direkt in Sigil erstellen und können deshalb im Word auf ein Inhaltsverzeichnis verzichten.

Word in HTML konvertieren [Bearbeiten]

Um aus einem Word-Dokument ein EPUB erstellen zu können, müssen Sie die Inhalte als erstes in HTML umwandeln. Da Word keinen sauberen HTML Code erstellt, müssen Sie die Word-spezifischen HTML Elemente zuerst rauslöschen.

Markieren Sie den Inhalt ihres Word Dokumentes mit der Tastenkombination CTRL + A und kopieren Sie den gesamten Inhalt mit CTRL + C.

Öffnen Sie den kostenlosen Doc to HTML Converter http://word2cleanhtml.com und fügen Sie den gesamten zuvor kopieren Inhalt aus dem Word Dokument mit der Tastenkombination CTRL + V ein.

Achten Sie darauf, dass folgende Säuberungsmechanismen angekreuzt sind:

  • Remove empty paragraphs
  • Convert <b> to <strong>, <i> to <em>
  • Replace non-breaking spaces with ordinary spaces

Klicken Sie danach auf convert to clean HTML.
Convert Word to Clean HTML

Markieren Sie den gesamten gesäuberten HTML Code mit CTRL + A und kopieren Sie ihn mit CTRL + C.

HTML in EPUB konvertieren [Bearbeiten]

Um ein EPUB3 zu erstellen benötigen Sie z.B. den kostenlosen EPUB E-Book Editor Sigil.

Wenn Sie Sigil auf dem PC oder Notebook der ZHAW nutzen möchten, füllen Sie bitte den Antrag für Softwarebeschaffung aus und lassen Sie ihn von Ihrem/r Vorgesetzten unterschreiben.

  1. Öffnen Sie Sigil
  2. Wählen Sie die Code Ansicht
  3. Klicken Sie links im Buch-Browser im Ordner Text auf die xhtml Seite. In diesem Beispiel heisst die Seite Section0001.xhtml
    Code Ansicht in Sigil
  4. Fügen Sie den zuvor kopierten HTML Code mit CTRL + V zwischen den zwei Body-Tags <body> und </body> ein. Der Quellcode ersetzt sozusagen den im Bild oben gelb markierten Abschnitt <p>&nbsp;</p>
    HTML Code in Sigil einfügen
  5. Wechseln Sie zurück auf die Buchansicht und prüfen Sie, ob die Formatierungen, insbesondere die Aufzählungszeichen, richtig übernommen wurden. Falls nicht müssen Sie diese neu formatieren.

Bilder einfügen

Die Bilder sind zwar sichtbar, sie müssen jedoch für die korrekte Darstellung im Ordner Bilder abgelegt werden und von dort aus in das Dokument eingefügt werden.

  1. Klicken Sie auf Datei > Hinzufügen > Bestehende Dateien.
    Neue Datei in Sigil hinzufügen
  2. Öffnen Sie den Ordner mit den Bildern und wählen Sie den ganzen Inhalt daraus aus. Die Bilder wurden nun in Sigil in den Ordner Bilder eingefügt:
    Bilder in Sigil
  3. Markieren Sie das Bild im Text und klicken Sie auf Bilder einfügen.

    Bild einfügen

  4. Wählen Sie im Ordner Images das Bild aus, das am entsprechenden Ort eingefügt werden soll. Wiederholen Sie diesen Schritt für jedes Bild im Dokument. Der HTML Code für die Bilder sollten wie folgt aussehen: <img alt="hier steht ein Beschreibender Bildtext" src="../Images/image1.png" />. Achten Sie darauf, dass Sie keine Bildpfade haben die auf ein Laufwerk verweisen!

    Bild HTML Code

Video einfügen

Sie können neu Videos einfügen, obwohl Sigil auf EPUB2 basiert. Der Videocode wird bei der Validierung einen Fehler angeben, dies können Sie jedoch überspringen, da wir das E-Book für EPUB3 produzieren und Videos dort unterstützt werden.

Nutzen Sie ausschliesslich MPEG 4 (.mp4) Videodateien mit einer H.264 Codierung, damit die Dateien auch auf Tablets abspielbar sind. Für das Umcodieren können Sie die kostenlose Software Handbrake oder je nach Ausgangsformat auch den Onlinedienst https://cloudconvert.com. Achten Sie bei der Konvertierung darauf, dass das H.264 Format ausgewählt ist.

1) Klicken Sie hierzu auf Datei > Hinzufügen > Bestehende Dateien.

Stylesheet hinzufügen

2) Öffnen Sie den Ordner mit dem Video und wählen Sie das gewünschte Video aus. Das Video wird nun in den Ordner Video eingefügt:

Video auswaehlen

3) Wählen Sie die Stelle im Text, an der Sie das Video einfügen möchten und klicken Sie in der Menüleiste auf Datei einfügen. Nun können Sie das Video auswählen und einfügen. Der Code wird im Hintergrund automatisch generiert.

Video auswaehlen

4) Das Video kann in Sigil nicht abgespielt werden, es wird jedoch angezeigt. Die Fehler, die bei der Validierung angezeigt werden, können Sie ignorieren, sie basieren auf dem EPUB2 Standard, der Video nicht unterstützt.

Validierungsfehler Video

Audio einfügen

Sie können auch Audiodateien im Format MP3 (.mp3) einfügen. Gehen Sie dabei genau gleich vor wie beim Einfügen der Videos, mit dem Unterschied, dass Audiodateien im Audio Ordner eingefügt werden. Die Fehlermeldungen bei der Validierung können Sie auch hier ignorieren.

Audio einfügen

Metadaten erfassen

Ein EPUB muss immer Informationen zum Titel, dem Autor und der Sprache enthalten.

  1. Klicken Sie in Sigil auf Werkzeuge > Metadaten-Editor.
    Metadaten erfassen in Sigil
  2. Erfassen Sie den Titel, den Namen des Autors und die Sprache und bestätigen Sie die Eingabe mit OK.
    Meta Editor
  3. Wenn Sie weitere Infos wie eine ISBN Nummer oder Inforationen zum Verlag hinzufügen möchten können Sie auf + Basis Infos klicken.
    Erweiterte Metadaten

Stylesheets erstellen

Wenn Sie aus einem Word-Dokument ein EPUB erstellen, sind die Stylesheets nicht in einem separaten CSS, sondern direkt in den xhtml Dokumenten enthalten. Stylesheets sind jene Dokumente, welche das Erscheinungsbild Ihres EPUB definieren, also z.B. welche Schriften, welche Schriftgrössen, Farben usw. verwendet werden. Um ein sauberes EPUB Dokument zu erstellen sollten Sie die Stylesheets in einem .css Dokument im Ordner Formatierungen speichern.

  1. Erstellen Sie im Ordner Formatierungen ein neues Stylesheet. Klicken Sie hierfür auf Datei > Hinzufügen > Leeres Stylesheet.
    Stylesheet hinzufügen
  2. Im Ordner Formatierungen wurden nun ein neues CSS Dokument hinzugefügt. Klicken Sie mit der rechten Maustaste auf das CSS Dokument und wählen Sie im Kontextmenü Umbenennen. Nennen Sie das neue Dokument um in stylesheet.css
    Stylesheet umbenennen
  3. Fügen Sie in Ihrem xhtml Dokument im Ordner „Text" nach dem <title></title> Tag folgenden Code ein: <link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" />. Falls Sie bereits mehrere Dokumente haben, müssen Sie diesen Code in jedes xhtml Dokument einfügen.
    Stylesheet verlinken

Nun haben Sie im Ordner Formatierungen ein Dokument namens stylesheet.css, welches alle Formatierungen ihres E-Books enthält und in jedem xhtml Dokument verweisen Sie auf dieses Dokument.

Erfahrungsgemäss sind die Formatierungen, die aus Word als CSS exportiert werden nicht sehr benutzerfreundlich und übersichtlich. Es empfiehlt sich, die Formatierung im CSS Dokument manuell zu überarbeiten oder sie ganz durch eine eigene CSS Formatierung zu ersetzen (Vorlagen folgen).

Wenn Sie nicht auf die CSS Vorlagen der ZHAW warten möchten, können Sie  www.typetester.org/ nutzen, um einfache CSS Formatierungen für die Überschriften und den Fliesstext zu erstellen.

Wählen Sie auf www.typetester.org die gewünschte Schriftart z.B. für die Überschrift oder den Fliesstest, wählen Sie die gewünschte Grösse und exportieren Sie die Spalte als CSS unter Get CSS for 1st, 2nd, 3rd column. Fügen Sie den Code in das Dokument stylesheet.css ein.

Typetester

Für den Fliesstext in E-Books eignen sich z.B. die Schriften Times New Roman, Arial and Garamond, 11 bis 12 Punkt gut. Die Überschrift sollte nicht grösser als 14 Punkt sein.

Hinweis: Typetester misst die Schriftgrösse in Ems (em). 1 em entspricht der definierten Standardgrösse Ihres Browsers. 1.5 em sind 150% dieser Standardgrösse. Wenn Sie also als Standardgrösse 12 Punkt definiert haben, entspricht dies 1 em. Sie können für den Fliesstest z.B. 1 em und für die Überschrift 1.2 em definieren.

Kapitel erstellen

In Sigil können Sie für jedes Kapitel eine neue Seite erstellen. Hierfür klicken Sie im Buch-Browser auf die Seite im Ordner Text. In diesem Beispiel heisst die Seite Section0001.xhtml.

Fügen Sie nun am Ende eines jeden Kapitels einen Kapitelumbruch mit der Funktion Teilung am Cursor ein. Achten Sie darauf, dass der Umbruch im Code vor dem Tag <h1> eingefügt wird. Wiederholen Sie diesen Schritt für jedes Kapitel.
Kapitelumbruch

Seiten umbenennen

Sie sollten nun pro Kapitel eine xhtml Seite im Ordner Text haben. Um den Überblick zu behalten sollten Sie die Seiten nach Kapitel benennen. Klicken Sie hierzu mit einem Rechtsklick auf die erste Seite und wählen Sie im Kontextmenü Umbenennen.
Seite umbenennen

Verwenden Sie für die Seitenbezeichnung möglichst einfache und klare Namen ohne Sonderzeichen, Umlaute und Leerschläge.
Seitenbezeichnung

Inhaltsverzeichnis erstellen

Sigil erstellt, basierend auf den Überschriften im Skript ein Inhaltsverzeichnis. Diese Funktion funktioniert nur, wenn Sie die Überschriften in Ihrem Skript konsequent als Überschrift 1, Überschrift 2 und Überschrift 3 formatiert haben. Falls Sie dies nicht gemacht haben können Sie dies nachholen, in dem Sie alle Überschriften im Skript mit der Formatierungsfunktion von Sigil als Heading 1, Heading 2 oder Heading 3 formatieren.
Überschriften formatieren in Sigil

  1. Klicken Sie rechts in der Spalte für das Inhaltsverzeichnis auf Erzeuge Inhaltsverzeichnis aus den Überschriften.
    Inhaltsverzeichnis erstellen
  2. Wählen Sie die Einträge aus, die im Inhaltsverzeichnis erscheinen sollen und klicken Sie auf OK.
    Einträge für Inhaltsverzeichnis auswählen
  3. Sigil erstellt nun ein entsprechendes Inhaltsverzeichnis für EPUB.Um das Inhaltsverzeichnis anzuzeigen klicken Sie auf Ansicht > Inhaltsverzeichnis.
    Inhaltsverzeichnis

Dieses Inhaltsverzeichnis wird im Reader später vom System angezeigt und ist nicht Teil des Buches. Sie können zusätzlich noch zu Beginn des E-Books ein klassisches Inhaltsverzeichnis einfügen.

  1. Erstellen Sie eine neue Seite für das Inhaltsverzeichnis unter Datei > Hinzufügen > Leere HTML Datei.
    Leere HTML Seite einfügen

  2. Klicken Sie auf Werkzeuge > Inhaltsverzeichnis > Erstelle HTML Inhaltsverzeichnis.
    Inhaltsverzeichnis

  3. Sigil fügt nun ein automatisch generiertes Inhaltsverzeichnis ein.

Buchtitel einfügen

Jedes EPUB Dokument braucht einen Buchtitel. Der Buchtitel kann entweder aus Text oder einem Bild (.png) mit einer Maximalgrösse von 600 x 860 Pixel bestehen. Sie müssen das Bild vor dem Import in Sigil mit einem Bildbearbeitungstool erstellen.

  1. Fügen Sie das Titelblatt als Bild ein. Hierzu wechseln Sie zuerst auf die Buchansicht und klicken dann auf Datei > Hinzugügen > Bestehende Dateien.
    Leerer Abschnitt für Buchtitel hinzufügen
  2. Wählen Sie das zuvor erstellte Titelblatt (Bild) aus.
  3. Das Titelbild wird nun im Ordner Bilder angezeigt. Klicken Sie mit der rechten Maustaste auf das Titelbild im Ordner Bilder und wählen Sie im Kontextmenü Semantik hinzufügen > Deckblatt-Bild.
    Semantik für Deckblatt hinzufügen
  4. Nun müssen Sie noch eine neue xhtml Seite für das Titelbild erstellen. Klicken Sei auf Datei > Neu > Leere HTML Datei.
    Leerer Abschnitt für Seite hinzufügen
  5. Benennen Sie die neu erstellte xhtml Seite um in titelblatt.xhtml und schieben Sie die Seite an den Beginn der Liste, damit sie die erste Seite im Ordner Text ist.
    Buch-Browser
  6. Klicken Sie mit der rechten Maustaste auf die Seite und wählen Sie im Kontextmenü Semantik hinzufügen > Buchdeckel.
    Semantik für Titelblatt hinzufügen
  7. Klicken Sie in die Seite und fügen Sie das Titelbild ein.
    Titelbild einfügen
  8. Sie haben nun eine xhtml Seite „titelblatt.xhtm" mit einem Titelbild.

EPUB validieren

Nachdem Sie Ihr E-Book so formatiert haben, wie sie es wünschen müssen Sie das Dokument für EPUB validieren.

Hierzu klicken Sie oben rechts auf validate EPUB with FlightCrew. Wenn Sie Videos in Ihr EPUB eingefügt haben wird SIGIL hier einige Fehlermeldungen zum Video bringen. Diese können Sie ignorieren.
EPUB validieren

Zusätzlich zum SIGIL Validator können Sie Ihr EPUB auch vom International Digital Publishing Forum auf http://validator.idpf.org/ testen lassen.

Weiter: Interaktive E-Books