電子書籍ファイルePubについて -ePubを自分で作成する-

Clip to Evernote

2010年代に突入して半月強、Kindleの国際展開ACCESSによる携帯電話での提供など、心なしか日本における電子書籍に関する話を目にする・耳にすることが増えたような気がします。個人的には昨年末にSony Readerを購入したこともあり、日本でもアメリカのように電子書籍が本格普及してくれればと感じています。

そんな電子書籍のフォーマットの1つに、ePubというものがあります。このフォーマットは「米国の電子書籍標準化団体の1つであるInternational Digital Publishing Forum(IDPF)が普及促進するオープンな電子書籍ファイルフォーマット規格」(Wikipediaより)であり、Sony Readerでは標準型式として採用されているほか、Google Booksでも採用されている型式です。現状ではKindleではサポートされていないようですが、オープン型式ということで、いずれサポートされる可能性も無くはないと思います。

ePubの仕組みは非常に簡単で、普通のWebページと同様に(X)HTMLやCSSで作られているため、基本的にはWebページを作る知識があれば誰でも作ることができます。そのあたりの解説は日本語Epubブックサンプル – 横浜工文社に詳しくまとめられていますが、ここでは筆者の知識の整理の意味も込めて、改めて自分でePubを作成する手順(=青空文庫XHTML→ePub変換で行っている処理)について解説して行きたいと思います。

ご意見・ご感想・ご指摘・質問(は答えられるかはわかりませんが)等は@naokisatonameまで。

なお、サンプルとしては青空文庫から作成したアンデルセンの「赤いくつ」を取り上げます。

赤いくつ

そもそもePubって?

電子書籍型式の1つです。PDFと似たようなものです。

Sony Readerでは標準形式として採用されています。Kindleではサポートされていませんが、その他の主要な電子書籍リーダでは基本的にサポートされていると思います。

PCやiPhoneでのePubリーダとしてはStanza等があります。また、最近ではACCESSが携帯電話向けへの提供を試験中のようです。

ePubの概要

ePub型式の特徴については、横浜工文社さんのページに非常に的確にまとめられているので、ここではそれを引用させていただきます。

  • 一定の約束のもとに構成ファイルをZIPファイルにまとめたもの(ただし拡張子は.epub)。
  • ファイル一覧や目次などXML形式のメタファイルを持つ。
  • コンテンツはXHTML(サブセット)、CSS、PNG、JPEGなど、Web標準に準拠。
  • 最大の特徴は、PDFとは異なり固定のページ境界がなく、画面やフォントの大きさに応じて、表示のたびにページ境界が変動する。

つまり、本質的にはePubはHTML、CSS、画像等をまとめたZIPファイルでしか無く、同梱するメタファイルだけ用意できれば普通にWebページを作る感覚で作成することができます

なお、ePubの規格はInternational Digital Publishing Forum (IDPF)によって決められています。また、ろすさんによって各仕様書の日本語版が公開されています

ePubのファイル構成

それでは、サンプルのePubファイルの構成を見ていきます。なお、サンプルファイルのファイル名は”42378_18502.epub“とします。先に説明したように、ePubの実態はZIPファイルなので、ZIPツールで伸長できます。

$ unzip 42378_18502.epub

	42378_18502.epub
	    42378_18502.ncx
	    42378_18502.opf
	    mimetype
	    META-INF
	        container.xml
	    OEBPS
	        42378_18502.html
	        default.css
	        font
	            ipamp-mona.ttf
	        images
	            fig42378_01.png
	            fig42378_02.png

この内、”OEBPS”内に格納されているHTML等のファイルがこのePubの本体であり、中身は普通のWebページのものとほぼ同一です。ブラウザで表示すれば、普通に表示できると思います。 その他の”mimetype”、”META-INF/container.xml”、”42378_18502.opf”、”42378_18502.ncx”の各ファイルがePub固有のメタファイルとなります。各ファイルの意味と内容は次のようになります。

mimetype

このファイルがePub型式であることを指定するためのファイルです。ZIP変換後に必ずファイルの最初にくるように指定します(ZIP変換のコマンドについては後述)。 ファイル名、内容とも固定

application/epub+zip

container.xml (META-INF/container.xml)

ePubファイルの核である.opfファイルのパスを指定するためのファイルです。ファイル名は固定、内容は.opfファイルのパスに応じて編集します


<?xml version="1.0" encoding="UTF-8"?>
<container xmlns="urn:oasis:names:tc:opendocument:xmlns:container" version="1.0">
  <rootfiles>
    <rootfile full-path="42378_18502.opf" media-type="application/oebps-package+xml" />
  </rootfiles>
</container>

opfファイル (42378_18502.opf)

このePubファイルの核となるファイル。タイトル、著者等のメタ情報、各HTMLファイルや画像ファイル、CSS、目次ファイル(.ncx)のパスおよび目次の設定を指定します。また、dc:identifierには任意のIDを指定しますファイル名およびパスは任意。内容はコンテンツに応じて編集する必要があります

<?xml version="1.0" encoding="UTF-8"?>
<package version="2.0" xmlns="http://www.idpf.org/2007/opf" unique-identifier="BookId">
 <metadata xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:opf="http://www.idpf.org/2007/opf">
   <dc:title>赤いくつ</dc:title>
   <dc:creator opf:role="aut">ハンス・クリスティアン・アンデルセン Hans Christian Andersen</dc:creator>
   <dc:contributor opf:role="trl">楠山正雄訳</dc:contributor>
   <dc:contributor opf:role="prt">naoki.sato.name</dc:contributor>
   <dc:language>ja</dc:language>
   <dc:publisher>Aozora Bunko (青空文庫)</dc:publisher>
   <dc:identifier id="BookId">urn:uuid:www.aozora.gr.jp_42378_18502</dc:identifier>
 </metadata>
 <manifest>
  <item id="ncx" href="42378_18502.ncx" media-type="text/xml" />
  <item id="style" href="OEBPS/default.css" media-type="text/css" />
  <item id="42378_18502" href="OEBPS/42378_18502.html" media-type="application/xhtml+xml" />
  <item id="img_fig42378_01" href="OEBPS/images/fig42378_01.png" media-type="image/png"/>
  <item id="img_fig42378_02" href="OEBPS/images/fig42378_02.png" media-type="image/png"/>
 </manifest>
 <spine toc="ncx">
  <itemref idref="42378_18502" />
 </spine>
</package>

ncxファイル (42378_18502.ncx)

目次ファイル。.opfファイルで指定した目次項目のidと、実際のHTMLファイルとの紐付けを指定します。ファイル名およびパスは任意。内容はコンテンツに応じて編集する必要があります。

<?xml version="1.0" encoding="UTF-8"?>
<ncx xmlns="http://www.daisy.org/z3986/2005/ncx/" version="2005-1">
  <head>
    <meta name="dtb:uid" content="www.aozora.gr.jp_42378_18502"/>
    <meta name="dtb:depth" content="1"/>
    <meta name="dtb:totalPageCount" content="0"/>
    <meta name="dtb:maxPageNumber" content="0"/>
  </head>
  <docTitle>
    <text>赤いくつ</text>
  </docTitle>
  <docAuthor>
	<text>ハンス・クリスティアン・アンデルセン Hans Christian Andersen</text>
  </docAuthor>
  <navMap>
    <navPoint id="42378_18502" playOrder="1">
      <navLabel>
        <text>contents</text>
      </navLabel>
      <content src="OEBPS/42378_18502.html"/>
    </navPoint>
  </navMap>
</ncx>

ePub作成手順

ePubを作成するには、その本体となるコンテンツ(XHTML、CSS、画像等)と、ファイルの内容を指定するメタファイルとを用意する必要があります。基本的には次のような流れになります。

  1. エディタ等を使ってXHTMLとCSSで文書を作成します。この時、ファイルを複数に分割しても問題はありません。また、XHTMLについてはHTML宣言に言語を指定した方が良いようです。同文書で使用する画像等のリソースファイルを準備します。
  2. 文書と各リソースファイル類をOEBPSフォルダに移動します。リソースファイル類のアドレスに注意して、作成したXHTMLファイルがブラウザで問題なく表示できることを確認します。
  3. 目次ファイル(ncxファイル)を作成します。コンテンツの各XHTMLファイルとidとを紐付けます。
  4. opfファイルを作成します。各メタ情報、アイテムのパス、目次等をコンテンツに応じて編集します。
  5. META-INF/container.xmlを作成します。内容をopfファイルのパスに応じて修正します。
  6. mimetypeを作成します。
  7. ePubファイルを作成します。この時点でのフォルダ構成は上記のサンプルの例を参考にしてください。以下のようなコマンドでePubファイルを作成します。
    zip -0 yourbook.epub mimetype
    zip -r yourbook.epub * -x mimetype
    

    なお、詳細は横浜工文社さんをご確認ください。特に、Windows環境の方は標準ZIPではうまくいかないようなので、ご注意ください。

  8. 電子書籍リーダやブラウザ等で動作を確認します。

以上の手順でePub型式の電子書籍が作成できました。あとはWebページで公開するなり、電子書籍リーダで読み耽るなりiPhoneで持ち出すなりScribdで共有するなり、各自でお楽しみください。

フォントの埋め込みとSony Readerにおける日本語コンテンツの表示

ePubはフォントの埋め込みに対応しています。上のサンプルファイルでもフォントを埋め込んでいます。埋め込むにはサンプルのように

  • フォントファイルをOEBPS以下の任意の場所にコピーし、
  • CSSファイルで@font-faceを指定します。
    @font-face {
      font-family: "ipampmona";
      src: url(font/ipamp-mona.ttf);
    }

なお、Sony Readerには日本語フォントがインストールされていないため、ePubに日本語用のフォントが埋め込まれていない場合、標準の状態では日本語を表示することができません。ですが、Sony Readerのルートフォルダの直下(Macの場合は “/Volumes/READER/” の下)に”fonts”というフォルダを作成し、そのフォルダにフォントファイルをコピーすることでそのフォントを利用できるようになります。この場合、CSSファイルでの指定は次のようになります。

@font-face {
  font-family: "ipampmona";
  src: url(res:///Data/fonts/ipamp-mona.ttf);
}

ePubファイルを作成するWebサービス

上で解説した一連の手順を自動化して、青空文庫からePubを作成するBookmarkletを提供しています。URLを判断しているので青空文庫でしか使えませんが、古典作品のePubファイルをご所望の場合はお試しください。

また、現在はまだBetaサービスのようですが、Instapaperで未読のWeb記事をまとめて1つのePubファイルにまとめるサービスが提供されています。ただ、試してみたところ、残念ながら今のところ日本語には対応していない模様です。

(参考)

Tags:

13 Responses to “電子書籍ファイルePubについて -ePubを自分で作成する-”

  1. [...] 事書きました > 電子書籍ファイルePubについて -ePubを自分で作成する- http://naoki.sato.name/lab/archives/45 # [...]

  2. [...] lab for naoki.sato « 電子書籍ファイルePubについて -ePubを自分で作成する- [...]

  3. [...] ておかないと、書籍を管理するのが大変になります。また、Sony Readerでは、本文中では日本語が表示できるものの、Home画面や書籍一覧の画面では日本語が表示されないため、タイトルや著 [...]

  4. [...] 基本的に以前ポストしたePub形式のファイル構成に従って必要なファイルを作成し、パッケージ化しているだけです。 [...]

  5. [...] たって] フォーマットepub形式 epubはXHTML+CSSをzip形式で圧縮したものらしいです。 電子書籍ファイルePubについて -ePubを自分で作成する- « WordPressでYoutubeをギャラリー表示のPlugin [...]

  6. [...] EPUBファイルについてはこの記事やこのタグを参照していただきたいのですが、基本的には、本の中身のデータと、メタデータとを一緒にZIP圧縮したファイルになっています。ということ [...]

  7. zeero says:

    WebページをePubに変換するブックマークレットを作りました。

    『Web2Stanza』公開しました

    このページの情報をめちゃくちゃ参考にさせて頂きました。
    ありがとうございます。

    青空文庫ブックマークレットに比べると精度いまいちかもしれませんが、
    よかったら試してみてください。

  8. [...] 電子書籍ファイルePubについて -ePubを自分で作成する- http://naoki.sato.name/lab/archives/45 [...]

  9. [...] ePub規格のファイルを作成する方法は、こちらです。 [...]

  10. [...] Ubuntuでsigilを利用してをepub形式の電子書籍を作成する 電子書籍ファイルePubについて -ePubを自分で作成する- 【美ePub作成】ePub作成で作るのはHTML・画像・CSS [...]

  11. [...] 電子書籍ファイルePubについて -ePubを自分で作成する- « lab.naoki.sato.name (tags: epub) [...]

  12. [...] ePubは基本的に下のような構造のZIPファイルから成り立っています。.epubを.zipに変換すればアーカイブを解凍することができます。ePub形式では下の赤く書かれたファイルの構造は変えてはいけませんが、それ以外の構成は自由にしても構いません。そのため、OEBPSの中にCSSやFontを埋め込んでも問題はありません。しかし、拡張子が.opf,ncxになってる構造ファイルと目次ファイルは決まったフォーマットで作成しなければなりません。下記に参考にしたサイトを乗せておきますので、詳しくはそちらを参考にしてください。 ePubの基本構造 参考サイト:電子書籍ファイルePubについて -ePubを自分で作成する – http://naoki.sato.name/lab/archives/45 [...]

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <img localsrc="" alt="">