概説EPUB(実践編)

実際にテンプレートファイルからEPUBを作ってみる

前回はひとまずEPUBを構成する基本的なファイルたちの構造と役割をサラッと解説しましたが、アレだけではEPUBは作れない。そんなわけで、適当な文章と前回のテンプレートから、実際にiBooksなどで閲覧可能なEPUBファイルを作ってみます。そんなわけで、EPUB用のテンプレートファイルを開いて作業します。

EPUBにするテキストを選ぶ

EPUBを作るからにはなにかしらコンテンツが必要なので、どこかから適当にテキストファイルを持ってきます。色々考えるのが面倒くさい人は、青空文庫とかから適当に短編を選ぶといいと思います。長編小説を選んでも別にいいのですが、テキストファイルからXHTMLファイルに変換するのもとりあず手作業でやってしまうので、面倒くさいです。

ただ、短編一つだと章立てしたりそれに基づいて目次を作ったりが出来ないので、今回は短編小説をいくつか選ぶといいんじゃないかと思います。今回サンプルで使ってみるのは、芥川龍之介の「愛読書の印象」と「秋」の二つにしようかなと思います。青空文庫から手に入るファイルはどちらもルビが入っていて鬱陶しいので、ルビとか消した物をzipで固めておいてます。サンプルとか用意するのが面倒くさい人は使えば良いと思います。


テキストファイルをXHTMLにする

ここが手作業でやるにはちょっと面倒くさいんですけど、こったマークアップをしなければ対して時間はかからないです。とりあえず、テンプレートの中に入っている『_template.html』をコピーして使うといいと思います。基本的には一つの論理行をひとつの段落としてp要素で囲んで、タイトルはh1要素に、章立ての番号なんかはh2要素あたりにすればいいと思います。
問題は『鍵括弧の直前には改行が必ず入る』とか『鍵括弧の後は展開がどうであれ必ず新しい段落になる』みたいな作文的なルールをどこまで尊守するかなのですけど、ここで厳密な正解を考え出すと面倒くさい人に絡まれて収拾がつかなくなること請け合いなので、個々の判断でやるのがいいんじゃないかと思います。要するに一つの作品の中でルールが統一されていれば作文的な作法に厳密に従っているかは大して問題ではないというのが僕の感覚です。
そんなわけで、実際に僕が書いたXHTMLを一部載せておきます。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC
	"-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
	
	<head>
		<title></title>
		<link rel="stylesheet" href="default.css" type="text/css"/>
	</head>

	<body>
		<h1></h1>
		<h2></h2>

		<p>信子は女子大学にゐた時から、才媛の名声を担つてゐた。彼女が早晩作家として文壇に打つて出る事は、殆誰も疑はなかつた。中には彼女が在学中、既に三百何枚かの自叙伝体小説を書き上げたなどと吹聴して歩くものもあつた。が、学校を卒業して見ると、まだ女学校も出てゐない妹の照子と彼女とを抱へて、後家を立て通して来た母の手前も、さうは我儘を云はれない、複雑な事情もないではなかつた。そこで彼女は創作を始める前に、まづ世間の習慣通り、縁談からきめてかかるべく余儀なくされた。</p>

以下もこんな感じで延々と続きます。基本的にはテンプレートに入っているhtmlファイルにテキストをペーストして、titleおよびh1要素に作品名を入れて、複数の章に分かれている場合は各章をh2でマークアップする漢字です。あとは段落ごとにp要素で囲ってあげる。ついでに、鍵括弧周辺に関しては、作文のルールを厳密に守ろうとすると鍵括弧ごとに段落が切り替わらなきゃいけないんですけど、あまり体裁がよくない気がするので、明らかに場面が変わっている箇所以外はbr要素で改行するにとどめています。

こんなかんじで、一冊にまとめたいコンテンツを作品ごとに独立したhtmlファイルにして、分かりやすく連番で名前をつけてください。

前回説明したファイルの帳尻を合わせる

ここらへんが凄く面倒くさいんですけど、やらないとちゃんとしたEPUBにならないのでやります。出来るだけ丁寧に説明します。

このへんは前提を共有しとかないと分かりづらいので、以下のような前提でお話を進めます。

  • 芥川龍之介の短編二つを単一のEPUBに収録する
  • 収録する作品は『愛読書の印象』と『秋』の二編
  • 夫々を001.html, 002.htmlというファイル名で保存している
  • 『秋』(002.html)は四章構成になっているので、各章の冒頭の漢数字をh2要素としてマークアップし、『c001』から『c004』までのIDを割り振っている
EPUB/content.opf

まずはcontent.opfを編集します。とはいえ大して難しいことはありません。まずは前回のテンプレートから、content.opfファイルをエディタで開きます。で、以下の箇所を編集します

	<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">著者名</dc:creator>
		<dc:language>ja</dc:language>
		<dc:publisher>EPUB作った人</dc:publisher>
		<dc:identifier id="BookId">urn:uuid:d.hatena.ne.jp/HowManyFiles/book001</dc:identifier>
	</metadata>

ここを、以下のように書き換えます。

	<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">芥川龍之介</dc:creator>
		<dc:language>ja</dc:language>
		<dc:publisher>*貴方のお名前*</dc:publisher>
		<dc:identifier id="BookId">urn:uuid:このEPUBのID(他のものと被らなさそうなものなら何でもいい)</dc:identifier>
	</metadata>

これで今から作るEPUBが、『芥川龍之介・私撰集』というタイトルの本で、文章の作者は『芥川龍之介』で、EPUBという形に編纂したのが『あなた』であることが明確になります。ここに書かれた情報は、EPUBを閲覧するソフトウェアによって分かりやすい形でユーザに表示されます。

