‘未分類’ カテゴリーのアーカイブ

「300ppiのweb用画像」に対応する

2013/11/20

 先日、株式会社KADOKAWAから「KADOKAWA-EPUB 制作仕様」の発表がありました。これはKADOKAWAが電書協ガイドをベースに社内で使用するために規定した仕様を一般公開したもので、頼りにできる製作指針がまだ完全に定まったとは言い難い現在、とても有り難い話で、率直に大英断だったと思います。
 今現在これをきっちり読み込んで電書協ガイドとの差分を調べて必要なら修正する作業をしているわけですが、一ヵ所「?」と思った部分がありました。それは画像の仕様が「画像の解像度は、外字画像含め、すべて300pixel/inch とする」となっていた箇所です。

 「pixel/inch」(ppi)という単位はDTP系の人間にとってはなじみ深いもので、dpiとも言われます。1インチあたりに何ピクセルの画素を割り当てるかで画像の精細さを表す単位です。ただこれはWeb系ではほとんど使われないのではないかと思います。何故かと言えば、これがあくまで印刷を前提とした場合に意味がある単位だからです。画面サイズとピクセル数が比例していないPCディスプレイやタブレット端末を表現の舞台とするWebや電子書籍では、この「pixel/inch」という単位はほとんど意味を持ちません。
 正直事情通の方にお聞きしてもなぜ電子書籍なのに画像を「300ppi」にする必要があるのか「?」が消えなかったのですが、仕様書にあるからには対応しなければなりません。以下、その対応方法です。

Photoshopから書き出すと強制的に72ppiになる

Photoshopで解像度を300ppiに

Photoshopで解像度を300ppiに

 最初に、Photoshop内で解像度を300ppiに変更してから「Webおよびデバイス用に保存」で書き出してみました。解像度を変える際には「画像の再サンプル」のチェックボックスを外してやらないとピクセル数そのものが書き換わってしまいますので、これのチェックを外した上で解像度を300ppiに変えてやります。

Photoshopで開くと72ppiになっている

Photoshopで開くと72ppiになっている

 その後、「ファイル」メニューから「Webおよびデバイス用に保存」を選び、Web用画像として書き出してやります。で、書き出された画像を再びPhotoshopで開いて見てみると・・・あれ、72ppiになってしまってますね。

ImageMagickで画像解像度を後から書き換える

 困りました。つまりAdobeとしては「Web用の画像は印刷の対象ではないのだから全部72ppiで問題ない」と判断しているわけです。通常の保存コマンドでjpgやpngを選べばもちろん解像度の設定は保持されるのですが、これをやってしまうとファイルサイズが大幅に肥大化するので電子書籍用の画像としては避けたいところです。
 そこで、Photoshopで一度書き出した画像の解像度設定をフリーのコマンドラインツールのImageMagickで書き換える方向を試してみました(ImageMagickのMac用インストーラはこちら)。ここなどを参考にさせていただいています。

/opt/ImageMagick/bin/mogrify -density 300×300 -units PixelsPerInch 置換対象ファイルのパス

 置換して上書きなので「mogrify」コマンドを使っています。「-units PixelsPerInch」が単位指定です。ImageMagickのインストールパスは適宜お手元の環境のものに置き換えてください。ターミナルにこれを入力し、リターンで置換されます。

300ppiになっている

300ppiになっている

 Photoshopで開いて見てみると確かに300ppiになっているようです。OKですね。あとはこれを組み込むだけです。

(2013.11.21)

epubcheckの日本語文字化け対策

2013/10/28

 以前、このブログで発表して現在配布中の「EPUB3トータルデータチェッカー」なのですが、どうも日本語のパス名が化けて表示されるようで少々気になっていました。エラーメッセージ自体は英語ですのでそこまでの問題ではないのですが、JEPAがepubcheckの日本語化バージョンを発表したなどというニュースもありましたし、これが標準になってくるとエラーメッセージそのものが文字化けして読めないというような事態になってきます。これでは少々寝覚めが悪いのも確かですのでちょっと調べてみました。

.bash_profileを書き換えてみたけれど・・・

 「java mac 文字化け」などで検索すると、事例がそれこそ星の数ほど引っかかるのですが、要はjavaの内部処理コードのデフォルトがShift_JISなため、そのままでUTF-8環境に書き出すと日本語部分が文字化けしてしまうということのようです。「ターミナルの文字コードをShift_JISに設定すれば化けない」なんて情報もあったのですが、そこは諸般の事情で変えたくないので却下です。で、このあたりこのあたりの情報をもとにまずは.bash_profileに設定を追記してみました。

 まずはターミナルを立ち上げて以下のコマンドを入力し、.bash_profileを編集できるようにします。

cd ~
vi .bash_profile

viが立ち上がったら、iキーを入力して挿入モードにし、以下のコマンドを入力します。

alias javac=’javac -J-Dfile.encoding=UTF-8′
alias java=’java -Dfile.encoding=UTF-8′

.bash_profileを編集 コマンドを入力し終えたらESCキーを押して「:wq」を入力してファイルを閉じます。viとか普段使わないのでこことかでコマンド調べながらの作業です。

 これでターミナルを再起動し、

-java -jar epubcheckのパス epubファイルのパス

 などと打ち込めば、例えパスに日本語が含まれていても正しくチェック結果が表示されるはずです。

ターミナル出力結果が文字化けせずに表示された 実際試してみると、確かに正しく表示されました。

 ただ、この方法だと(まあbashの設定を変えただけなので当たり前なんですが)ログ出力したテキストファイルにまでは効力が及ばないようで、相変わらずログテキスト内では文字が化けてしまっています。

「export _JAVA_OPTIONS=-Dfile.encoding=UTF-8;」を追記して文字化け解消

ログファイルが文字化けせずに出力された そこで、ここの情報をもとに、「-java -jar epubcheckのパス epubファイルのパス」の前に「export _JAVA_OPTIONS=-Dfile.encoding=UTF-8;」を追記してみました。
 つまりjavaを実行する前に出力文字コードをUTF-8にするオプションを連続実行するようにしてみたわけです。

 はい、ちゃんと日本語になってくれました。

改訂済の「EPUB3トータルデータチェッカー 1.2.1」こちらからダウンロードしていただけます。

 なお、今回はJEPAの日本語化バージョンの元バージョンが「3.0」(英語最新版は3.0.1)であることから、内包するepubcheckのパッケージを差し替えることは見送りました。従いまして、エラーメッセージ自体は従来通り欧文で表示されます。将来的に日本語化バージョンがバージョンアップした場合には、適宜差し替えを考えております。

 epubcheckのエラーメッセージの内容につきましてはここが参考になります。
 なお、こちらのTIPSやアプリケーションを利用された結果生じた損害につきまして私は一切の責任は負いかねますので、あくまで自己責任にてご利用ください。

(2013.10.29)

iBooksの画像サイズ指定を試してみた

2013/09/30

 このブログに掲載中の記事「ビューア別EPUB表示テスト」の、iBooksの画像サイズ指定につきまして、台湾WandererのBobbyさんより、エリザベス・カストロさんのブログにiBooksの画像サイズ指定に関しての記事が載っているとのご指摘をいただきました。この件につきましては、先日のJEPAの林拓也さんのセミナー「Appleの電子出版:iBookstoreとiBooks Author」でも少し触れられておりましたので、ちょっとテストをしてみました。

指定CSSプロパティが1つの場合のサイズ指定はOK

 該当記事ではInDesignからのEPUB3作成について書かれていますが、私は今回そちらのワークフローは採らず、電書協ガイドのEPUBにこのメソッドが適用できるかどうかについてテストをしました。
 記事によるとイメージの画像サイズを指定するためには、OPFにサイズ指定のためのCSS指定プロパティを記述する必要があるとのことのようですので、これに従って記述を追加しました。

 まずはOPF文書内、<package>文のprefixに名前空間ibooksを解釈するための追記を行います。これは「ビューア別EPUB表示テスト」のフォント埋め込みの記事でも書きましたが、iBooksでAppleの独自プロパティを適用するためには、こちらの記述が必須となるようです。

