11月11日にアマゾンジャパン本社で行われた、「Kindleフォーマットセミナー」に参加してきたのでレポートさせていただきます。内容は以下の通りです。
- Kindle Overview（Kindleの概要）
- 商品情報とお客様の利便性
- Kindle本を制作、出版するためのツール、ドキュメント、ビューワ最新情報
- Kindleコミッククリエーター（KC2）で作る、簡単マンガ（写真集）制作
- Kindle用EPUB制作に関するTipsと注意点 ← 本稿はここ
セミナー中の撮影・録画は禁止されていたため、ほとんど文章のレポートになります。このパートは、Kindle用EPUB制作に関するTipsと注意点ということで、いままでよりかなり専門的な内容になっています。いわゆる、トラブル事例集です。
目次を正しく表示するには
紙の本と同様に冒頭にある視覚的な目次（HTML TOC）はほとんど問題ないのですが、論理目次（論理TOC）に対応していない本が結構多いのだそうです。また、Android版やiOS版のアプリは論理目次に対応していないのですが、landmarksを指定していないと［目次］メニューがグレーアウトされ使えない状態になってしまいます。目次を設定するために必要なのは、EPUB 3の場合は、ナビゲーション用XHTMLファイルです。EPUB 2の場合は、NCXファイルです。これから新規で作成する場合は、EPUB 3準拠の方がいいと思うので、セミナーではEPUB 2の説明もありましたが、割愛してEPUB 3だけ説明します。なお、両方あるばあいはEPUB 3方式が有効になるそうです。Kindle Paperwhiteの［移動］メニューで章や節のタイトルを表示するには、ナビゲーション用XHTMLファイルを以下の様に記述します。
<?xml version=”1.0″ encoding=”UTF-8″?>
<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml” xmlns:epub=”http://www.idpf.org/2007/ops” xml:lang=”ja”>
<head>
<title>Navigation</title>
</head>
<body>
<nav epub:type=”toc” id=”toc”>
<ol>
<li><a href=”text/toc-001.xhtml”>目次</a></li>
<li><a href=”text/OB01.xhtml”>第一章 EPUB 基礎</a></li>
<li><a href=”text/OB02.xhtml”>第二章 EPUB 応用</a></li>
</ol>
</nav>
</body>
</html>
iOS版、Android版のKindleアプリで［移動］メニューの［目次］を有効にするには、landmarksのtoc型リンクを設定します。
<nav epub:type=”toc” id=”toc”>
<h1>Navigation</h1>
<ol>
<li><a href=”text/toc-001.xhtml”>目次</a></li>
<li><a href=”text/OB01.xhtml”>第一章 EPUB 基礎</a></li>
<li><a href=”text/OB02.xhtml”>第二章 EPUB 応用</a></li>
</ol>
</nav>
<nav epub:type=”landmarks”>
<h2>Guide</h2>
<ol>
<li><a epub:type=”cover” href=”text/p-cover.xhtml”>表紙</a></li>
<li><a epub:type=”toc” href=”text/toc-001.xhtml”>目次</a></li>
<li><a epub:type=”bodymatter” href=”text/OB01.xhtml”>本編</a></li>
</ol>
</nav>
リフロー型のTipsおよび注意点
color属性は指定しない
Overviewでも触れられていましたが、ユーザーが端末側の設定で背景色黒（ナイトモード）を選択した時に、文字やリンク・罫線などの色が #000000 になっていると、黒背景に黒字で、全く読めなくなってしまいます。cssファイルでcolor属性は指定しないようにしましょう。
縦組み左右中央揃え（非推奨）
コンテンツ全体は縦組み右揃えで、章扉ページのみ縦組み左右中央揃えにしたい場合は、html や body で writing-mode を混在させることはできないので、div で指定すればいいそうです。ただし、この方法は非推奨（あまり長い文だと小さいディスプレイで改行が入り読みづらくなるため）とのことです。
<html ・・・ class=”hltr”>
<head>・・・</head>
<body class=”p-text”>
<div class=”vrtl block-align-center”>
<div class=”main”>
<p><span class=”font-180per”>蜘蛛の糸</span></p>
<p>芥川龍之介</p>
</div>
</div>
</body>
</html>
記述に関する注意
紙の本をリフロー化するときに、ありがちなミスが挙げられていました。
- × 「○○ページを参照」：リフロー型にはページ数の概念がないので、「××の項目を参照」という表現に改め、アンカータグを使って書籍内リンクにするといいでしょう。
- × 「乱丁・落丁がありました場合は、お取り替えします」：紙に特有の表現なので削除して下さい。
- × 表を入れ子にする：<table>タグのセルの中に別の表を埋め込むことはできません。
- × 外部リンク：外部ソースを参照しないと読者がコンテンツ全体を入手できないようなものは不可。
- ○ 企業のウェブサイトを紹介する、みたいな外部リンクなら問題なし。
固定レイアウト型のTipsおよび注意点
コンテンツをページサイズに合わせるには
余白が出ないようにする、または、右と下がカットされないようにするにはまず同じ解像度（ピクセル数）の画像を使うことが重要です。その上で、OPFファイルの original-resolution 属性で、使用する画像のピクセル数を設定します。
<metadata>
・・・
<meta name=”fixed-layout” content=”true” />
<meta name=”book-type” content=”comic” />
<meta name=”original-resolution” content=”800×1200″ />
・・・
</metadata>
コミックを見開き表示にするには
端末を横向きにしたとき、コミックの表示を見開き（2ページ）にしたい場合は、OPFファイルで orientation-lock:none と book-type:comic を設定します。
<metadata xmlns:dc=”http://purl.org/dc/elements/1.1/”>
・・・
<meta name=”fixed-layout” content=”true” />
<meta name=”orientation-lock” content=”none” />
<meta name=”book-type” content=”comic” />
<meta name=”original-resolution” content=”800×1200″ />
<meta name=”primary-writing-mode” content=”horizontal-rl” />
・・・
</metadata>
バーチャルパネルの移動方向を正しく設定するには
バーチャルパネルの移動方向は、OPFファイルの primary-writing-mode で制御します。拡大時にパネルを右上→左上→右下→左下と移動させたい場合（日本の通常のコミック向け）は、 <meta name=”primary-writing-mode” content=”horizontal-rl” /> と、拡大時にパネルを右上→右下→左上→左下と移動させたい場合（4コマ漫画向け）は、 <meta name=”primary-writing-mode” content=”vertical-rl” /> と指定します。
カバー画像に関する注意点
マーケティングカバー画像は、長辺が2500ピクセルの画像を推奨
「マーケティングカバー画像」とは、Kindleストアの書影などに使われる画像のことです。少なくとも短辺が1000ピクセル以上あることが望まれるそうです。端末の高解像度化が進んでいるので、それに合わせていい画像を使いましょうね、ということでしょう。ただ、「大きい画像を入稿すると、書影として表示される際に汚く圧縮されてしまう場合があるのですが」という会場からの質問に対しては、「クリックして拡大すれば綺麗な画像が表示されますよね？」 とのことでした。設定などはとくにないし、サムネイル用画像を別途提供することもできないそうです。むむむ。また、解像度が低い画像を無理やり引き伸ばして使用するのは禁じられているそうです。まあ、これは明らかに見づらくなるので、避けるべきですね。
マーケティングカバー画像の地色が白とか明るい色の場合は、書影の周囲に幅3～4ピクセルの枠を追加する
Amazonのサイトは背景が白のデザインなので、枠があると書影を表示した時に白背景に溶けこまずに済むとのことでした。これは大事ですね。
内部カバー画像は、短辺で1000ピクセル以上を推奨
短辺が500ピクセル未満の画像を使用した場合、KindleGenでmobiに変換する際に警告が表示されるそうです。
マーケティングカバー画像、内部カバー画像両方の注意点
- タイトルと著者名を明記すること
- 帯を付けない状態の書影を使用すること
- 紙の本の価格表示をしないこと
- 一時的なプロモーションやキャンペーン情報を記載しないこと
その他の注意点
いざ出版してみると、「iOSにだけダウンロードできない！」という現象に悩まされることがあります。その場合、OPFファイルの <dc:language> が半角小文字で”ja”と正しく指定されているかどうかを確認してみて欲しいとのことでした。“ja-jp”とか”japanese”と指定されているとダメみたいです。
以上で、全5回のレポートは終了です。