Best Practices for Ebook Front Matter: Table of Contents, Part 1

Expert publishing blog opinions are solely those of the blogger and not necessarily endorsed by DBW.

Best Practices for Ebook Front Matter: Table of Contents, Part 1The front matter of a book communicates a lot of helpful and important information to readers. But publishers and authors often find themselves wondering how to handle that information in their ebook files. In the current installments of my column here on Digital Book World, I am delving into some best practices, ideas and options for these opening and ending parts of your ebook. In my last installment, we completed our discussion about the copyright page.

Note: As is my standard practice, the markup examples below are all suitable for EPUB 3 files. If you are still creating an EPUB 2 file for some reason, your mileage may vary.

The Nav Doc

In EPUB 2, the Table of Contents (TOC) is actually built into two different files: an HTML file that is visible to the reader as they turn pages through the EPUB, and the NCX file, which is an XML file that most reading systems display as a special navigation option, usually when you select a TOC option from a menu. The reason for using two different files was the need for a TOC that was structurally correct while also having the ability to style the TOC in a way that matches the print book.

In EPUB 3, the needs of these two files have been combined into one: the HTML Nav Doc. The structure of the TOC is achieved by constructing the TOC as an ordered list, and the styling is done in the stylesheet.

As part of this merger, the Nav Doc contains not only the Table of Contents of the book, but also the list of page numbers and additional lists of illustrations, tables, images and more. These were originally included in the NCX, as well, but from what I saw, not many publishers took advantage of them.

The TOC Section

The Table of Contents section is wrapped in a <nav> element that includes the epub:type attribute with a value of “toc“. You can include a heading under that, if desired, before opening the ordered list. Each item in the list should be inside an <a> element that links to the location of that section within the ebook. If the item is just being used for structural purposes, then it can be wrapped in a <span> element instead.

Here is a sample of a TOC section, as seen in The Book of Texas, my sample EPUB 3 file:

<nav id=”toc” epub:type=”toc”>

<h1>Contents</h1>

<ol>

<li><a href=”03-title_page.xhtml”>Title Page</a></li>

<li><a href=”04-copyright.xhtml”>Copyright</a></li>

<li><a href=”05-preface.xhtml”>Preface</a></li>

<li><a href=”07-start.xhtml”>Introduction</a></li>

<li><a href=”08-part1.xhtml”>Part I. The Annals of a State</a>

<ol>

<li><a href=”09-part1_chap1.xhtml”>I. Under Spain and France</a></li>

</ol></li>

</ol>

</nav>

The structure of the TOC section, with the items all arranged in nested lists, allows the content to be understood by a software application. What about formatting this section to look nice in an ebook device?

The first step is to remove the default formatting included by all ebook devices and browsers for the ordered list. I do this by adding two styles to the CSS:

nav ol {padding-left: 0;}

nav ol li {display: block;}

The first style removes the default left padding added to the list, and the second switches the default display of the content from list formatting (with the numbers added by the software or browser) to the default “block” display, which is how paragraphs and similar elements display. After that is done, it is not hard to apply whatever design you like to your TOC.

In my next installment, we will continue our discussion about the Table of Contents, with details on how to create the page list and other navigation options. If you have a suggestion for a topic you’d like me to cover—anything related to ebooks or metadata—please post a comment below.


To get all the ebook and digital publishing news you need every day in your inbox at 8:00 AM, sign up for the DBW Daily today!

3 thoughts on “Best Practices for Ebook Front Matter: Table of Contents, Part 1

  1. Ori Idan

    EPUB3 table of contents is both machine readable and human readable.
    Since it is machine readable there are very strict guidelines as for what it may contain, for example each least element must contain either a link or a span tag. It can not be just text.
    I have seen many producers do two table of contents, one for the reading system as defined by the standard and the other for human consumption.
    This is not necessary if you know how to make good TOC with EPUB3
    But keep in mind that most reading systems still use NCX, also most EPUB to kindle (MOBI) converters still use NCX only.

    Reply
  2. Michael Giltz

    I’m just a dolt of a reader, so don’t quite follow the info above. 🙂
    However, I find in many, MANY ebooks that the table of contents features chapter names or links that are so lengthy (and touch sensitive) that they become nigh on impossible to page past. In the Kindles where you tap the actual page, if one wants to simply go to the next page you invariably hit an actual chapter link and are taken to say, Chapter 22 rather than the next page of the TOC or whatever comes next at the beginning of the book. I’d recommend keeping in mind that people will want to navigate the TOC and allowing for space on the right margin for folk to tap onto the next page rather than the chapter link.
    PS And a curse on anyone who doesn’t make footnotes go forward and back (you tap on it to jump to footnote and then tap again to return to the page you were reading).

    Reply
  3. Aaron

    So you’re saying instead of linking a vanilla HTML TOC (not the nav toc.xhtml) you’re saying to delete the vanilla HTML TOC and replace the references (id’s & file paths) to it with toc.xhtml nav file and style that? If that is what you’re saying, that’s an interesting use of the toc.xhtml that I hadn’t thought to try.

    Reply

COMMENT

Your email address will not be published. Required fields are marked *


*