[iOS] HTMLからiBooksで読めるEPUBを作ってみる

iOSデバイスにiBooksというすばらしいアプリが入っているわけですが、日本語の電子書籍がなかなか出てこないので、いまいち使いこなしている気がしないわけです。

今回は、コンテンツをPDF形式ではなくEPUB形式で作成して、iBooksで読むチャレンジをしてみます。EPUB形式ですので、本のようにページがめくれたり、フォントサイズの変更が可能です。

このところWEB制作ではJavaScript全盛のようですので、基礎から勉強し直したいと思っていたところ、M. Haverbeke著の『Eloquent JavaScript』がいいよと教えていただいたので、それを利用します（ライセンスはCC BY 3.0です）。

１．データを準備する

EPUBに変換するにはすべての内容が1ページに含まれていたほうがよいので、Eloquent JavaScriptのサイトから「HTML, single page (not interactive)」を選択し、パソコンに保存します。CSSや画像も一緒に保存するようにしてください。

基本的にはこれだけなのですが、このコンテンツに限って、後でEPUBに変換する際に章タイトルが左側にはみ出してしまうのを防ぐため、book.cssの中のh1タグのmargin-leftを-1emから0emに修正しておきます。

２．calibreのインストール

本稿では、EPUB形式のブックを作成するためにcalibreというアプリを使用します。calibreのWEBサイトから、アプリをダウンロードしてインストールします。Mac/Windows/Linuxに対応しているようです。

３．EPUBの作成

calibreを起動したら、左上のAdd booksをクリックし、1．でダウンロードしたHTMLファイルを選択します。しばらくすると、リストの中に読み込んだファイルが表示されます。

次に、Edit metadataをクリックし、書籍のタイトル、著者名を入力します。また、表紙の画像は、Eloquent JavaScriptのサイトの画像を利用するか、Download coverをクリックするとGoogleやAmazonに該当するものがあれば見つけてくれます。

OKで閉じて、Convert booksをクリックすると、EPUB形式に変換することができます。設定項目がいっぱいありますが、とりあえず何も変更する必要はありません。

OKを押した後、画面左下のJobsが0になったら完了です。

４．iBooksへの取り込み

Save to diskをクリックすると、パソコンに変換されたデータを保存することができます。フォルダの中にある、拡張子がepubというファイルが目的とするファイルになります。これを次のいずれかの方法でiBooksに転送すれば終了です。私はDropboxを使いました。

・iTunesにドラッグ＆ドロップしてライブラリに追加後、iOSデバイスを同期する
・Dropboxなどに保存してiOSデバイスから直接開く

ということで、HTMLファイルをiBooksで読むことができるようになりました。

なお、最後の画像の加工には、designbitsのtrimit!を使わせていただきました。