HTML5 Example

WHAT IS BAKER

To this day, ebooks have been limited by an old standard created in the pre-Kindle and pre-iPad era. Baker is the first stepping stone to show that we could already be using the powerful HTML5 language to create books with real typography, real layouts and high-quality design.

HOW TO USE BAKER

Creating an ebook in HTML5 to be used with Baker is a three-steps operation. It's easier done than said! ;)

1. DESIGN . Create you book as one or more HTML5 documents . Limit the width to 768px (for portrait books) or 1024px (for landscape books) . You can constrain the height to match the page size or make it scrollable if you need longer pages. . You can use ANY feature in WebKit: HTML5, CSS3, JavaScript (video, audio, fonts, jQuery, Google Maps, etc). But remember: it's a book. If you want to build an app, check PhoneGap. . Consider having 1 HTML for each chapter/section/article and use the native scrolling.

2. PACKAGE . The book must be contained in a single "book/" folder. . Each chapter (horizontally swiped on the iPad) should be in a single HTML file inside the "book/" folder. . The HTML files are alphabetically ordered. You can for example do: 01.html, 02.html, etc. or A.html, B.html, etc. . In this case, 01.html (or A.html) is going to be used as the first page of the book, so it'll probably be your cover. . All the assets must be contained (with a relative reference) within the "book/" folder. . Subfolders are allowed for assets, but the HTML files will be read only from the root of the "book/" folder itself. . Check the example book from the website for an hands-on example.

3. PUBLISH . Download the Baker Framework Xcode project from http://bakerframework.com or GitHub. . Create an Apple iPhone Developer account to publish on the App Store. . Download Xcode 4 from the Mac App Store or from the Apple Developer website. . Open Baker in Xcode. . Add all the files of your book from your "book/" folder to the "book/" folder inside Baker. . If you used a CSS file to limit the width during testing, remove it. . Rename the project to the name of your book: click on the "Baker" name in the leftmost column of the project navigator. . Replace the icon files (ios-icon-*.png, check the Apple Guidelines for reference). . Change the bundle identifier in the plist file to the one you are going to use for your app. . Test your book compiling it. . Follow the instructions on the Apple iPhone Developer website to submit your book to the app store.

CREATE A BOOK FOR BOTH IPAD AND IPHONE

Since Baker Framework 2.0 you can create books and magazines for the iPhone too.

To compile your application for iPhone follow these steps: . Open the Baker Framework Xcode project with Xcode. . Click on the "Baker" project in the leftmost column of the project navigator. . On the column just left, click under Projects on "Baker" . In the "Build Settings" tab locate the section Deployment for the configuration you would like to use for compiling. . Under the Deployment section change the Target Device Family entry to match the devices you would like to target (only iPhone, only iPad or iPhone/iPad). . Compile and test the application.

DOWNLOADABLE BOOKS

From inside an existing book you make with Baker you can download other books, in the HPub format.

A book in the HPub format is like the default book that's inside Baker: . All the HTML files must be at root level (not in a subfolder, otherwise you'll get an empty book). . The HTML files are alphabetically ordered. You can for example do: 01.html, 02.html, etc. . In this case, 01.html is going to be used as the first page of the book, so it'll probably be your cover. . All the assets must be contained (with a relative reference) within the root folder. . Subfolders are allowed for assets, but the HTML files will only be read from the root of the folder itself.

When it's ready: 1. Zip all the files (not the folder, remember!). 2. Change the extension of the file from ".zip" to ".hpub". 3. Upload the .hpub file on a server. 4. Link from a Baker book the book on the server, with the syntax: book://example.org/path/bookname (with or without extension, Baker will add ".hpub" by itself).