メイン | 2010年08月 »

2010年07月 アーカイブ

2010年07月19日

ブログ、はじめます~自己紹介

はじめまして。アンテナハウスのブログとしては、旧・PDF 千夜一夜、社長ブログ I love software! につづく、3番目のブログです。担当は私、村上 真雄 (@MurakamiShinyu) と申します。

以下、Twitterで公開している私のプロフィールです:

  • XML/HTML+XSL/CSS 自動組版ソフト Antenna House Formatter 開発者
  • アンテナハウス取締役
  • W3C会員としてXSLとCSS3仕様に関わる
  • HTML5 IG JP共同議長
  • JEPA EPUB研究会員
  • 世界標準仕様(特にHTML+CSSとその応用のEPUB)で、まともな日本語組版を可能にしたい

このブログでは、EPUBやCSSと日本語レイアウト、XSL-FO、CSS3のこと、Antenna House Formatter のことなどを取り上げていきます。どうぞよろしくお願いします。

「EPUB や CSS と日本語レイアウト、HTML5 と電子書籍」

先日、「第8回HTML5とか勉強会」という集まりに呼んでいただき、「EPUBやCSSと日本語レイアウト、HTML5と電子書籍」というテーマで講演をしました。

そのプレゼン資料を公開しました:

この資料で、Antenna House Formatter、CSS組版の紹介と、このごろ私が関係しているEPUBとCSSの縦書きのことなど簡単にまとめています。よろしければ御覧ください。

2010年07月21日

text-align: justify で日本語テキストも両端揃えにしたい!

日本語組版ではテキストを両端揃えにするのが標準です。CSS での text-align: justify の指定がそれに相当します。

ところが、日本語のウェブサイトでほとんどその指定が使われていなくて、行末が揃わないでがたがたになっています。

text-align: justify を指定しても、ブラウザによっては日本語の文字間は調整されず、欧文スペースだけが広がってしまい、見栄えが悪くなってしまうのがひとつの理由でしょう(あるいは単に組版にこだわらないだけ)。

現在の主要なブラウザでは、Firefox (Mozilla) なら text-align: justify の指定で日本語の両端揃えがされます。Safari と Chrome (どちらもWebKit)、Opera は、欧文スペースだけが広がります。IE は、あまり知られていないのですが、text-justify: inter-ideograph という指定を同時にすると、Firefox と同様に日本語の文字間も調整されて両端揃えがされます。

さて、先日「第8回HTML5とか勉強会」で「EPUBやCSSと日本語レイアウト、HTML5と電子書籍」という話をさせてもらったのですが、その勉強会のレポート記事が技術評論社のサイトに掲載されました:

「第8回 HTML5とか勉強会」活動報告 小松健作さん

この技術評論社のサイトでは、めずらしく text-align: justify の指定がされていて、Firefox で見ると、行末がきれいに揃っているのが確認できると思います。残念ながら他のブラウザで見ると、行末が揃っていません。そしてところどころに、欧文単語間のスペースだけが大きくなっているのが目につきます。IE では、text-justify: inter-ideograph を指定するとよいはずなのですが、残念ながらその指定はされていません。

text-justify: inter-ideograph とは?

IE で実装されている text-justify プロパティは、CSS3 Text のドラフト仕様にあるものです:

CSS3 Text: Justification Method: the 'text-justify' property

このプロパティは行揃えの方法を指定するもので、値としては auto、inter-word、inter-ideograph などが選べます。inter-word が欧文単語間など調整、inter-ideograph がそれに加えて漢字や仮名の文字間も調整、そして auto は、処理系によって効率と品質のバランスにもとづいて行揃えの方法を選ぶこととされています。初期値がその auto です。IE の実装では、auto = inter-word となっているわけです(auto = inter-ideograph に修正してほしいものです)。

WebKit で日本語の両端揃えが実装されていないのは電子書籍にとって問題

Web の記事で行末の揃えなど気にする人はあまりいないかもしれません。しかし、電子書籍となるとどうでしょうか? WebKit は、iPad などの EPUB ビューア iBooks に使われています。また、WebKit を使う別の EPUB ビューアもいろいろと開発されています。そのようなビューアで、日本語の両端揃えはどうなるのでしょうか?

