iBooks 3.0 で縦書きでepubを表示する方法

このエントリーをはてなブックマークに追加
はてなブックマーク - iBooks 3.0 で縦書きでepubを表示する方法

追記: 2013/2/22 見開きの方向だけではなくて縦に表示する方法も書きました。

本日、MacBook Pro with Retina Display 13インチ、Mac mini, iMac, iPad 4th Generation, iPad Miniと、多くのハードウェアが発表されました。Apple – Apple Events – Apple Special Event October 2012
ソフトウェアのアップデートで、日本語の縦書きがサポートされたことも発表されました。
が、しかし、iBook Storeには、日本語の縦書きの本は見つかりませんでした。epub 3.0で対応された縦書きの方式で書き出されている必要があり、縦書きで実際に本を読むまで一苦労だったのでまとめてみました。

まず、ePubのデータを探してみました。
みんなで作るePubファイル投稿・共有サイト(ベータ) – ePubファイル (Powered by ClipBucket) ここにたくさんepubのデータがあります。試しに、銀河鉄道の夜をダウンロードしてみると、横書きのデータでした。

次に、夏目漱石の「こころ」をダウンロードしてみると、縦書きになったものの、右綴じで、ページめくりの方向が逆で変な感じです。

ウェブサイトを見てみると、こんな注釈が。

左綴じになっています。右綴じにするにはcontent.opfのにしてください。

おぅ、これを編集してあげればいい訳ですね。Macで、epubファイルをダウンロードして、拡張子を.zipに変更して、OEBPSフォルダの、content.opfを見てみると、


となっている部分があったので、これを、

に変えてあげました。そしてフォルダをzipに戻して、epubファイルに拡張子を変更して、メールでiPadに送って、iBooksで開いてあげると、ちゃんと縦書き、左とじで表示できました!

追記:2013/2/22
上の設定だけでは、見開きの方法が変わるのみです。文字を縦書きに設定するには、ファイル内の css すべてに対して、bodyに縦書き設定をしてあげることにより、縦書きが出来ました。
body {
writing-mode: vertical-rl;
-epub-writing-mode: vertical-rl;
-webkit-writing-mode: vertical-rl;
}

bodyの無いcssにはbodyを追加しました。実際すべてのcssに設定する必要があるかははっきりしないのですが、default.cssだけ設定してもうまく行かなかったので、全部設定しました。

ちょっと手順が面倒ですが、iBooksには、書籍用書体「游明朝体」と「游ゴシック体」が搭載されていて、とてもきれいな文字で本を読めそうですね。ルビなどもちゃんと表示されていました。

一つ気になったのは、ボタンを押したときに、ボタンが押された状態で止まった状態になる現象が多かったです。バックグラウンドで動いていないので、サクサク動いていない気がしました。これも iPad 4th Gen だと処理速度で改善されるのでしょうか。

Comments

comments

Powered by Facebook Comments

1件のコメント
  1. […] カタカナや数字に特徴のあるフォントのようです… 関連リンク:游明朝体ファミリーのくわしい説明  – 文字工房iBooks 3.0のリリースと日本語書体のサポート  – DTP TransitIBOOKS 3.0 で縦書きでEPUBを表示する方法 – ZERO4RACER PRO DEVELOPER’S BLOG様 http://engawa.2ch.net/test/read.cgi/apple2/1350438551/http://engawa.2ch.net/test/read.cgi/apple2/1334664544/http://anago.2ch.net/test/read.cgi/mac/1351026361/ […]

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください