本文へ


EPUB2の電子書籍広報とよなかをEPUB3にしてみました!

  • 2014/04/19 13:18 JST

イーパ部EPUB2の電子書籍「広報とよなか」を作成した時からEPUB3形式で電子書籍を作成したいと思っていたので、EPUB2の電子書籍「広報とよなか」をEPUB3形式にしてみました

修正作業について

まずは、EPUB2とEPUB3の違いを覚えるのに|| EPUB2をEPUB3対応にする ||を読み修正を試みたのですがうまくいかないところがあったので、EPUB Publications 3.0EBPAJ 日本電子書籍出版社協会の「電書協EPUB3 制作ガイドver.1.1.2」を読んでから再修正をしたところEPUB3形式に修正する事が出来ました。今回の修正でtoc.ncxがnavigation-documents.xhtmlに変更された事によって、ナビゲーションページが追加されました。

その他修正した点は下記の通りになります。

  • EPUB内のファイルを整理しました。(xhtmlファイルは、xhtmlフォルダの中にまとめた)
  • EPUB2の作業時、CSSがうまく反映されなかった為しかたなくHTMLにテキストを追加していた部分があったので、その部分はCSSで設定していらないテキストは削除したので、少しですが前よりコードが綺麗になりました。
  • ファイルの軽量化を図り、すべての画像を劣化なしで圧縮して全体のファイルの軽量化を図ったところ、EPUB2―6.40MB からEPUB3―2.35MBになりました。

EPUB3の電子書籍としてのデザインについて

デザインは(視覚的には)初めEPUB2と変わりない状態で作成したのですが、グラフィックデザイナーの@ako_yさんに「見る側に大きな違いがあるのであれば、知りたかったりしますが、そのままのデザインをEPUB3形式にするメリットは?」との意見をいただき「そうかぁ。私は、デザインはそのままでバージョンアップさせる事に意義を見出していたけど、電子書籍の場合EPUB3でないと見れないビュアーが現状あるわけではなく、EPUB3になったから逆にこんな風に紙媒体に近づけてデザイン出来るよというところがないと広報誌を見る人には面白みがないのかぁ。私は、EPUBを作成する側にたってしか物事を見てなかった。」と気づき対応可能なCSS3を使用し作成するよう再考してみました。

EPUB3になったからと言ってCSS3がうまく表示してくれる事があまりなかったという事もあり、角をすべて丸角にし、写真にはフレームを付けたように変更するくらいしか出来ませんでしたが、全体的に柔らかいイメージになったと思います。後、赤字の箇所で背景色とのコントラスト比が足りない箇所があったので文字色の調整もしました。

EPUBコンテナを作成

EPUB圧縮ツールは以前使った「ePubPack」というツールではうまくいかなかったので、「EPUB圧縮ツール: すべて夢のように」のEPUB圧縮ツールを使用させてもらいました。こちらの方が簡単で早く圧縮出来ました。

修正した後の確認作業

EPUB2を作成した時と同じく、EPUBビューアで表示する前にEPUB Validator (beta)で完成したEPUBコンテナのバリデートしてエラーがないか確認してからEPUBビュアーで確認しました。

確認は、Adobe Digital Editions(CSS3に未対応)、FirefoxのアドオンEPUBReader、iPad&iPod touchのiBooks、AndroidのHimawariでしています。


iPad iBooksのキャプチャ画像です。

  
iPod touchのiBooksのキャプチャ画像です。    Android Himawariのキャプチャ画像です。

EPUB2形式をEPUB3形式にして苦労した点

EPUBビュアーで見るとEPUB2の時と同じくCSSが意図したとおりに反映されないので、崩れた表示からどう直せばいいか推測してCSSを修正→EPUBパッケージングして確認→また修正のループ作業で、予想以上に手間がかかりました。当然かもしれませんが、Adobe Digital Editionsとibooksでは表示の仕方が違うのでその点においても確認→修正作業が発生し余計に修正時間がかかりました。

EPUB3になったらCSS3も一部使えるという事もあり期待してたのですが、手間のかかり方はEPUB2とほとんど変わりないと感じてます。

EPUB3の電子書籍「広報とよなか」のダウンロードについて

EPUB3の電子書籍「広報とよなか」のダウンロードはこちらから出来ますので、ぜひ読んでみてください。