Table

The page covers the use of the table constructions in eBooks. There is also a page on Table of Contents, TOC

Basics

The ePub 2 standard and later requires support for tables but there are many pitfalls in the implementation. XHTML defines the basic tags for tables to be: caption, table, td, th, tr. Mobi other formats also have support for tables. This page will explain some of the pitfalls in table use for eBooks and will be limited to the use of these 5 basic tags.

A table is a highly useful tool in organizing data on a web page but there are definite issues when the same data is in an eBook. Web Browsers expect to be able to scroll so the length of entries is not an issue but eBooks have a defined page limit causing many tables to fail to fit on one page which raises the issue of how to split them.

tr and td

Tr defines a table row while td identifies the table data inside the row. Table data and therefore a table row can contain multiple lines of data. The simplest tables are the ones that mimic a standard spread sheet with lots of cells and minimal content. Something like:

<table> 
   <tr> <td> A </td> <td> B </td> <td> C </td> </tr>
   <tr> <td> D </td> <td> E </td> <td> F </td> </tr>
 </table>

Which would look like:

A	B	C
D	E	F

This sort of table is supported by most if not all eBook readers. If it happens to appear at the end of a page it might be split on the Table Row (tr) boundary and it is likely narrow enough to appear fine even if the font size is quite large since each table cell (td) contains minimal data in this example. If you need it to appear together on one page some but likely not all readers would keep it on the same page so you might have to force a page break early to ensure that it will fit. Changing <table> to <table border=1> would place a border around each of the letters. However, it is better to define the border in CSS.

The td entry is where the data belongs. It can be formatted as straight text or paragraphs. It can also be an image. Sometimes a blank entry can be populated with a &nbsp; entry to ensure a minimum width.

Occasionally you even see a table with a single entry. The table, in this case is being used to provide a frame around the data. There are other ways using CSS to accomplish this task.

caption

The caption entry intended to appear above or below the table itself. It should be placed just after the <table> or just before the </table> entry. It is intended to provide a title for the table. Some eReaders may split the table with the caption on another page in some circumstances. CSS can control the location of the caption with above, below; left, right also available.

heading

The heading tag (th) can provide a title for each column. Th replaces the td tag for heading tag. The text will automatically be in bold font. Heading tag may also be used to provide a title for a row of data. It is usually on the left edge but may also be on the right.

Dealing with larger tables

EBook readers will try and wrap data in the column cells to fit the width of the screen. Reducing the font size either at creation or in the reader itself may help in reading tables. Table rows will generally be used to split the table over multiple pages. Some ePub 3 readers will have a special mode for reading tables. For example the iPad supplied app called iBooks allows you to double tap on any table and it will display the table on a screen by itself. The screen fits the width and will allow portrait or landscape mode. The screen is scrollable to allow the entire table to be viewed. KFX from Amazon has also provided a special Table display mode.

long columns

Sometimes a table is used by comparison text using 2 or 3 columns of text. In this case you may try to put the text in one column the full length of the table. This is very prone to problems since many eReaders will not scroll and will push the table to the top of the next page and then chop the data at the bottom of the screen losing all of the rest. One work around to to create artificial cells with no visible border to mark the row. The eReader can then switch pages at the invisible row separator. Several of these may be needed to get the document to flow from page to page. A better solution is to use the proposal in the column article.

If you can't get a table to work like you want you may be able to present the data a different way. See Tabular Reflow.

Advanced tables

A table can be thought of as having a header, a body, and a footer. There are tags for this called, thead, tbody (can have more than one), and tfoot. Using thead and or tfoot will cause it to repeat on each page. Note that tfoot must be listed before tbody to ensure that it will be repeated on each page since tbody might split over several pages. It is also possible for formatting in the CSS to use colgroup and col entries. Visible borders can be added or removed as desired. cell alignment can be controlled, align, and valign. Scope can also be used for elements, default is colgroup.

A table is assumed to be a block element. An inline-table is also possible.

A border can be forced on or off with border=1 or border=0. It is normally controlled with one of border-collapse or border-spacing.

• border-collapse has collapse, separate, inherit values.
• border-spacing defines the distance between a border line about each data entry. Two numbers can be used for horizontal and vertical. One number applies to both, no number means inherit.

A summary element can also be in a table to provide information for visually impaired users. The TTS would read this element.

For more information

• W3.org defines some guidelines for using tables in an eBook to make them accessible to people with disabilities.
• https://www.w3.org/TR/html5/tabular-data.html for official specifications of tables for ePub 3
• https://www.w3.org/TR/xhtml2/mod-tables.html#s_tablesmodule XHTML 2 tables.
• https://www.w3.org/WAI/tutorials/tables/ A tutorial