EPUB in the Wild Liz Castro @lizcastro - - PowerPoint PPT Presentation

epub in the wild
SMART_READER_LITE
LIVE PREVIEW

EPUB in the Wild Liz Castro @lizcastro - - PowerPoint PPT Presentation

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


slide-1
SLIDE 1

EPUB in the Wild

Liz Castro @lizcastro http://PigsGourdsandWikis.com http://www.elizabethcastro.com/epub

slide-2
SLIDE 2

Specifications

slide-3
SLIDE 3

Specifications

slide-4
SLIDE 4

Specifications

slide-5
SLIDE 5

Specifications

slide-6
SLIDE 6

Specifications

slide-7
SLIDE 7

Specifications

slide-8
SLIDE 8

Specifications

slide-9
SLIDE 9

Specifications

slide-10
SLIDE 10

Manufacturer Guidelines

slide-11
SLIDE 11

Manufacturer Guidelines

slide-12
SLIDE 12

Manufacturer Guidelines

slide-13
SLIDE 13

Objective:

One file to rule them all

slide-14
SLIDE 14

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.
slide-15
SLIDE 15

Secrecy

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

slide-16
SLIDE 16

Three strategies

  • Create cross platform code
  • Use media queries when cross

platform code isn’t possible

  • Make informed decisions about not

supporting certain platforms

slide-17
SLIDE 17

Everybody supports

bold and italic font-size text-indent top and bottom margins images

slide-18
SLIDE 18

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

slide-19
SLIDE 19

Kindle Fire Kindle

slide-20
SLIDE 20

NOOK Color NOOK

slide-21
SLIDE 21

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

slide-22
SLIDE 22

Adobe Digital Editions

slide-23
SLIDE 23

iBooks on iPad

slide-24
SLIDE 24

iBooks on iPhone

slide-25
SLIDE 25

NOOK Color with Publishers Defaults OFF

slide-26
SLIDE 26

NOOK Color with Publishers Defaults ON

slide-27
SLIDE 27

NOOK

slide-28
SLIDE 28

Kindle Fire

slide-29
SLIDE 29

Kindle

slide-30
SLIDE 30

Media Query example

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

slide-31
SLIDE 31

Kindle

slide-32
SLIDE 32

Watch out for...

slide-33
SLIDE 33

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; ...}

slide-34
SLIDE 34

Adjusting for narrow screen

Don’t try to fit too much in a single paragraph—float on

  • ne side or other, but

not both! Don’t indent excessively

slide-35
SLIDE 35

Adjusting for narrow screen

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

slide-36
SLIDE 36

iBooks and fonts

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

slide-37
SLIDE 37

Cross platform dilemmas

slide-38
SLIDE 38

Discretional page breaks

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

slide-39
SLIDE 39

Discretional page breaks

Both NOOK and NOOK Color support all page-break properties

slide-40
SLIDE 40

Discretional page breaks

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

slide-41
SLIDE 41

Discretional page breaks

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

slide-42
SLIDE 42

Widows and orphans

.body { widows: 3;

  • rphans: 3;

}

slide-43
SLIDE 43

Widows and orphans

Neither iBooks nor Kindle Fire support widows or orphans

slide-44
SLIDE 44

Widows and orphans

Again, NOOK comes through

slide-45
SLIDE 45

Tables

Very problematic in narrow pages

slide-46
SLIDE 46

Tables

slide-47
SLIDE 47

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>

slide-48
SLIDE 48

Tables

slide-49
SLIDE 49

Tables

slide-50
SLIDE 50

Tables

Kindle Fire does not support non-linear tables

slide-51
SLIDE 51

Tables

Neither does NOOK

slide-52
SLIDE 52

Tables

Results are pretty awful on Kindle

slide-53
SLIDE 53

Audio and Video

iBookstore: yes, B&N + Amazon: no

slide-54
SLIDE 54

Fixed Layout

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

slide-55
SLIDE 55

Javascript

Works best in iBooks; allowed in iBookstore Sketchy support on

  • ther platforms
slide-56
SLIDE 56

Read Aloud

iBooks and Kobo Vox only; media

  • verlay on top of fixed layout; laborious
slide-57
SLIDE 57

Informed choices

  • How to create the best ebook that

works on the most platforms

  • Sometimes, you’ll decide to leave some

devices behind

slide-58
SLIDE 58

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