Summary

A page list and page break indicators allow users in mixed print-digital environments to coordinate their positions.

Techniques

Examples

Example 1 — Page list navigation

The page list is a simple ordered list of links to the page break locations. It is identified by the role doc-pagelist.

<nav role="doc-pagelist" epub:type="page-list">
 <ol>
   <li><a href="georgia.xhtml#page752">752</a></li>
   <li><a href="georgia.xhtml#page753">753</a></li>
   <li><a href="georgia.xhtml#page754">754</a></li>
   <li><a href="georgia.xhtml#page755">755</a></li>
   <li><a href="georgia.xhtml#page756">756</a></li>
   <li><a href="georgia.xhtml#page757">757</a></li>
   <li><a href="georgia.xhtml#page758">758</a></li>
 </ol>
</nav>
Example 2 — Page break marker

An empty span element provides an anchor for the page break. It is identified as a page break using the role attribute with the value doc-pagebreak. The aria-label attribute provides an announceable value.

<p>
   …
   <span
       role="doc-pagebreak"
       id="pg24"
       aria-label="24"/>
   …
</p>

Explanation

If a reflowable publication is derived from a statically-paginated source, such as a print edition, including a page list allows users to coordinate positions. For example, a student using a digital edition in a class where her peers are using print books would be able to jump to the same pages during instruction.

The page list itself is a list of links to all the page breaks locations. User agents can use this list to provide automatic page jump functionality, or a user can access it directly to manually select the page they wish to go to.

If a digital publication is produced from the same workflow as a print document, page break locations should also be retained (although a page list can be created without explicit page break markers so long as there is some anchor for the link to go to). Page break locations can be added to the markup using span and div tags with a role attribute set to the value doc-pagebreak. To hide the page number from visual viewing, the aria-label attribute can be used to identify the number.

An id attribute has to be attached to each page break location to enable linking to the breaks.

Identifying the source of the pagination in the publication metadata is also important to help users determine the usability of the pagination (e.g., will it match the print edition being used in a class). This source is typically identified using a dc:source element.

Note: Some publishers include a page list and/or page break markers in digital publications without paginated equivalents. In these cases, the identifier of the current publication could be identified as the source to avoid confusion and/or the lack of a source could be noted in an accessibility summary.

EPUB 2

In EPUB 2, a page list is expressed using the pageList element in the NCX file. It is not possible to include a semantic that identifies page break locations in the content, as XHTML 1.1 does not support either the ARIA role or epub:type attributes.

EPUB 3

In EPUB 3, the page list is included in the navigation document and identified with the epub:type value page-list.

References

Frequently Asked Questions

What if the order of my ebook doesn't exactly match the order of the print equivalent?

It is sometimes the case when converting to digital that front and back matter material gets shuffled around and/or omitted. These changes in content order are not unexpected, and users will understand that their ebooks may not be formatted exactly the same way as the print, and may not include all the print content.

If you do make changes to the content order, do not renumber the existing pagination to return it to sequential order. The purpose of page list navigation is to get the user to the equivalent point, not to be sequentially correct.

Does the page number reflect the page that is ending or the page that is starting?

The page number always reflects the page that is starting.

Does the page break marker placement follow the print position?

No, page break markers are always placed at the start of the page's content, regardless of whether the page number is printed at the top or bottom of the page in the print edition. When a user jumps to a specific page, they want to jump to the start of the content for that page, not the end.

Should I include the page numbers as content or empty elements?

There are pros and cons to each approach.

If you include the page numbers as text content within a span or div, the pages will be more easily accessible to both sighted users and users using assistive technologies. This method has been employed in previous DAISY standards. The potential downside, however, is that mainstream user agents will not provide equivalent functionality to turn off unwanted content, forcing users to hear and view the page numbers.

Page numbers as empty elements are the more traditional mainstream approach, with anchor tags having served this function in the past. Using the aria-label attribute on an empty element, however, limits the users who will have access to the page number while reading.

Although user agents don't support toggling the visibility of page numbers, it is possible to provide the functionality using JavaScript. A script could be included in each document to show/hide the numbers.

Where do I put a page number when the page break occurs in the middle of a list?

Lists often break across pages, with one item ending at the bottom of one and a new item starting at the top of the next. In these cases, it is not possible to locate the page number between the two list items, as it is not valid for a list to contain anything but list items.

The obvious solutions are to either insert the page number as the very last element in the item that ends the page:

<li>….<span
     epub:type="pagebreak"
    
     title="24"/></li>
   <li>…</li>

or to place it as the very first element in the list item that starts the page

<li>….</li>
   <li><span
     epub:type="pagebreak"
    
     title="24"/>…</li>

One practice to avoid is creating a new list item just for the page break. As page breaks are often not visible content, an empty list item will be confusing to all users and may alter the meaning of the list.

Can I use a tags for page numbers?

The a element has two specific uses defined in HTML5: for links when the href attribute is present, and for placeholder links when it is not (e.g., a link that might be active in another context or after some interaction by the user). As page breaks are not links, and are never intended to be activated as links, it is incorrect to use them for page breaks markers.