はい、久々の更新です。
目次の階層化に対応しました。
階層化の方法についてはいろいろ検討したんですが（カテゴリを使うとか、見出しタグを使うとか）、カテゴリとかはもう使ってたりするし、シンプルに今ある記事を階層構造にするには―と考えて、HTMLのコメントタグを使うことにしました。
<!--epubChapter-->
こいつを記事内に入れると階層の親にすることができます。
2階層までです。できれば3階層にしたかったんですが、予想以上に複雑になってしまい断念。
タイトルだけにして章扉ページみたいに使えるので、それっぽいCSSを当てようかとも思ったんですが、普通に記事を書くこともできるので現状のまま。うまい具合にカスタマイズできればいいんだけどなー。
. . .同時に、潜んでいたバグを修正しました。
目次を表示しない設定にすると、EPUB的にinvalidな状態になっていました。そのため、iBookstoreにアップできないという問題があったようです。
関係者の方にはご迷惑をお掛けしました。。。m(_ _)m
header要素の入ったEPUBをKindleGenでmobiにすると
<header> <h1>記事タイトル</h1> </header>
これが
<header> </header><h1>記事タイトル</h1>
こうなる...
パブリッシング・ガイドラインの対応タグリストにもheader要素はあるし、KindleGenのバグですかね？
ちょっと時間があいてしまいましたが、書いておいたほうがいいと思うのでメモ。
先日@ろすさんにお会いした時に、内心ドヤ顔気味に「固定レイアウトはSVGで書きましたよー」って言ったら、「あーSVGはiOS版Kindleでダウンロードできないんすよー」と言われて冷や汗をかいたのですが、その後検証したところダウンロードは問題なくできるようです。たぶん。特に不具合の報告もないし大丈夫なはず...!
ただ、いくつかハマったところが。
Kindle Paperwhiteで表示した場合、画像が画面いっぱいに表示されて縦横比がおかしくなる。Previewerの表示とも違う。 実機での確認が必要（iOS版も！）なので、サイズ指定やメタタグなどいろいろ条件を変えたファイルをKDPで出版、約1日待って検証という作業を数回繰り返すもと散々悩んだんですが、原因はkindleの スクリーンフィットという機能だったようです。なぜかONになっていた。。。デフォルトではOFFのようなので解決。
iPadに転送して見ると下と横に余白ができている。たぶん小さい画像が小さいままになっている。image要素のwidthとheightで指定してるんだけど効いてないっぽい。CSSで指定すると効いた。解決。
これが未解決なんですが、Kindle Paperwhiteでどうも画像の白い部分がトリミングされてしまう模様。
左がファイルから取り出した元画像。右が購入した書籍のKindlePWでのキャプチャ。
これなんかはまだいいが、こういう目次画像なんかだと、
こうなる。
左が元画像、右がキャプチャ。
どうも他の本でもこうなってるっぽい。ということは現状解決策はないのかな。。。
追記：
こちらろすさんに助けてもらって解決。（まあちょっと期待してたわけですがｗ）
オチとしてはxhtmlファイルにviewportの指定が抜けてました。
ちゃんと電書ちゃんにも書いてあるし！
.opfには書いてたんだけど、全部のファイルに必要だった。
ありがとうございます！
固定レイアウト試作初号ファイルをiBooksで見たらこの有様だよ！
結論から言うと、.opfに書く固定レイアウト指定
<meta property="rendition:layout">pre-paginated</meta>
こいつがあるとこうなってしまうらしい。
package要素の prefix="rendition: http://www.idpf.org/vocab/rendition/#" と両方、もしくはどちらかを削除したら直った。
さらに、iBooksで固定レイアウトを有効にする META-INF/com.apple.ibooks.display-options.xml ファイル（<option name="fixed-layout">true</option>って書くやつね）、これがある場合もこうなってしまうっぽい。（このxmlファイルでの指定はもう要らなくなったとは聞いたけど。）
でもこういう風に表示が変わるってことは（悪い方向にだけど）効いてるってわけで、何か他に必要な指定とかあるんだろうか？
うーん、EPUBですべてのデバイスという夢は遠いな...
参考：
しかし、EPUBの実践に即した情報ってホント少ないなぁ...
koboで個人出版できるKobo Writing Life。つまりKDPのkobo版。
epubやmobiを上げようと何度試してもうまくいかない。
基本的なやりかたはこちら↓を参照。
アップロードまではいけるんだけど、その後の変換でコケるらしく、↓のエラー。
Please try again
An error occurred during conversion. Ensure the file conforms to the requirements outlined in the user guide. If you continue to see this issue, please email writinglife@kobo.com for conversion support.
試したファイルはmobiとepub。EPUB3には対応してないので、ブログから書き出したEPUBをmobiに変換してアップしたり、いろいろ配布されてるEPUB2やmobiを上げたりしてみたけど全滅。wordファイルならうまくいくっぽい。
エラーメッセージにメールしろって書いてあるので英語できる人に頼んでメールしてみたら このガイドライン嫁って返事しかこなかった。でもこれってLibreOfficeでdocsから作る方法しか書いてないよねぇ...
というわけで解決策キボン。もしくははっきり今はできないってわかれば諦めがつくんだけど。EPUB 第21回 楽天kobo向けEPUB3コンテンツ制作説明会 * - epubcafé
EPUB2とEPUB3の違い
OPFにおける注意点
目次の作り方
組版表現Tips
固定レイアウトの礼儀
kobo向けの推奨指定
Koboにおける制約事項
EPUBファイルの検証
昨日からファイル内のmetaにシステムのバージョンが入るようになってます。
今日の修正（ver20130227.1）で改ページ用のスタイルを追加。class名などは電書協EPUB 3 制作ガイドを参考に作成。
| 指定したブロックの直後で改ページ | .pagebreak |
|---|---|
| 指定したブロックの直前で改ページ | .pagebreak-before |
| 指定したブロックの前後で改ページ | .pagebreak-both |
| 任意の場所で改ページ | hr.pagebreak |
こんな感じ。
pやdivで囲ってclass入れるとか難しいだろうなーと思って、改ページしたい場所にタグを入れるだけでいいようにhrを非表示にして改ページできるようにしてみた。hrでいいのか迷ったけどまあいいでしょ。きっと。
hrを消すのは最初display:noneでいけるかなーと思ったんだけど、
ADE（Adobe Digital Editions）ではdisplay:noneが効かない。改ページは効いてる。
Kindle Previewerでは非表示になって改ページも効く。期待通りの動作。
iBooksではhrが消えて改ページも効かない。CSS的にはこの動作が正しいのかな。
というわけでvisibility: hidden;にしてみた。指定してあるのはこんなコード。
.pagebreak {
page-break-after: always;
}
.pagebreak-before {
page-break-before: always;
}
.pagebreak-both {
page-break-before: always;
page-break-after: always;
}
hr.pagebreak {
border: 0;
height: 0;
visibility: hidden;
}
試したらvisibility:hidden、border:0、height:0どれか１つだけでも消えてくれたんだけど、まあ念のため。
