リフロー型Kindle本の図版設計（連載⑨）

リフロー型Kindle本の図版設計 — 横長で作る・文字サイズ可変に耐える（連載⑨）

「日本の測地系がわかる本」制作の裏側を綴る連載、第9回です。前回はepubcheckによる品質管理の話を書きました。今回は、Kindle本特有の制約——リフロー型レイアウトに図版をどう合わせ込むか、という設計ルールについて整理します。

リフロー型とは何が違うのか

紙の本やPDFと違い、Kindleの標準フォーマットはリフロー型です。読者が文字サイズを変えたり、端末の画面サイズが違ったりすると、レイアウトが自動的に組み替わります。図版は「決まった位置に固定された挿絵」ではなく、本文の一部として流し込まれる画像として扱われる、という前提に立つ必要があります。

この前提から、次のような共通仕様を全画像に適用しました。

項目	仕様	理由
形式	PNG（写真的な図はJPEG可）	KDP推奨
幅	1600px以上（推奨2000px）	高解像度端末でのズーム表示に耐える
縦横比	横長4:3〜16:9を基本	リフロー時に1画面へ収まりやすい
ファイルサイズ	1枚5MB以下	KDPの実務上限
文字サイズ	画像幅1600pxに対して最小40px相当	スマホ表示でも読める下限
色	カラーだが色だけに意味を持たせない（線種・ラベル併用）	電子ペーパー端末はグレースケール表示
背景	白背景（透過PNG不可）	端末のダーク背景で透過は事故る

表紙だけは例外で、KDPの仕様に合わせて縦長1600×2560pxにしています。本文中の図版とは別ルールとして扱うのがポイントです。

「横長」にこだわる理由

スマホの縦画面で本を読む読者が多いことを踏まえると、図が縦長だと1画面に収まらず、スクロールしながら図を追うことになります。逆に横長であれば、画面幅いっぱいに表示されたときに図全体が視界に収まりやすくなります。このため、新規に作図する図版は「横長4:3〜16:9を基本」というルールに統一しました。

実際に起きた問題：縦長スクリーンショットでEPUBが膨張

このルールを徹底していても、既存のブログ用スクリーンショット（アプリの実機画面）を流用する場面では縦長画像を扱わざるを得ないことがあります。実際の制作では、章末の「アプリで確かめる」に縦長のスマホ画面（1600×3479px相当）を追加した際、その回の再ビルドでEPUB全体のサイズが大きく増加したことがありました。

この経験から、縦長のスクリーンショットをそのまま1枚で使うのではなく、次のような再加工ルールを徹底しています。

スクリーンショットは端末の枠を切り落として主要部を拡大する
縦長のスクリーンショットが複数ある場合は、2枚を横に並べて1枚の横長画像に合成する
画像内の文字が40px相当に満たない場合は、拡大するか作り直す

横長で構成した年表図の例

上の年表図も、情報量が多い題材をあえて横長1枚に収めた例です。時系列という性質上、横方向に情報を並べるレイアウトと相性がよく、リフロー表示でも読みやすくなります。

命名規則で「本の構造」と画像を対応づける

画像ファイルは ch<章番号2桁>-<内容>.png という命名規則に統一しています（例：ch02-tokyo-jgd-400m-shift.png）。これにより、どの章のどの図かがファイル名だけで分かり、章の入れ替えや追加が発生したときも管理がしやすくなります。実際に欠番章を後から挿入した際も、この命名規則のおかげで画像の対応関係を混乱なく整理できました。