Sigil で Epub を作るときの覚書
この記事は自分用の覚書です。
チーム各位
わかったことを、いったんまとめておきます。といっても、間違えているところもまだあるはずです。書いてあるまま信じ込まないように。
■主な環境
・ Windows8 Pro 64ビット
・ EPUB エディター Sigil (バージョン0.71)を日本語表示で使用
・ Kindleプレビューツールv2.8
・ Kindle Paperwhite (ファームウェア5.3.4)
■参考情報
・ Kindleパブリッシング・ガイドライン(2012年5月版)と日本語サポート補足資料(2012-05-18)
Amazon のサイトでダウンロード可。
・日本語Epubブックサンプル - 横浜工文社のサイト
■縦書き、横書き共通
1. html タグに xml:lang="ja" を追記する。
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
Sigil を起動すると、ブックブラウザーの Text のなかに、 Section0001.xhtml というファイルができている。
それをコードビューで表示して xml:lang="ja" を追記する。
2. ブックブラウザーでの追加
・ Styles にスタイルシートを追加
Styles の上で右クリックし、「空のスタイルシートを追加」を選択
スタイルシートの1行目に
@charset "utf-8";
を記入。
・ HTML の head タグの間に CSS へのリンクを追加
***.css の部分はスタイルシートのファイル名に合わせる。
<head> <link href="../Styles/stylesheet.css" rel="stylesheet" type="text/css" /> </head>
このブログの幅でコードを表示するために改行しています。
2-1. 表紙や本文で使う画像を追加
Images の上で右クリックし、「既存のファイルを追加」を選択
2-2. Images で、表紙にする画像の指定
画像のファイルの上で右クリックし、「セマンティックスを追加」-「表紙の画像」を選択
3. メタデータの記入
・メニューの「ツール」から「メタデータエディター」を選択。
メタデータに記入した「タイトル」、「著者」が KindlePaperwhite のホーム画面で「リスト表示」のときに書籍名と著者名として表示される。
4. 書籍を書き終えたら、章ごとに分割
Sigili を起動した直後にできている Section0001.xhtml に書いていった場合。
・ h1、h2 などの見出し、Pタグでの段落などの指定が間違えてないかを確認。
・書きあがったら、 Section0001.xhtml を章ごとに分割する。
分割したい見出しの行頭にカーソルを移動させて、メニューの「編集」-「カーソル位置で分割」を選択。
分割したほうが KindlePaperwhite で開いたときの動きが軽いような気がします。気のせいかも……
分割しなくても書籍として読めますが、分割しておくと、章の終わりと頭がわかりやすくなります。
分割しておくと、 KindlePaperwhite で章の頭は必ず次画面になりますから。
章ごとに分割してから、目次(論理TOC)と書籍の目次を作ります。
5. 目次(論理TOC)の生成
論理TOCを作っていない Sigil には toc.ncx はあるが中身がまだない。目次(論理TOC)を生成すると toc.ncx に目次(論理TOC)が書き込まれる。
メニューの「ツール」から「目次」-「目次を生成」を選択。
目次(論理TOC)はデバイスが利用する。紙の本にあるいわゆる目次のページとは別のもの。
6. 書籍の目次ページを作成
書籍の目次ページを作る。紙の本にあるいわゆる目次のページ。
論理TOCを先に作っておく。論理TOCを作ってから目次ページを作ると、見出しへのリンクを伴った目次ページが作られる。
メニューの「ツール」-「目次」-「HTMLn目次を作成」を選択。
ブックブラウザの Text のなかに TOC.xhtml というファイルができる。
論理TOCと、この目次の違いがよくわかりせん。KindlePaperwhite でどのように扱われるのかとかも。目次に関してはさらに調査とテストが必要です。
ここで作る目次のページは、「移動」メニューから表示されるようです。
ちまたにある Epub のサンプルなどを見ていると、ここで作る目次のページが「移動」で表示されるようですが、自分で作ったファイルを KindlePaperwhite で見てみると階層の表示がうまくいきません。
KindlePaperwhite では、移動メニューは2階層まで表示させたり、畳んだりできるようです。
たとえば、
第1章
第1章の1
と表示したり、畳んで
第1章
としたり。それがうまくいきません。
7. タイトルページを作る。
電子書籍のタイトル用のページを作る。
・ブックブラウザーの Text の上で右クリックし、「空のHTMLを追加」を選択。
・ Section0002.xhtml などの新しいファイルができる。ファイルを選択して、右クリックの「名前を変更」を選択。
・Title.xhtml など適当なファイル名に変更して、ブックブラウザーなかでドラッグして、目次ページよりも上に移動。
Text のなかで上から順番に並んでいる通りに、KindlePaperwhite で表示されるので、タイトルページを一番上にドラッグする。
・Text の中身の例
Title.xhtml (書籍の題名)
TOC.xhtml (書籍の目次)
Section0001.xhtml (第1章)
Section0002.xhtml (第2章)
Section0003.xhtml (第3章)
■縦書きの場合
1. スタイルシートへの記入
1-1. 縦書きの指定
次のコードは、横浜工文社のサイトにある sample-tate.epub から抜粋し、 line-height: を追加しました。
僕の知識ではこれらの記述が全部必要なのか、そうでないのかわからないので、そのまま流用させてもらいました。
line-height: で、ルビ用に行間を開けています。表示をプレビューツールで見て、%のいい感じのところを探しました。
body {
line-height: 175%;
writing-mode: vertical-rl;
-epub-writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl;
line-break: normal;
-epub-line-break: normal;
-webkit-line-break: normal;
}
1-2. 縦中横(たてちゅうよこ)の指定
横浜工文社のサイトにある sample-tate.epub から抜粋。
span.tny {
writing-mode: horizontal-tb;
-epub-writing-mode: horizontal-tb;
-webkit-writing-mode: horizontal-tb;
}
1-2-1. 縦中横について
HTMLでは、縦中横を次のように指定します。
例:
全<span class="tny">24</span>冊からなるシリーズです。
上記 1-1. にある CSS で縦書きにすると、横書きのときに全角の英数字は、 span class="tny" で囲っていなくても縦中横の表示になる。半角の英数字については囲まないと縦中横にならない。
・ 「Amazon Kindle パブリッシングガイド (Appendix) 日本語サポート 2012-05-18」から引用
縦中横は、CSS プロパティ "-webkit-text-combine: horizontal;" あるいは "-webkit-writing-mode:
horizontal-tb;" で表現する。
現状では、"-webkit-text-combine: horizontal;" を使った場合、縦中横を指定した文字列が 1.9em (
目安として3桁の半角数字)を超えた場合には縦中横にはならない。
原則としては、 "-webkit-text-combine: horizontal;" を使うが、4桁以上等の場合は、 "-webkit-writing-mode: h orizontal-tb;" を使ってもよい。.tcy {
-webkit-text-combine: horizontal;
}
(Kindle パブリッシングガイドからの引用はここまで)
たとえば、
(100)
は、5桁の文字列なので、 -webkit-text-combine: horizontal; では縦中横にならない。
2. content.opf への記入
・ブック全体のページの進行方向の指定
content.opf の spine 要素の page-progression-direction 属性として "rtl" (右から左の指定)を意味する
page-progression-direction="rtl"
を記入。
例:
<spine page-progression-direction="rtl" toc="ncx"> <itemref idref="Title.xhtml" /> <itemref idref="Section0001.xhtml" /> <itemref idref="Section0002.xhtml" /> <itemref idref="Section0003.xhtml" /> <itemref idref="navdoc" /> </spine>
Sigil で新規作成した直後には、1行目は
<spine toc="ncx">
という記述になっているので挿入します。
| 固定リンク
コメント