「HTML5とか勉強会」でグーグルの及川さんに会ったので、WebKitなんとかしてほしいと話したところ、「WebKit を改良するため contributor になるためのハードルはそんなに高くない(低くはないけど)、3ヶ月~半年がんばって取り組めば contributor として認められるので、有志がチャレンジするとよいと」アドバイスをもらいました。別のCSS組版エンジン(AH Formatter、もちろん日本語組版にも対応)を開発している私の立場ではそれはできないですが、どなたかチャレンジしてはいかがでしょうか?

2010年07月24日

EPUB仕様の日本語組版拡張案のためのメモ

6月1日に「EPUB仕様の日本語組版拡張を目指して(Version 0.8)」を試案として公開しました。

この試案の主な点は、縦書きの指定に CSS3 の writing-mode プロパティを使うことと、W3C内で議論されている margin-before/after/start/end など論理的プロパティを採用するということでした。

しかしその後、W3C での議論や、縦書き対応EPUBビューアなどを実装している側の意見を聞いて、この方針は無理があったと感じています。
(参考:「EPUB や CSS と日本語レイアウト、HTML5 と電子書籍」にも書きました)

そこで新たな試案を作成したいと思っているのですが、以下は、そのための私的メモです。

組み方向と綴じ方向の指定(OPFパッケージ文書に)

組み方向と綴じ方向の指定はCSSで指定するのではなく、OPFパッケージ文書に属性として指定するのがよいと思います。そのメリットは、未完成のCSS3仕様に依存しないこと、ビューア実装にとってはOPFにアクセスするだけで組み方向と綴じ方向が分かれば、それによりUIを変えるなどができるということです。

組み方向の指定: text-direction 属性

値:auto | ltr | rtl | ttb-rtl | ttb-ltr
デフォルト:auto
auto
ビューア側で横書きにも縦書きにもできる
ltr
左から右への横書き(英語、横書きの日本語など)
rtl
右から左への横書き(アラビア語、ヘブライ語など)
ttb-rtl
縦書き(top-to-bottom)で行は右から左(縦書きの日本語など)
ttb-ltr
縦書き(top-to-bottom)で行は左から右(モンゴル文字のモンゴル語など)

ページ綴じ方向: binding-direction 属性

値:auto | ltr | rtl
デフォルト:auto
auto
組み方向により自動的に綴じ方向が決まる
ltr
左から右へ
rtl
右から左へ

OPFのどの要素に指定?

OPFのどの要素にこれらの属性を指定するべきかは、検討が必要です。この試案で参考にしているSONY&TOPPANの案では、spine 要素に binding-direction 属性を指定するものでした。

本全体の組み方向・綴じ方向だけではなく、本の一部分だけ組み方向・綴じ方向を変える指定もできるべきです。次のいずれかの案が考えられます:

案その1: 本全体への指定は spine 要素に、本の一部への指定は spine の子要素である itemref 要素に

案その2: 本全体への指定は manifest 要素に、本の一部への指定は manifest の子要素である item 要素に

縦書きの中での部分的な横書き

縦書きの行の中で数字を縦中横にしたり、表や図のキャプションなどを横書きにする指定が必要です。次のいずれかの案が考えられます:

案その1: XHTML の dir 属性を使う。dir="ltr" または dir="rtl" が指定された要素は横書きにする。

例: 縦中横<span dir="ltr">22</span>年
<table dir="ltr">...

案その2: 縦書きの中で横書きを指定するための class 名を定義する。例えば:

例: 縦中横<span class="idpf-horizontal">22</span>年
<table class="idpf-horizontal">...

圏点

CSS3 Text ドラフトには text-emphasis プロパティがあります。しかし、この CSS3 仕様が標準となるのもまだ時間を要します。

考えられるひとつの案として、青空文庫のXHTML形式で採用されているような class 名を使うというものがあります。

参考:「青空文庫 組版案内:強調」 <em class="sesame_dot">傍点</em> <em class="white_sesame_dot">白ゴマ傍点</em> <em class="black_circle">丸傍点</em> <em class="white_circle">白丸傍点</em> <em class="black_up-pointing_triangle">黒三角傍点</em> <em class="white_up-pointing_triangle">白三角傍点</em> <em class="bullseye">二重丸傍点</em> <em class="fisheye">蛇の目傍点</em> この青空文庫形式を参考に、IDPF EPUB 用に class="idpf-emphasis-sesame-dot" などとするとよいかもしれません。

続きを読む "EPUB仕様の日本語組版拡張案のためのメモ" »

About 2010年07月

2010年07月にブログ「CSS組版ブログ」に投稿されたすべてのエントリーです。過去のものから新しいものへ順番に並んでいます。

次のアーカイブは2010年08月です。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

Twitter