View Cart

How To Create Fixed-Layout iBooks, Part 1

Introduction

Click image to download the template!

NOTE: This tutorial was first published on Scot's Blog in January of 2012. Much has changed in the intervening years since then, but in this 7-part series you will still find all the details on how an iBooks file works and all the steps to make one for yourself. iBooks Author had just been released at that time, but only for those who work on Macs, and Amazon had only just put out the first Kindle Fire tablet two months earlier, in November of the prior year, but the KF8 fixed layout code was still a secret. Thus, creating fixed layout ebooks was still beyond the reach of most. This tutorial was written to allow the rest of us to create fixed layout ebooks for iBooks as well. An 8th part was later added to this series as an update to explain the changes made in iBooks 3.0, released in October of 2012, so be sure to read that for the latest updates.

UPDATE 8/2015: The template has been revised and expanded to meet with the newer EPUB3 specifications now used in iBooks. Subsequent changes have been made to this tutorial to explain these updates and remove portions that are now outdated.

NOTE: An additional 10-page sample file containing examples of audio/video embedding and CSS animations is also available from the download link on the Index & Resources page. These additions are not currently discussed in this tutorial, but the sample file contains all the required code to make them work correctly, for those who are interested.

WHY MAKE FIXED LAYOUT EBOOKS?

With the 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 for the iBooks platform. This is probably just as well if you're at all like me and prefer to do things yourself in order to retain complete control over the end result. Moreover, 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 has some handy features, it requires a trade off both in control over the underlying code, as well as rights to the final product (such as the ability to distribute the file elsewhere yourself) that some are just not willing to make, particularly when there are other options available. Making fixed layout ebooks yourself "from the ground up" embodies the independent spirt and "can-do" attitude of self-reliance most creative individuals possess as a basic staple of their artistic outlook.

Because of this I've spent many months working out how to build fixed layout ebooks for the iBooks platform in order to replicate the layouts I desire for my illustrated ebook projects. Since my intention is to produce a full-color print edition in the standard 2:3 ratio "perfect bound" format (i.e. 6x9 or 5.5 x 8.5) 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 layout. For full color, heavily illustrated projects such as comics or children's books, the iBooks fixed layout format for the iPad is the obvious place to start when it came to creating the digital editions, due to the display size and 4:3 aspect ratio. Sadly, no other full size color tablet uses this ratio, which is the ideal one for fixed layout ebooks, even though all of the smaller eInk models do (see the Device Display Resolution Chart for a comparison of the most common e-reading devices).

WHAT IS FIXED-LAYOUT?

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. These "reflowing" formats are incompatible with highly styled 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 with no outer margins, 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 won't go into this for now, due to length, but may at some point write a new tutorial devoted just to that topic for those who are interested.

Apple's fixed-layout iBooks format is an "ePub" file - an industry standard specification used as the basis of virtually all ebook platforms today - with a few additional options and requirements that make it only viewable on iOS devices. It also incorporates all the nice features inherent in the iBooks app, such as pinch and zoom, animated page turns, and automatic reorientation (unless you choose to turn these off). Both Barnes & Noble's NookColor/Tablet and Amazon's Kindle Fire have proprietary 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 fixed-layout "comics" portion still forthcoming [NOTE: these, of course, have now been long available for public use, but were not at the time of writing this tutorial]. And of course they both only have 7" screens [with the Fire 8.9" out now too], which is too small to adequately display more than a single book page at a time. Moreover, nearly all other mobile devices on the market employ a "widescreen" presentation which is tailored more for movies than ebooks. This is not prohibitive, but it isn't ideal either, particularly if you want to reproduce the two-page layout of a print edition - the widescreen aspect ratio is just too elongated to fit it adequately. It can be done - and I have created a full tutorial on fixed layouts for the Kindle - but only iBooks can display two-page layouts to best effect.

THE TEMPLATE

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 the following series 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. If you follow along and implement each step carefully you will gain a solid understanding of how these ebooks work, and have a working file to use as the foundation for your own. Much of the information presented here is also applicable to the Kindle format, and will will built upon in the Kindle Fixed Layout Tutorial.

RESOURCES

There are many 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, such as how to format your manuscript with headings and sections that are not relevant to fixed layouts. While flowing and fixed layout files share many common elements, this tutorial is designed specifically to help you create an illustrated ebook with "live" text layers, such as children's books or graphic novels, for the iBooks platform. Information on how to produce reflowing files can be found abundantly elsewhere. Much of the core ePub structure, however, is the same, or very similar.

Before we begin, therefore, here are a few general ePub resources you might consult:

When it comes to fixed-layout iBooks specifically, these resources could prove useful:
  • iBookstore Asset Guide (PDF download) - Apple's own documentation, which includes a very sketchy section on creating fixed-layout ebooks. This is required reading if you plan to upload your files to iTunes.
  • 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.
  • Creating Fixed Layout EPUB - Video tutorial series by Anne-Marie ConcepciĆ³n at lynda.com (free 10-day trial available).
  • Field Guide To Fixed Layout - Book Industry Study Group (BISG) publication overview (select the "pay what you want" option).

Other than that, there isn't much information available on how to produce high quality iBooks in this format. I'll cover the essentials, enough to get you going, 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 (much like reading an automotive manual), but quite enlightening nonetheless - and an essential reference when you get stuck or need to know how to handle something specific in a "legal" way!

Up next: The File Structure

Join Us
On Google+

Receive Our
RSS Feed

Look For Us
On LinkedIn

View Our Vids
On YouTube