1.
EPUB in the Wild
Liz Castro
@lizcastro
http://PigsGourdsandWikis.com
http://www.elizabethcastro.com/epub

2.
Specifications

3.
Specifications

4.
Specifications

5.
Specifications

6.
Specifications

7.
Specifications

8.
Specifications

9.
Specifications

10.
Manufacturer Guidelines

11.
Manufacturer Guidelines

12.
Manufacturer Guidelines

13.
Manufacturer Guidelines

14.
Objective:
One file to rule them all

15.
3 problems
1. They can’t do it.
2. They want to do it their own way.
3. They won’t let you do it.

16.
Secrecy
http://weblogs.mozillazine.org/bz/archives/2012/02/vendor_interactions_with_the_c.html

17.
Three strategies
• Create cross platform code
• Use media queries when cross
platform code isn’t possible
• Make informed decisions about not
supporting certain platforms

18.
Everybody supports
bold and italic
font-size
text-indent
top and bottom margins
images

19.
Original iBooks on iPad iBooks/iPhone
Adobe Digital
Editions ->

20.
Kindle Fire Kindle

21.
NOOK NOOK Color

22.
Many support
font family
small caps
leading
left and right margins
float and width
text wrap (around images, sidebars,
and drop caps)
borders, backgrounds
color

23.
Adobe Digital Editions

24.
iBooks on iPad

25.
iBooks on iPhone

26.
NOOK Color with Publishers Defaults OFF

27.
NOOK Color with Publishers Defaults ON

28.
NOOK

29.
Kindle Fire

30.
Kindle

31.
Media Query example
@media amzn-mobi {
span.dropcap { span.dropcap {
font-size : 5em; font-size : 3em;
float : left; float: none;
line-height : 1.5; line-height : 1;
margin-right : 0.1em; margin-top : auto;
margin-bottom: -.3em; margin-right : auto;
font-family : margin-bottom: auto;
DavysArtNouveauInitials, font-family : sans-serif;
sans-serif; color : #512a37;
color : #512a37; }
} }

32.
Kindle

33.
Watch out for...

34.
Aligning drop cap
span.dropcap {
...
line-height : 1;
margin-top : .2em;
margin-right : 0.1em;
margin-bottom: 0em;
... }
span.dropcap {
...
line-height : 1.5;
margin-right : 0.1em;
margin-bottom: -.3em;
...}

35.
Adjusting for narrow
screen
Don’t try to fit too
much in a single
paragraph—float on
one side or other, but
not both!
Don’t indent
excessively

36.
Adjusting for narrow
screen
p.Poem-line {
font-size: .8em;
text-indent : -20px;
margin : 0 0 0 20px ;
padding: 0px 28px;
}

37.
iBooks and fonts
Don’t forget the .com
file or else iBooks
won’t display embed
fonts

38.
Cross platform dilemmas

39.
Discretional page breaks
page-break-after: avoid
Kindle, iBooks don’t support.

40.
Discretional page breaks
Both NOOK and
NOOK Color
support all
page-break
properties

41.
Discretional page breaks
But Kindle Fire
and iBooks do
support page-
break-inside:
avoid
Create a div
with header
and first
paragraph.

42.
Discretional page breaks
iBooks
supports page-
break-inside:
avoid
(but no other
“avoids”)

43.
Widows and orphans
.body {
widows: 3;
orphans: 3;
}

44.
Widows and orphans
Neither iBooks nor Kindle Fire
support widows or orphans

45.
Widows and orphans
Again, NOOK comes through

46.
Tables
Very problematic in narrow pages

47.
Tables

48.
Tables
<manifest>
...
<item id="table1" href="table1.html" media-
type="application/xhtml+xml" />
<item id="table2" href="table2.html" media-
type="application/xhtml+xml" />
...
</manifest>
<spine toc="ncx">
<itemref idref="maintext" />
<itemref idref="table1"/>
<itemref idref="table2" linear="no" />
</spine>

49.
Tables

50.
Tables

51.
Tables
Kindle Fire does not support non-linear tables

52.
Tables
Neither does NOOK

53.
Tables
Results are pretty awful on Kindle

54.
Audio and Video
iBookstore: yes, B&N + Amazon: no

55.
Fixed Layout
iBooks and Kobo Vox use very similar systems;
NOOK has closed system, Amazon new system

56.
Javascript
Works best in
iBooks; allowed in
iBookstore
Sketchy support on
other platforms

57.
Read Aloud
iBooks and Kobo Vox only; media
overlay on top of fixed layout; laborious

58.
Informed choices
• How to create the best ebook that
works on the most platforms
• Sometimes, you’ll decide to leave some
devices behind

59.
Liz Castro
• EPUB Straight to the Point
• Fixed Layout for iBooks
• Audio and Video in EPUB
• Read Aloud EPUB
• From InDesign CS 5.5 to EPUB and Kindle
• HTML/CSS Visual QuickStart Guide
• www.elizabethcastro.com/epub
• www.PigsGourdsandWikis.com
• Twitter: @lizcastro, #eprdctn, #edigital