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

アンテナハウス
村上真雄
@MurakamiShinyu

2010-07-14

村上真雄 (@MurakamiShinyu) 自己紹介

Twitterで公開しているプロフィール：

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

Antenna House Formatter

1999年、当時W3Cドラフトだった XSL (Extensible Stylesheet Language) 仕様をサポートする組版ソフト XSL Formatter 開発を企画
XSL は XML の変換を行う XSLT 仕様とレイアウトを表現する XSL-FO (Formatting Objects) 仕様からなる
XSLT はブラウザにも組み込まれていて、XML→HTMLの変換などに使われているけど、XSL-FO は知らない人が多いかな
XSL Formatter は、多言語の大量のXMLデータからの自動組版などで威力を発揮して、けっこう世界で使われています
XSL仕様に関わるため、W3Cメンバーになりました。
CSS3 も研究、W3C CSSWG にも参加。2009年、AH Formatter V5 より、CSS 組版にも対応

CSS 組版とは

(X)HTML+CSS を紙の本のための組版にも（PDF出力、印刷）
ブラウザの印刷・印刷プレビューでのページ出力を、高機能・高品質にしたようなもの
CSS3 対応
- CSS3 Paged Media：ページ媒体向けのCSS仕様。ページサイズやページヘッダー／フッター領域（margin box）の定義など
- CSS3 Generated Contents for Paged Media：ページ媒体向けの高度な機能。柱、脚注、相互参照、フロートの拡張等
- CSS3 Text：日本語組版にも関係する、約やく物もの（句読点や括弧類）の配置処理、禁則処理、行揃え、傍•点•など
- CSS3 Text Layout：writing-mode 関係、縦書きなど
- CSS3 Multi-column、CSS3 Backgrounds and Borders、CSS3 Lists、など

CSS 組版ができるソフトウェア

Prince XML：オーストラリアのYesLogic社の製品。CSSの提唱者で Opera CTO のホーコン・リー(Håkon Wium Lie)氏がYesLogic社の役員として関わっている。
PDFreactor：ドイツRealObjects社の製品
Copper PDF：日本のGNN社の製品。オンデマンド印刷・製本・書籍化サービス「ブログ出版局」
Antenna House Formatter：日本のアンテナハウス社の製品。多言語対応、CSS3対応、CSS3縦書きなど日本語組版への取り組み

EPUB

IDPF (International Digital Publishing Forum) が策定する電子書籍フォーマット
EPUB の中身は XHTML+CSS（Webと一緒）。それに目次データとメタデータを合わせてZIPでパッケージにしたもの
iPad の標準のEPUBビューア iBooks は WebKit を使っている
EPUB2.0（現バージョン）は2007年の勧告。次期バージョンEPUB2.1（仮）の勧告は来年5月の予定
EPUB2.0（より正確には、そのコンテンツの仕様 Open Publication Structure (OPS) 2.0）は、XHTML1.1とCSS2のサブセットを使う。使えるCSSプロパティが規定されている。CSS2なので縦書きは…
しかしEPUBビューアによっては、CSSがまったく使えないものもあれば、CSS3も使えるものもある

EPUB日本語組版要求

2009年11月、JEPA（日本電子出版協会）EPUB研究会、発足
技術主任：村田真――W3C XML仕様策定に関わった標準化の第一人者、ISO/IEC SC34（文書の記述と処理の言語）標準化委員
JEPA が IDPF の会員に
2010年4月、EPUB日本語組版要求仕様案を発表、IDPFの次期EPUB仕様策定の課題リストにも組み込まれる
- 縦書き関連
- 禁則処理
- ルビruby
- 圏けん点てん（傍◉点◉）
村上は JEPA EPUB研究会に4月より参加
JEPA EPUBメーリングリストあります：http://bizpal.jp/epub/

W3C日本語組版タスクフォース（JLTF: Japanese Layout Taskforce）

JIS X4051「日本語文書の組版方法」は日本語組版を知らないと難解
W3Cメンバーであるジャストシステムやアンテナハウス、およびJAGAT（日本印刷技術協会）や日本国内の有志が、W3C の CSS、SVG、XSL-FOなどレイアウト関連規格に「日本語組版」を反映する活動をおこないたいとW3Cに提案
2007年、W3Cの正式な活動として「日本語組版タスクフォース（JLTF: Japanese Layout Taskforce）」が発足
JIS X4051策定に関わった組版専門家が中心
2009年W3C技術ノート「日本語組版処理の要件」公開
EPUB日本語組版要求は、その成果を利用

W3C HTML5 Japanese Interest Group (HTML5 JP IG)

HTML5や関連する仕様について日本語で議論をするグループ（W3C公開メーリングリスト）
W3C会員でなくても、だれでも参加できます。
2009年11月に開設。議長はミツエーリンクス矢倉さん
日本語レイアウトなどCSS3の議論もしようと提案したところ、村上が共同議長に。CSSWGなどへフィードバックする役割
HTML5 JP IGのサイト：http://www.w3.org/html/ig/jp/wiki/

HTML5 と電子書籍

将来のEPUBはHTML5を採用するだろう
構造化要素のメリット、リッチメディア、動く電子書籍が可能に――IDPF内で議論中
HTML5 (WebKit)を使ったEPUBビューアなどがすでに開発されている
EPUBとは別に、HTML5による電子書籍・電子雑誌の動きも――次世代の出版コンテンツ、カギを握る「HTML5」

CSS3 writing-mode 縦書き

