effective epubs today - o'reilly mediaassets.en.oreilly.com/1/event/19/ebooks ii... ·...
TRANSCRIPT
![Page 1: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/1.jpg)
Keith FahlgrenO’Reilly Media
Effective ePubs Today
![Page 2: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/2.jpg)
Opportunity
![Page 3: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/3.jpg)
Navigate
• Reader-defined navigation• Publisher-defined navigation• Machine-driven navigation
![Page 4: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/4.jpg)
Search
![Page 5: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/5.jpg)
Reread
Reuse
![Page 6: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/6.jpg)
Features
![Page 7: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/7.jpg)
CSS
Your key to success
![Page 8: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/8.jpg)
Most Important
• Generic font choices, weights, size
• Margins• Borders, rules
• Spacing, padding• Alignment, “block” or “inline”
![Page 9: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/9.jpg)
Nice to Have
• Color• Page breaking• Float• Lists and tables
![Page 10: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/10.jpg)
In the Wildbackground-color: 24
border-bottom: 6
border-color: 2
border-left: 4
border-right: 4
border-spacing: 6
border-top: 4
border: 13
clear: 4
color: 46
display: 208
float: 14
font-family: 29
font-size: 142
font-style: 45
font-variant: 1
font-weight: 117
height: 13
letter-spacing: 3
line-height: 7
list-style-type: 6
list-style: 2
margin-bottom: 177
margin-left: 59
margin-right: 36
margin-top: 135
margin: 19
max-height: 1
max-width: 2
oeb-column-number: 9
padding-bottom: 6
padding-left: 14
padding-right: 7
padding-top: 51
padding: 43
page-break-after: 3
page-break-before: 33
position: 1
right: 48
src: 4
text-align: 140
text-decoration: 16
text-indent: 151
text-transform: 6
vertical-align: 3
visibility: 1
width: 5
![Page 11: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/11.jpg)
Fonts
and how they are a pain
![Page 12: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/12.jpg)
Embedding Benefits
• Highest quality typography• Big differentiation from the current norm• Ensure all of your crazy glyphs appear
![Page 13: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/13.jpg)
Embedding Downsides
• Limited reader support• Licensing headaches• No assurance all of your crazy glyphs
appear
![Page 14: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/14.jpg)
Linking
for goodness sake, do it!
![Page 15: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/15.jpg)
Internal & External
• Every should be linked
Website
FigureTable
Chapter
Wizard
Vocab word
Footnote
![Page 16: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/16.jpg)
Media
“ooh, the pretty pictures!”
![Page 17: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/17.jpg)
Figures
![Page 18: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/18.jpg)
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)
![Page 19: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/19.jpg)
SVG FTW
![Page 20: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/20.jpg)
NavigatationNCX is your friend
<guide> <reference type="toc" title="Table of Contents" href="toc.html" /> <reference type="loi" title="List Of Illustrations" href="toc.html#figures" /> <reference type="other.intro" title="Introduction" href="intro.html" /></guide>
![Page 21: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/21.jpg)
Pitfalls
![Page 22: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/22.jpg)
Conformance
• Lack of a public, testable conformance suite hurts everyone• Software people* are lazy• Tiny (mobile) devices really cannot
handle everything
* like me
![Page 23: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/23.jpg)
Typography & Layout
• Embedding fonts only gets you so far• Abandon the page, sorry• Re-evaluate what is most important to
readers
![Page 24: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/24.jpg)
Complexity?
![Page 25: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/25.jpg)
Nothing Too Rich
• No Flash, animations• No video at (link to it, though, and the
iPhone will make you look cool)• No interactivity
![Page 26: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/26.jpg)
Logo, Hello?Red logo by Travis Alber, blue by Liza Daly
![Page 27: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/27.jpg)
GOTCHAS!
![Page 28: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/28.jpg)
• 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
![Page 29: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/29.jpg)
Physical Devices
![Page 30: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/30.jpg)
Sony Reader
• Beautiful +• Adobe Digital Editions-backed ±• No connectivity?!☹ −• Limited capabilities, file size restrictions −
![Page 31: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/31.jpg)
iPhone
• Tiny ±• Lots of new software +• Apple −• Flexible, expanding +
![Page 32: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/32.jpg)
Soft ware
![Page 33: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/33.jpg)
Digital Editions
• Adobe ±• Updated +• Supports embedded fonts +• ...but requires them for țőø πμ¢ħ −• Non-conformant −
![Page 34: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/34.jpg)
Online
![Page 35: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/35.jpg)
Bookworm
• Beautiful +• Very high level of conformance, support +• Online-only −• Saves your place +• Multi-platform +• Mobile friendly +
![Page 36: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/36.jpg)
Future
![Page 37: Effective ePubs Today - O'Reilly Mediaassets.en.oreilly.com/1/event/19/eBooks II... · letter-spacing: 3 line-height: 7 list-style-type: 6 list-style: 2 margin-bottom: 177 margin-left:](https://reader033.vdocument.in/reader033/viewer/2022050415/5f8b9a3ea146cc009662623e/html5/thumbnails/37.jpg)
• Inter-ePub linking• Rich experiences• Web-enabled content• Digital Signing• Support for crazy navigation• Plastic Logic, Android, Palm?