ePub on Devices:
Tweaks & Tricks
Keith Fahlgren
O’Reilly Media
keith@oreilly.com

Landscape

A. InDesign

D. Other

Editing &
Validation

epubcheck
http://code.google.com/p/epubcheck/

epubpreflight
http://code.google.com/p/epubcheck/

(un)zipping

PDFXML
Inspector
http://labs.adobe.com/
technologies/mars/

Refinements

Putting the
X in XHTML
Describe semantics, not
presentation

CSS
Your key to success

Most
Important
• Generic font choices, weights, size
• Margins
• Borders, rules
• Spacing, padding
• Alignment, “block” or “inline”

Nice to Have
• Color
• Page breaking
• Float
• Lists and tables

In the Wild
background-color: 6 cursor: 2 margin-bottom: 469 page-break-before: 38
background: 12 display: 360 margin-left: 271 page-break-inside: 9
border-bottom: 20 float: 43 margin-right: 198 position: 18
border-collapse: 17 font-family: 575 margin-top: 422 right: 3
border-color: 18 font-size: 548 margin: 175 src: 7
border-left/right: 4/4 font-style: 222 max-height: 4 table-layout: 13
border-spacing: 6 font-variant: 9 max-width: 12 text-align: 452
border-style: 18 font-weight: 358 oeb-column-number: 2 text-decoration: 12
border-top: 19 height: 6 padding-bottom: 19 text-indent: 309
border-width: 18 left: 12 padding-left: 10 text-transform: 14
border: 20 letter-spacing: 2 padding-right: 37 top: 11
bottom: 3 line-height: 203 padding-top: 18 vertical-align: 28
clear: 10 list-style-type: 7 padding: 230 white-space: 3
color: 194 list-style: 7 page-break-after: 2 width: 74

Fonts
and how they are a pain

Embedding
Benefits
• Highest quality typography
• Big differentiation from the current norm
• Ensure all of your crazy glyphs appear

Embedding
Downsides
• Limited reader support
• Licensing headaches
• No assurance all of your crazy glyphs
appear

Linking
“
Link by link we build paths of
understanding across the web of humanity
—Tim Berners-Lee
for goodness sake, do it!

Internal &
External
Vocab word
Chapter
Website
Footnote
• Every should be linked
Figure
Table Wizard

Image Size?
• “Imagine your book through a straw”
• How much disk space does your cell
phone have again? And how slow is the
Edge network?
• Scalable images win for many (SVG)

SVG FTW

GOTCHAS!

• CSS wasn’t really created for
this stuff
• Invalidity hurts
• XHTML is restrictive
• Big tables are hard
everywhere
• Device, software support all
over the map

?