EPUB: Designing eBooks for the iPad · EPUB: Designing eBooks for the iPad By: Colleen Cunningham...
Transcript of EPUB: Designing eBooks for the iPad · EPUB: Designing eBooks for the iPad By: Colleen Cunningham...
EPUB: Designing eBooks for the iPad
By:
Colleen Cunningham Adams Media
Avon, Massachusetts
Presented at: ACLEA 47th Annual Meeting
July 30 – August 2, 2011 Boston, Massachusetts
Colleen Cunningham Adams Media Avon, MA
Colleen Cunningham is Senior Book Designer at Adams Media, a division of F+W Media, Inc.. After getting her start in newspaper and journal production, she found her home in book layout and design, focusing on trade non‐fiction in categories as diverse as business, self‐help, humor, and cooking. As a print book designer, she has found that having a strong sense of order, organization, and information hierarchy can be directly applied to ePub design. She has now transitioned to digital production full time at Adams Media and also trains layout designers how to integrate eBook production into existing print workflows. She has spoken at the 2010 HOW Design Conference, the 2011 Digital Book World Conference, the Book Builders of Boston 2011 Spring Forum Series, and the Boston InDesign User Group. Colleen lives in the Boston area with her husband and step‐son and enjoys photography, cooking vegetarian dishes, and running. Visit her blog at www.thebookstudio.wordpress.com.
Presented by Colleen Cunningham, Senior Book Designer, Adams Media 07.31.11
WORKSHOP B
Designing eBooks for the iPad and other eReaders
ACLEA’s 47th Annual Meeting, Boston, MA
• The EPUB format is the open eBook standard developed by the International Digital Publishing Forum (IDPF). It is based on a number of other open standards including XHTML and CSS, just like the web.
• The EPUB format is like not an app (software-like) or a PDF (not re-flowable).
• EPUBs and eReaders go together. It’s best to get familiar with both.
• The EPUB format is about reading convenience. Users can read on a wide variety of devices, but this creates production challenges: different screen sizes re-flow the text; reading engines support different code complexity; users can change text size and sometimes the fonts.
• Currently ideal for straight text and content that does not require a lot of formatting, but this summer EPUB3 and HTML5 will support more formatting. Device support will follow . . . by the end of 2011?
What is EPUB? It’s a Container.
Required Reading!
EPUB Straight to the Point by Elizabeth Castro
book: http://elizabethcastro.com/epub
blog: http://pigsgourdsandwikis.com
Kindle Formatting by Joshua Tallent
book: kindleformatting.com/book
website: http://ebookarchitects.com
Cannot specify a cover image
Cannot include Publication
Year metadata
Cannot break text (all text
frames must be linked); images
must be inline or anchored
Cannot export nested styles
Cannot automate chapter
breaks; break ID file for chapter
starts (use book palette)
Cannot specify a CSS template
Cannot specify a cover image
Cannot include Publication
Year metadata
Cannot break text (all text
frames must be linked); images
must be inline or anchored
Cannot export nested styles
Can automate chapter breaks
(Bug: xrefs in multiple
documents can break)
Can specify a CSS template
Can specify a cover image
Can include Publication Year
metadata
Can specify order of unlinked
text frames and images in new
Articles panel
Can export nested styles
Can automate chapter breaks
(Bug still there?)
Can specify a CSS template
(Some) InDesign Version Improvements
CS4 CS5 CS5.5
Steps in the InDesign to EPUB Workflow
1. Create file in InDesign and export 5. Validate
2. Unzip (if necessary—not using editing
software that un/zips automatically)
6. Test on device(s) for
quality assurance (QA)
3. Edit code for finessing and validation7. Upload to eBook seller (buy an ISBN,
supply metadata in separate feed)
4. Zip (if necessary)8. EPUB to Kindle conversion
(if necessary)
More information at http://digitalbookworld.com/resources-going-from-indesign-to-ebook
❍ Tools for visual hierarchy of content: font weight, font size (in relation to other content), white space, and indents.
❍ Style text with paragraph and character styles to translate into HTML (no “+”).
❍ Replace multiple returns with space attached to paragraph styles—they register as no space. Remove soft returns in running text—they register as hard returns.
❍ Remove special spaces (non-breaking, thin, etc) as they can create odd characters. Try using tracking or “no hyphens” in print file.
❍ (CS4/5) Thread text in order and anchor all images/captions and floating sidebars—unthreaded text and unanchored objects are pushed to front or end of the EPUB file.
❍ Hyperlinks: Create in hyperlinks panel.
❍ Cross references: Replace page references from the print file with cross references to chapters or sections in hyperlinks panel.
❍ Include chapter numbers, titles, and subheads in EPUB TOC menu.
❍ (CS4) Break up single InDesign file for section/chapter starts. Use the book palette. XHTML files have to be < 300 K for validation.
❍ (CS4) Place cover image as .jpg in first ID file.
❍ Enter metadata (File / Info)
❍ Consider converting complex tables into art. See http://ebookarchitects.com/conversions/enhanced.php for examples.
InDesign File Prep: Best Practices
InDesign CS4 used for demo
What will not export:
• Anchored master page items (watch for unanchored master page items, they will be pushed to the end of the EPUB)
• Elements on the pasteboard
• InDesign-generated TOC and index
• Drop caps, caps, small caps, white spaces
• (CS4/5) Outlines created or placed within the InDesign document (shapes and fonts)
• Rules attached with paragraph styles
• Font weights besides roman, italic, bold, and bold italic (like medium)
❍ Choose “Defined Styles” over “Local Formatting” to keep your EPUB file size low. Manual formatting = more code.
❍ Lists: map bulleted lists to unordered lists and map numbered lists to ordered lists (but the code will need to be fixed in the EPUB).
❍ Consider choosing “original art” option and re-sizing art to 100% in Photoshop for control over output quality:
❑ 600 pixels on longest side is a good size for detailed images
❑ keep images < 10 MB
❍ Avoid embedding fonts. This increases the file size and there are rights issues. Embedding = redistributing the font.
InDesign to EPUB Export: Best Practices
InDesign CS4 used for demo
EPUB Editing: Best Practices
❍ Unzip the EPUB file (if necessary)
❍ Edit the EPUB file:
❑ (CS4/5) add date metadata to content.opf<dc:date>2011</dc:date>
❑ (CS4/5) add cover file to the content.opfin metadata and manifest
❑ fix spacing of headers called out in TOC[in CSS] margin-top:
OPTIONAL EDITS:
❑ add additional metadata to content.opf
❑ make images scalable in relation to width of eReader screen[in HTML] style = “max-width: 100%;”
❑ fix list formatting[in CSS] p.bullet to li.bullet, indent=0
❑ add more space to the outside margins[in CSS] set body and @page margins
❑ avoid page breaks after heads (not support on the iPad yet)[in CSS] h1 {page-break-after: avoid;}
❑ set font preferences (see iosfonts.com)[in CSS] font-family: sans-serif; serif; [etc];
❑ add cross-referencing[in HTML] use #xx and id=“xx”
❑ embed audio/video files, set long tables in non-linear files (see ebookarchitects.com for examples of EPUB enhancements) use HTML5 <audio> and <video> tags
❑ apply div HTML/CSS for images/captions
❑ fix drop caps / caps / small caps
❍ Zip the EPUB file (if necessary)
Dreamweaver CS4 used for demo
Compiled by Anne-Marie Concepción of InDesign Secrets:
Apply Nested Styles (hard-applies character styles)
http://in-tools.com/scripts.html#apply_nested
Turn GREP Styles to Character Styles
http://indesignsecrets.com/downloads/TurnGrepStyles2CharStyles.zip
PrepText (converts manual to character styles), CS4/CS5
http://indesignsecrets.com/downloads/preptext.zip
EPUB with Correct Links (read the special installation instructions), CS5 only
http://teusdejong.nl/thome/ho_body5.html#scripts
If you need help installing scripts, read this post:
http://indesignsecrets.com/how-to-install-scripts-in-indesign.php
Free InDesign Scripts for EPUB workflows
Inject QA into your eBook workflow!
❍ Your EPUB file must pass validation in order to be accepted by eBook retailers:
❑ http://threepress.org/document/epub-validate
❑ http://code.google.com/p/epubcheck
❑ http://code.google.com/p/flightcrew
❍ Review on multiple eReaders if your EPUB is meant for multiple vendors:
❑ use ADE for rough proofing
❑ can only proof iBooks on the iPad
❑ use eReaders whenever possible
❑ use eReader apps whenever possible
❍ Remove copyrighted content specifically for print from eBook editions.
❍ When reviewing, check the following:
❑ formatting: clear information hierarchy, spacing, indents, character styling, capitalization, page breaks
❑ TOCs: click-able menu works and TOC page cross-references work
❑ cross-references: work and correctly point to other parts of the book (and that there are no unlinked “see page xx” left over from print material)
❑ hyperlinks: work and correctly point to web address, try to avoid deep web addresses as they may change when web sites are edited (“&” will break a link when used in a hyperlinks, Amazon uses them in their hyperlinks)
❑ art: is scaled correctly and is placed at the correct dimensions
Adobe Digital Editions used for demo
❍ EPUB files are not used on a Kindle. Kindle eBook formats include .mobi, .azw, and .prc (similar). Amazon’s Kindle Publishing Programs page has all the information you need.
❍ InDesign does not export directly to the Kindle format, so use conversion software on an InDesign-generated EPUB file such as Kindlegen.
❍ It’s recommended that the newer version of Kindlegen (v1.1) only be used for files with audio/video. Otherwise, the new version needlessly inflates eBook’s file size.
❍ Download the Kindle Previewer to check the formatting and validate your Kindle eBook.
❍ Common changes to formatting during EPUB to Kindle conversion include:
❑ lost space between paragraphs
❑ lost hanging indents
❑ inconsistent handling of drop caps
❑ image re-sizing on the Kindle (small images are expanded to fit screen unless dimensions are set inside the image tag)
❍ Amazon Kindle Publishing Guidelines has specific instructions regarding how to code the cover in the content.opf file. Their preferred format for the cover is a .jpg image of 600 x 800 pixels.
Converting EPUB to Kindle
EPUB Resources
TWITTER http://twitter.com–use #ePrdctn
DBW http://digitalbookworld.com (@digibookworld)
MY SITE http://thebookstudio.wordpress.com (I’m @BookDesignGirl)
ADOBE http://adobe.com/digitalpublishing (@adobe)
LYNDA.COM ($) InDesign CS4/5 to EPUB Kindle and iPad video tutorials
INDESIGN SECRETS http://indesignsecrets.com (@amarie)
LIZ CASTRO http://pigsgourdsandwikis.com (@lizcastro)
EBOOK ARCHITECTS http://ebookarchitects.com/resources.php (@jtallent)
Presented by Colleen Cunningham, Senior Book Designer, Adams Media 07.31.11