次に、以下の箇所を編集します。

	<manifest>
		<item id="ncx"      href="toc.ncx"     media-type="application/x-dtbncx+xml" />
		<item id="style"    href="default.css" media-type="text/css" />
		<item id="html-001" href="001.html"    media-type="application/xhtml+xml" />
		<item id="html-002" href="002.html"    media-type="application/xhtml+xml" />
		<item id="html-003" href="003.html"    media-type="application/xhtml+xml" />
		<item id="html-004" href="004.html"    media-type="application/xhtml+xml" />
		<item id="img_001"  href="fig001.png"  media-type="image/png"/>
		<item id="img_002"  href="fig002.png"  media-type="image/png"/>
	</manifest>

ここにはEPUBのなかで使用されるファイルを列挙するので、以下のような感じになります。

	<manifest>
		<item id="ncx"      href="toc.ncx"     media-type="application/x-dtbncx+xml" />
		<item id="html-001" href="001.html"    media-type="application/xhtml+xml" />
		<item id="html-002" href="002.html"    media-type="application/xhtml+xml" />
	</manifest>

なんだかずいぶん目減りしました。というのも、テンプレートそのままだと『htmlファイル四個』『スタイルシート一個』『画像二個』を使うことになっているのに対して、今回はスタイルシートも画像も一切使わないからです。これで、このEPUBには(必要不可欠な雑多なファイルを除けば)htmlファイルが二つだけ入ってる構造だと定義できたことになります。

さらに、その下の部分も編集します。こんかいは元の部分は省略して、編集後の形のみを掲載します。

	<spine toc="ncx">
		<itemref idref="html-001" />
		<itemref idref="html-002" />
	</spine>

説明の必要はないと思われますが、htmlファイル二つをファイル名と同じ順番で並べただけです。ここではidで指定を行う点だけを注意すれば大丈夫です。これで、content.opfファイルの編集は終了です。

OEBPS/toc.ncx

続いて、toc.ncxを編集します。ちゃっちゃと行きましょう。

まずは以下の部分を編集します。

	<head>
		<meta name="dtb:uid" content="d.hatena.ne.jp/HowManyFiles/book001"/>
		<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>著者</text>
	</docAuthor>

編集後は以下のような感じです。ここは先程のcontent.opfと内容が被り気味なので、流します。

	<head>
		<meta name="dtb:uid" content="*content.opfで指定したのと同じID*"/>
		<meta name="dtb:depth" content="1"/>
		<meta name="dtb:totalPageCount" content="0"/>
		<meta name="dtb:maxPageNumber" content="0"/>
	</head>
	<docTitle>
		<text>*content.opfで指定したのと同じタイトル*</text>
	</docTitle>
	<docAuthor>
		<text>*content.opfで指定したのと同じ著者名*</text>
	</docAuthor>

この下が目次の情報になります。ちょっとややこしいのですが、慣れればどうということはないです。テンプレートのnavMap要素の中を、以下のように編集します(オリジナルは省略)。

	<navMap>
		<navPoint id="html-001" PlayOrder="1">
			<navLabel>
				<text>愛読書の印象</text>
			</navLabel>
			<content src="001.html"/>
		</navPoint>

		<navPoint id="html-002" PlayOrder="2">
			<navLabel>
				<text></text>
			</navLabel>
			<content src="002.html"/>

			<vavPoint id="html-002-001" PlayOrder="3">
				<navLabel>
					<text></text>
				</navLabel>
				<content src="002.html#c001"/>
			</navPoint>
			<vavPoint id="html-002-002" PlayOrder="4">
				<navLabel>
					<text></text>
				</navLabel>
				<content src="002.html#c002"/>
			</navPoint>
			<vavPoint id="html-002-003" PlayOrder="5">
				<navLabel>
					<text></text>
				</navLabel>
				<content src="002.html#c003"/>
			</navPoint>
			<vavPoint id="html-002-004" PlayOrder="6">
				<navLabel>
					<text></text>
				</navLabel>
				<content src="002.html#c004"/>
			</navPoint>
		</navPoint>
	</navMap>

これでファイルの編集作業は終了です。あとはEPUBの仕様が要求しているとおりに圧縮するだけなのですが、それを厳密にやろうとするとちょっと面倒だったりするので、その辺に関して少し書いておきます。

正しいEPUBにするための圧縮方法

前回の記事では『EPUBは必要な情報を必要な形で格納した単なるzipファイルだ』みたいなことを書きました。それは嘘ではないのですが、実際にEPUBを作るとなると、すこしだけ配慮すべきことがあります。実は、EPUBとして正しいフォーマットである為には、以下の要件を満たしていることが必要です。

  • zipの内容の先頭に『mimetype』ファイルが配置されていること
  • 『mimetype』ファイルは非圧縮の状態で格納されていること

以上です。地味に面倒くさいですね。不可解な仕様ですが、おそらくは貧弱なハードウェアでも利用出来るようにとかそういう配慮だと思います。電子書籍専用のハードウェアを想定すると、汎用計算機であるパソコンと比べて処理能力が低いことや搭載されたメモリの容量が少ないことは想定しなければならないですし。

つまり、正しいEPUBを作るには、ファイルごとの圧縮/無圧縮やアーカイブ内でのファイルの並び順を指定できるアーカイバを使う必要があるということです。GUIを搭載したいまどきのアーカイバはそこまでの機能がないことが多いので、コマンドラインからの作業になるでしょう。ただ、実際には大抵の場合は単にzipで圧縮しただけでも大丈夫なようです。

圧縮してzipファイルにしたら、あとはファイルの拡張子をepubに変更すれば晴れてEPUBファイルの感性です。iBooksなどにファイルを転送して、きちんと表示されるかを確認しましょう。

次回予告

次回は、iBooksに特化したEPUBの調整方法を紹介しようかと思います。