writing-mode プロパティによる縦書きは、マイクロソフトがIE5.5から実装済み
次期EPUBにwriting-modeプロパティの採用を求めることを考えた
CSS3 Text Layoutドラフトでは、writing-mode は次のように分解されるショートハンド
- writing-mode: lr-tb → direction: ltr; block-flow: tb
- writing-mode: rl-tb → direction: rtl; block-flow: tb
- writing-mode: tb-rl → direction: ltr; block-flow: rl

縦書きのときの方向指定問題

縦書きで margin-left は「左」、それとも「上」？
CSS標準では margin-left は縦書きでも「左」と決定済み。
IEの縦書きもそうなっている。
縦書きコンテンツでは字下げに margin-top を指定することになる
しかし横書きにしか対応しないビューアでそれを見ると、レイアウトが崩れることに

論理的プロパティの議論

margin-before/after/start/end など、W3C内で以前から議論があったもの。物理的な方向 top/bottom/left/right の代わりに論理的に：
- before = ブロックの前側
- after = ブロックの後側
- start = 行頭側
- end = 行末側
Mozilla、WebKitで -moz-margin-start、-webkit-margin-start などは実装済み（RTL対応のため）
CSS3 Text Layout (editor's draft)に定義を書く
しかし、W3C CSSWG内で反対も
- プロパティが増えるのは実装に負担
- 物理的プロパティに変換して扱うにもカスケード処理が複雑に

「EPUB仕様の日本語組版拡張を目指して」

2010年6月1日、JEPA EPUB研究会(村上・村田)ドラフトVer0.8公開
- 標準化戦略
- 縦書きと横書き：CSS3 writing-mode プロパティによる
- 縦書きと横書きに共通のスタイル指定：論理的プロパティの採用を提案
- ルビ：HTML5 ruby
- 圏点：CSS3 text-emphasis プロパティ
- メタデータにおける読み
- 組版処理の推奨事項
しかし、次期EPUB仕様に未完成のCSS3プロパティを入れるのは難しい

縦書きEPUB/HTML+CSS実装が続々と登場

通常は横書きのHTML+CSSを、ビューア側で縦書きにして表示する方式が主流に
その場合、margin-left は「上」マージンとなる。
CSS標準と合わないガラパゴス化の危機
それなら、それをCSS3縦書き標準に取り入れればよい！

EPUB縦書き標準化の方針の転換

次期EPUB仕様に、未完成のCSS3縦書き仕様を含めることはできないだろう
CSS3 の writing-mode プロパティは当面 EPUB 仕様に入れない
EPUBのコンテンツ（XHTML+CSS）では縦書きの指定をせず、ビューア側で縦書きに変えて表示することとする。margin-left は「上」を指す
これが将来のCSS3縦書き標準と矛盾しないように、同じことがCSSでも可能になる論理的方向モードをCSS仕様に入れよう
（これは今のところ村上の個人見解であり、IDPF EPUB 改定作業部会での議論が今後どうなるかはまだわかりません）

論理的方向モードの議論

directional-mode: logical で縦書きのとき left が上を指す。
W3C www-style ML でのIshii Koji氏から提案が元
directional-mode プロパティの定義：

Name: directional-mode

Value: physical | logical

Initial: physical

Applies to: all elements

Inherited: yes
block-flow: rl (右縦書き）の場合：

logical physical

left top

right bottom

top right

bottom left

width height

height width

logical	physical
left	top
right	bottom
top	right
bottom	left
width	height
height	width

論理的方向モードの使用例

/* 縦書き用基本スタイルシート */
:root { /* 文書全体を縦書きに */
  block-flow: rl;
  directional-mode: logical;
}
img {
  /* 画像については物理座標を使いたい */
  directional-mode: physical;
}

/* 個別CSSサンプル */
blockquote {
  margin: 0;
  margin-left: 2em; /* 横書きでは左、縦書きでは上を空ける */
}
img.one { width: 30px; height: 20px; } /* 画像は縦書きでもwidthが横幅 */

将来のCSS3縦書きで使えるように、CSS3 Text Layout に入れたい
現在の縦書きビューアには、縦書き用基本スタイルシートが備わっているとみなせば、将来のCSS3縦書きと互換性があることになる

IDPF EPUB Revision

次期EPUB仕様策定
EPUB 2.1 WG Charterに日本語組版要求も
HTML5 を取り入れることの検討もはじまる
2010年内にドラフト仕様完成、2011年5月に最終仕様勧告予定
EGLS (Enhanced Global Language Support) sub-group
- 村田真がコーディネーターに
- 8月はじめに札幌ミーティング開催、日中韓・台湾から参加予定。村上も参加します
EPUB Revision サイト：http://code.google.com/p/epub-revision/

Name:	directional-mode
Value:	physical \| logical
Initial:	physical
Applies to:	all elements
Inherited:	yes

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

村上 真雄 (@MurakamiShinyu) 自己紹介

Antenna House Formatter

CSS 組版とは

CSS 組版ができるソフトウェア

EPUB

EPUB日本語組版要求

W3C日本語組版タスクフォース（JLTF: Japanese Layout Taskforce）

W3C HTML5 Japanese Interest Group (HTML5 JP IG)

HTML5 と電子書籍

CSS3 writing-mode 縦書き

縦書きのときの方向指定問題

論理的プロパティの議論

「EPUB仕様の日本語組版拡張を目指して」

縦書きEPUB/HTML+CSS実装が続々と登場

EPUB縦書き標準化の方針の転換

論理的方向モードの議論

論理的方向モードの使用例

IDPF EPUB Revision

ありがとうございました

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

村上真雄 (@MurakamiShinyu) 自己紹介