Beyond Straight Text [2014]
Upcoming SlideShare
Loading in...5

Beyond Straight Text [2014]



Ebook presentation at the Digital Book World Conference, January 2014.

Ebook presentation at the Digital Book World Conference, January 2014.



Total Views
Views on SlideShare
Embed Views



1 Embed 1 1



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

    Beyond Straight Text [2014] Beyond Straight Text [2014] Presentation Transcript

    • DBW DIGITAL DESIGN & PRODUCTION CONFERENCE • MONDAY 13, 2014 Beyond Straight Text Extracts, Lists, Sidebars, and Tables To Download PDF Slides To Download Epub file
    • Who? Managers, devs, ID users What? EPUB3 / KF8 (thru KP) Why? Reflowable and flexible When? 2014 but test often Where? Every vender and ereader
    • CSS: Use styles for paragraphs, characters, objects HTML: Map to tags ... and open EPUB to add ereader-specific refinement
    • NO
    • Our ebook design Our customers’ reading experience Ereader rendering
    • Semantic markup Graceful degradation Fallbacks Margins Borders Media queries
    • PLUS: Adobe Digital Editions and Sony PLUS: ReadiumMINUS MOBI: Kindles G1, G2 and Kindle DX
    • HEY! ☞
    • Beyond Straight Text Extracts
    • HEY!☞
    • What works: Graceful degradation: embedded fonts and device fonts Fallbacks: font stacks and font size differentiated from main text Margins: top, bottom, left, right Borders: render in both regular and night modes Keep simple: Colors: in case night mode does not override text color with white Long extracts: make sure font is legible in large amounts Extracts
    • Beyond Straight Text Lists
    • + Kobo Glo
    • What works: Semantic markup: use <ol>, <ul>, and <li> Media queries: to fix alignment issue in Kindle Fire HD Bug Fixes in CSS: to fix nesting and alignment bugs in NookColor and Kobos Keep simple: Variables: consider hard- coding lists that are other than numerical Nesting: consider reworking content with lists which contain paragraphs or very long list points which may become thin in narrow screen widths Margins: avoid trying to perfectly align lists and change default margins Lists
    • Beyond Straight Text Sidebars
    • HEY!☞
    • HEY!☞
    • desktop app for Mac
    • desktop app for Mac contrasts better on app for iPad than on desktop app for Mac
    • app for iPad
    • What works: Graceful degradation: -webkit prefix works for iBooks and Kindles Margins: top, bottom, left, right Borders: for night mode Media queries: consider setting narrow, floating sidebars to full width with a KF8 media query to account for iPad app and narrow Kindles Keep simple: Colors: make sure there’s enough contrast between text color and sidebar background to account for various night mode overrides Scale: An ebook full of narrow, floating sidebars can cause reflow headaches for the reader so best to use sparingly Sidebars
    • Beyond Straight Text Tables
    • HEY!☞
    • What works: Semantic markup: use HTML table tags Fallbacks: consider placing image of table in text flow with a link to the table as text in the back of the ebook Borders: help to demarcate background colors like we see in the sidebars Keep simple: Very wide tables and complex tables: may need to be reworked Charts: a table- and chart hybrid that needs to be set as an image should be tested for caption legibility, especially on small screen sizes Tables
    • Questions? Find your people on Twitter at #eprdctn Resources: PDF Slides Epub file