<package xmlns=”http://www.idpf.org/2007/opf” version=”3.0″ xml:lang=”ja” unique-identifier=”unique-id”
prefix=”ebpaj: http://www.ebpaj.jp/
ibooks: http://vocabulary.itunes.apple.com/rdf/ibooks/vocabulary-extensions-1.0/
“>

 次に同じくOPF文書内の<metadata>セクションにサイズ指定のためのCSSを記述しました。

<meta property=”ibooks:respect-image-size-class”>width-010per</meta>

 これで画像サイズが画面の横幅の10%になるようなら成功です。

横幅10%指定

 なっているようです。成功です。

サイズ指定できるのはプロパティ1つだけ

 では、同じ画像を2点並べて、それぞれ横幅10%、20%で表示させてみたいと思います。
 OPFに以下の形でサイズ指定のためのCSSを連記します。

<meta property=”ibooks:respect-image-size-class”>width-010per</meta>
<meta property=”ibooks:respect-image-size-class”>width-020per</meta>

 これを表示させてみますと
幅10%、20%をそれぞれ指定

 後から指定した部分だけしかサイズ指定が有効になっていません。電書協ガイドではサイズ指定用のCSSがかなりの数規定されていますので、これではちょっと使い物になりません。

ところが・・・

 最後に、ダメでもともとと思ってひとつの指定文の中にスペースで区切ってプロパティを連記してみました。

<meta property=”ibooks:respect-image-size-class”>width-010per width-020per</meta>

 これを画面表示してみますと
何故かOPFで指定していないプロパティまで・・・

 見事に両方の画像のサイズが指定サイズで表示されています! ・・・ただ、OPFのmeta文で指定していないCSSプロパティまで指定サイズで表示されているんですよね。これは何を意味するんでしょうか。ちょっと私には分かりません。

 現時点(iBooks3.1.3(1929)/iOS7.0.2)でiBooksでの画像サイズ指定の方法としては使えるのは間違いないのですが、正直バグに近い挙動ではないかと思われるので、次回のアプリのアップデートで修正される可能性を否定できません。利用される方はくれぐれも自己責任でお願いします。

 なお、iBooksで画像の横幅サイズを指定する「通常の」方法としては、画像の外側に<div>タグ等でボックスを作り、ボックスに対してサイズを指定するという方法があります。iBooks専用にEPUB3コンテンツを制作するのであれば、2013年9月現在、そちらが無難な方法かと思います。ただ、Kindle、Kobo、Kinoppyなど他のビューアと共通のEPUB3ファイルで同一に近い表示を実現するためには、iBooksでもimageタグへのサイズ指定ができるようになるのが望ましいのは間違いありません。複数のビューアに対してXHTMLソースレベルで調整が必要になるのは制作サイドへの負荷が大きく、早い段階での正式な対応を望みたく思います。

(2013.9.30)

プロフィール
Jun Tajima

こちらにて、電子書籍&Web制作を担当しています。
このブログは、EPUB3をはじめとした電子書籍制作担当オペレータからの、「電子書籍の制作時にたとえばこんな問題が出てきていますよ」的な「現地レポート」です。少しでも早い段階で快適な電子書籍閲覧・制作環境が整うことを願って、現場からの声を発信していこうと目論んでおります。

当ブログ内の記事・資料は、私の所属しております組織の許諾を得て掲載していますが、内容は私個人の見解に基づくものであり、所属する組織の見解を代表するものではありません。また、本ブログの情報・ツールを利用したことにより、直接的あるいは間接的に損害や債務が発生した場合でも、私および私の所属する組織は一切の責任を負いかねます。