2011年09月28日

EPUB2とEPUB3でするインラインルビ作成講座、組み込みアプリにする

 EPUBではルビはそのままXHTMLにルビタグを追加すればいいが、ルビレイアウトを調整することはできない。EPUB3ではいくつかのプロパティが用意されているが、それでも一般的なルビは中付きで表示される。中付きと肩付きを使い分けるには、インラインルビを使うしかない

  一般的にはルビは中付きで、つまりセンター合わせで付けられる。しかし肩付きや両端揃えで付けることもある。EPUBでは今回のバージョンではルビレイアウトはあまり複雑にせず、ルビの指定は親文字に対してルビ位置の指定のみとなっている。ルビ文字の行揃えはプロパティにはない

 そこですべて肩付きにして表示したいと思っても、EPUBの基準では指定できない。ビューワーでそういう機能を持たせるしかない。そうすると強制的に肩付きにするには、スタイルシートで指定するしかないことになる。その方法がスタイルシートのインラインテーブルである。ルビタグにインラインテーブルを指定し、親文字とルビ文字のレイアウトをそれぞれ指定すればよい。インラインテーブルを使うと、ルビ位置を肩付きもしくは中付きに指定し、iBooksやStanzaで表示できる。

 それでは、ルビで中付きと肩付きを使い分けるケースはあるだろうか。使い分けるケースは、それほど多くないかもしれない。たとえば、段落の最初の文字にルビがあり、ルビ文字が親文字より長い場合はどうすればいいのだろうか。そのままルビ文字をXHTMLタグで中付きのままにすると、ルビ文字の先頭が段落の先頭になり、親文字が下がって表示されることになる。

110928-01.PNG
*ルビタグで指定したルビ文字長いテキスト。

 一般的にはそこまでする必要はないが、段落の最初のみをルビ文字が長い場合、肩付きにすることもある。そうすると、段落のインデントが親文字で揃うからである。

 この場合は、ルビタグにクラス指定し、スタイルシートを2つ用意すればよい。それで使い分けできる。本文のルビには中付きのスタイルシートを割り当て、段落頭の文字には左揃えを指定する。スタイルシートを使い分ければ、肩付きと中付きの使い分けは簡単である。

110928-02.PNG
*インラインテーブルで段落頭の文字のみ肩付き指定。それ以外はインラインルビで肩付き。

 EPUBについては、今のところEPUB3の行方は知れない。実質的には有料のEPUB3ビューワーが登場しても普及することはなく、iBooksやKindleビューワーがEPUB3に対応するのを待つしかない。また、EPUB3対応のiBooksやKindleが登場しても、EPUB2のビューワーがすぐになくなるわけではない。EPUB2対応のルビの肩付きと中付き使い分けノウハウはあってもいいのではないかと思うのだ。

 インラインルビにするメリットは

中付きと肩付きの使い分け

だけではない。もう1つのメリットは、インラインルビで指定すると、

InDesignのルビを流用できる

ことにある。InDesignでルビを指定し、InDesignのタグ付きテキストとして書き出し、エディタで置換するのである。そうすると、テキスト内の漢字にすべてルビが追加されていても、ルビ入力がInDesignでできてしまう。XHTMで手打ちする必要はない。InDesignの最新版は不要なのである。

 EPUBで電子書籍を配信する場合、ビューワーをある程度決め射ちしなければ
ならない。ビューワーによって表示結果が変わる可能性があるからだ。iPhoneで閲覧する場合は

iBooks

で最適化されていればいいわけだし、DRMを追加する場合も、おそらくiBooksで使うことになるだろう。あとはKindleのEPUB3対応ビューワーくらいだろう。いずれにしてもiBooksもKindleもEPUB3対応のビューワーは出現していないので、リリースされてから考えればよい。

 というわけで、いまのところ、EPUB2対応のiBooksとStanzaでしか使えないが、スタイルシートのインラインテーブルを使う方法をまとめてみた。iPhoneアプリ『InDesignからEPUBの電子書籍を作成する方法』内のコンテンツとして収録してある。なお、使いやすいように、PDF版とサンプルファイルをダウンロードできるようにした。なお、次回のアップデートでは「EPUB2とEPUB3でするインラインルビ作成講座」は課金コンテンツになるので、ダウンロードはお早めに。



◆InDesignからEPUBの電子書籍を作成する方法[iTunesプレビュー]
http://bit.ly/hoLZHS


 
ラベル:InDesign EPUB
posted by 上高地 仁 at 14:33 | Comment(0) | TrackBack(0) | Apple/Macintosh/iPhone | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック