Saturday, January 21, 2012

How to Create Fixed-Layout iBooks, Part 1

With the new iBooks Author application only available for Mac users, the vast majority of us are left to fend for ourselves when it comes to making fixed-layout ebooks. This is probably just as well if you're at all like me and prefer to do things yourself and have complete control over the end result, although it's not all that difficult if you take it step by step and have a fair amount of patience (and good attention to details). While iBooks Author looks like it has some nice features, it requires a trade off in rights to the final product that I'm not willing to make just yet, particularly when there are other options available.

For the past few months I've been working out how to build fixed layout ebooks for the iBooks platform in order to replicate the layout I've created for my illustrated novel project, The Ring Saga. Since my intention is to produce the four-volume series as a full-color print edition in the standard 5.5" x 8.5" "perfect bound" format as well as in various digital editions, I needed to produce the art and page layouts in the print edition aspect ratio and reproduce them as ebooks from that. For a full color, heavily illustrated project such as this, the iBooks fixed layout format for the iPad was the obvious place to start when it came to creating the digital editions.


The essence of a fixed-layout ebook, from a practical point of view, is that - as the name implies - it allows for the creation/replication of exact graphic design layout which the reader cannot alter, as opposed to the standard "reflowable" formats which allow the end user to change the font and text size, for example. This is incompatible with highly formatted layouts such as graphic novels and magazines, and simply unacceptable to many graphic design departments who've spent decades (if not centuries) refining the arts of composition, typography, and illustration.

Fixed-layout also allows for "full-bleed" (edge-to-edge) artwork and the layering of multiple elements on top of one another, placed precisely using XML, a relatively basic subset of HTML, and CSS for styling. You don't need to know very much of this code to make an ebook work, but of course the more you do know, the more complex and stylized your formatting can be. iBooks also allows both javascript and canvas for incorporating interactive elements, although this requires a far more extensive knowledge of those programming languages than the average author generally has. I'll include a few examples of scripting code that you can copy and customize for your own use as we go along.

Apple's fixed-layout iBooks format is an ePub file with a few additional options and requirements that make it only viewable on iOS devices, but also incorporates all the nice features inherent in the iBooks app, such as pinch and zoom, animated page turns, and automatic reorientation. Both Barnes & Noble's NookColor/Tablet and Amazon's Kindle Fire have fixed-layout formats, but B&N have thus far been very restrictive in allowing anyone but trade publishers to use their format, and Amazon have only just recently released the specs for their new KF8 format, which is still a work in progress, with the comics portion still forthcoming. And of course they both only have 7" screens, which is too small to adequately display more than a single book page at a time. This is not prohibitive, but it isn't ideal either, particularly if you want to reproduce the two-page layout of a print edition.


My intention here is to share enough of what I've learned to aid you in producing your own fixed layout iBooks from scratch, without the need of an app or conversion service to do the work for you. To make this easier, I've created a sample template file that you can download and use as the starting point for your own projects. In a series of subsequent posts I will break this file down into its component parts and explain them as plainly as possible, giving examples of the various code elements and describing the options available for each.


There are some good resources available to assist in learning the fixed layout format, but none of them discuss in much detail the formatting options allowed or the reasons for them. I'll try to do that here. But I won't go into HTML or CSS beyond the necessary basics, and a few specifics that apply to iBooks, since the rest is common web code known to most, or easily learned elsewhere. In addition, I won't be discussing anything that applies solely to standard "reflowable" ebooks, or how to format your manuscript with headings and sections and the like. This tutorial is to help you create an illustrated ebook with "live" text, such as a children's book or graphic novel, for the iBooks platform. I plan to do subsequent tutorials for the Kindle Fire's KF8 format, and the Color Nook tablets, if interest warrants.

Before we begin, here are some useful ePub resources you might consult:
When it comes to fixed-layout iBooks specifically, the resources are more scarce:
  • iBookstore Asset Guide (PDF) - Apple's own documentation, which includes a very sketchy section on creating fixed-layout ebooks
  • How To Make An iPad Photo Book - the only online tutorial I've found on the subject, with just enough to get you started
  • Liz Castro has a book out about making ePub files, with a fixed-layout supplement available for five bucks more. Also be sure to pick up her Read Aloud mini-guide, if only so you can take a look at her Aesop's Fables sample.
Other than that, there isn't much information available on how to produce high quality iBooks in this format. I'll cover the essentials, but knowing more about the underlying ePub format is recommended if you really plan to get your hands dirty. To that end, there's nowhere better to go than the IDPF site, where you can read through the entire code specification top to bottom. It's pretty dry reading and hard going at times, but quite enlightening nonetheless.

NEXT UP: The File Structure