A good EPUB file has:
1. The simplest possible formatting.
2. A design that reflects the meaning of the text.
Smart reading systems:
1. Ebook acquisition
Discovery and purchase or acquisition
2. Rendering engine
Displays text on the screen
3. Pagination and navigation
Allows users to turn pages or jump into the book
4. User customizations
Allow users to change fonts, colors
5. User annotations
Allow users to bookmark, add notes
10. Simple formatting <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div>
11. This is readable even without styles Main header Subsection First sentence. Second sentence. Next paragraph. Another scene.
12. ...however there is a problem Main header Subsection First sentence. Second sentence. Next paragraph. Another scene.
13. The author wants to show a scene change Main header Subsection First sentence. Second sentence. Next paragraph. Another scene.
14. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> Indent first line of paragraphs
15. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> # Indent 1st line p:first-line { text-indent: 2em; }
16. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> Minimize space between paragraphs.
17. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> # Indent 1st line p:first-line { text-indent: 2em; } # Minimize p space p { margin:0; }
18. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> Add spacing between scene changes.
19. Styling <h1> Main header </h1> <h2> Subsection </h2> <div class=” section ”> <p> First sentence. Second sentence. </p> <p> Next paragraph. </p> </div> <div class=” section ”> <p> Another scene. </p> </div> # Indent 1st line p:first-line { text-indent: 2em; } # Minimize p space p { margin:0; } # Section spacing div.section { margin: 1em 0 1em 0; }
20. Much better! Main header Subsection First sentence. Second sentence. Next paragraph. Another scene.
21. Why are good EPUBs hard? EPUB authoring Proofing Validation Testing This cycle can be expensive when done manually.
22. Creation from other XML formats helps XML source Transformation Some transformations (e.g. DocBook to EPUB) have free, public automation tools and produce already-tested output.
23. Non-XML transformations may not work well Microsoft Word Possible but not easy PDF Almost impossible to automate Quark Some vendors provide conversion
24. Non-XML transformations may not work well When converting large backlists from paper or old formats, it is best to work with an experienced digitization firm.
25. Good methods to produce EPUB XML workflows Web development tools InDesign CS4+
27. Ebook acquisition Discovery and purchase or acquisition Rendering engine Displays text on the screen Pagination and navigation Allows users to turn pages or jump into the book User customizations Allow users to change fonts, colors User annotations Allow users to bookmark, add notes
28. Acquisition Users should be able to find books, buy them, download them or add books from their own personal libraries.
29. Importing ebooks Users want to be able to move their books between ereaders as they buy new hardware or software. A good ereader makes it easy to import other books. It is easy to add personal books to iBooks but the user must be connected via USB. It is better to let users add books wirelessly .
30. Finding ebooks Ereaders may include their own custom ebook store. It is often easy for users to purchase but hard to import their own personal books.
31. Finding ebooks One method of finding books across different ebook stores is OPDS , or the Open Publication Distribution System.
32. Finding ebooks With OPDS users can search , find and acquire books from many stores and many reading systems. A good EPUB reading system supports OPDS !
38. Test and preview in: RMSDK WebKit on large device WebKit on mobile device
39. Pagination and navigation EPUB <spine> Users must be able to move from page to page (EPUB needs to allow the page direction to be modified to be left to right or right to left!)
41. Pagination and navigation Good Ereaders also: Remember the last page you read. Sync reading position across devices. Paginate quickly and accurately.
42.
43.
44. A smart reading system: Lets users pick their preferred way to read. Honors the intent of the author and book designer. Is optimized for the hardware that it runs on.
Some ereaders are software that runs on a computer. Some run on mobile phones. They use different languages fonts and screen technologies.
Ereaders come in different sizes. The best part of EPUB is that books can be “flowed” into different size screens.
Not all books are appropriate for reflowable text. Examples include some poetry or other texts where the exact layout of the lettering is critical.
But most books can be adapted to reflowable text quite nicely, even most poetry.
Here is a very simple English document. I will use it to show how to keep the HTML very clean (for all ereaders) and then improve the display for ereaders that support good styling.
This is what the book would look like without any styles. You can tell where the paragraphs are and how important the various headers are by their size and whether they are bold.
Some ideas from the author are missing. The reader cannot tell that “Next paragraph” is part of the same scene as “First sentence.” Everything seems to run together. Also it is hard to tell where a paragraph starts.
I will show how to make these changes that will look nice in ereaders and convey what the author wanted to show.
This is the CSS code to indent only the first line of a paragraph. This helps with readability. Some ereaders will do this automatically, some will not.
The author also wants to minimize space between paragraphs to look more like a traditional book.
The most important change is to add spacing between scenes. This is how many authors indicate that time has passed, or the location of the scene has changed.
We use the “section” class to indicate that the next set of paragraphs should have spacing above and below.
Amazon lets users browse and search books very easily. But they do not use EPUB so it is impossible for users to add books from other ebook stores.
The second major part of any reading system is the rendering engine. I’m going to talk about two major commercial rendering engines.
Adobe Reader Mobile SDK is found on most of the hardware e-ink devices.
My next reading system is not really a reading system, but a web browser engine. WebKit powers a number of different web browsers and mobile browsers. If you’ve used Chrome, Safari, iOS or Android, you’ve used WebKit.
Because EPUB is so similar to web technologies, WebKit makes an excellent tool for building an ereader. Most mobile ereaders use WebKit including Apple iBooks.
Because these two rendering engines are so common, I recommend testing your EPUB in just 3 system: test in one RMSDK device/software (usually Adobe Digital Editions), one “big WebKit” like a web browser or iPad, and one “small WebKit”, or mobile device or browser.
After letting people get books and then read them, the next thing a reading system must do is let users move throughout the book. Pagination is one method, that lets users move between the spine of the EPUB book.
The NCX table of content is provided in an EPUB to let users understand how to jump directly into just one chapter or section of interest. A reading system must display the NCX table of contents in a clear way.