関連資料

• 10月22日「縦組み時の文字の向き―その理論とマークアップ方法」の発表資料（CAS-UBブログ）
  • プレゼン資料(PDF)
• UTR50 draft 7
• CSS3 Writing Modes
• 前回記事「koboのEPUB3縦書きをためしてみた」
• ツイッターまとめ「UTR#50（Unicodeの縦書きの文字の向き）の話題 #UTR50」

「縦組み時の文字の向き―その理論とマークアップ方法」(PDF)は、SVO（英数字を正立、CSS3のtext-orientation:upright）を基本としてMVO（英数字を横倒し、CSS3のtext-orientation:mixed-right）を部分的に使用する文書マークアップ方法を提唱しています。その「マークアップ私案」より引用：

• SVO、MVOは縦組みの文字スタイルの一種である
  • 文書スタイル毎にフレキシブルな指定を可能にすべき
  • 文字コードの単一規格としてはなじまない
• SVOは横書きテキスト原稿の縦組みに相性が良い
  • SVOは自動縦中横とも相性が良い。
• MVOテキストで全角文字コードを使う方式は縦組み専用
  • 自動縦中横も相性が悪い。文書のルートに設定するのは非推奨。
• UTR#50でMVOをデフォルト規定すると、WebやEPUBの縦組みマークアップはかなり不便になるだろう
• SVOとMVO協調方式が良い
  • ルートSVO→ノード（ブロック）MVO→区間（スパン）MVO

しかし残念なことに、UTR50最新(draft 7)では、SVOが削除されて、CSS3のtext-orientation:uprightは、“forced upright”（強制正立）ということに変更されました（そのW3C CSSWGの議事録）。

text-orientation:uprightの問題（UTR50 SVO廃止、“forced upright”へ）

括弧類、ハイフンやダッシュ類などは、縦書きで向きを変えないと役に立ちません。すべて正立にする“forced upright”は問題です（図1）。

“forced upright”といっても、実はフォント依存で必ずしも正立にならない文字があるのにも注意が必要です。和文フォントでは和文用・全角幅の括弧類や全角ダッシュなどには回転した形の縦書き字形があるのでそれが有効になります。困るのは、矢印類（上↑など）がuprightの指定で正立させたくてもフォントによっては正立にならないということです（図2）。この仕様のままでは、矢印類を正立にするには、uprightの指定ではなくて、縦中横の指定を使わなくてはなりません。

text-orientation:uprightを役に立つものにするためには、SVOのデータが必要です。つまり、SVO=Rの文字（括弧類、ダッシュ類など）は横倒しとし、SVO=Uの文字（矢印類も含まれる）は必ず正立の字形が使われるようにすることです。

text-orientation:mixed-rightの問題（UTR50 MVO）

‘シングルクオート’と“ダブルクオート”：UTR50 MVOのデータではシングルクオート(U+2018/2019)はT（変形可で正立）、ダブルクオート(U+201C/201D)はR（横倒し）です。両方とも横倒しにする意見とダブルクオートを正立にする意見とで議論があります（図3）。

“ダブルクオート”は日本語の縦書きでは一般に使わないことになってます。広告の見出しなどに変形した形で使われることがありますが、標準とはいえません。通常は“ダブルクオート”ではなくて〝ダブルミニュート〟が使われます。したがって横倒しの欧文でしかダブルクオートは使用されないことになるので横倒しとするのが適切であると思います。

双柱 ‖ (U+2016)が正立と決められても、たいていの和文フォントでその縦書き字形が回転したものになっているため仕様と合わない結果になります。欧文フォントが選択されたら正立して、和文フォントが選択されたら横倒しになるというのでは混乱します。

波線 〰 (WAVY DASH U+3030)が正立になってしまう問題については、前回記事で書いたとおりです。

ラテン、ギリシャ、キリルなどアルファベット類(Letter)は横倒しという方針なのに、Unicodeの Letterlike Symbols ブロックにあるLetterが正立（同ブロックにあるMath Symbol系は横倒し、またMathematical Alphanumeric Symbolsブロックの同種の文字も横倒しなのに）というのは整合性に欠けます。同じ種類に見える文字の向きがばらばらになってしまうというのは、問題です（図4）。

そのほか、以前にも議論を紹介してますが、一部の記号類で横倒しとするか正立とするか意見が別れています。©®℗℠™‰‱§¶†‡⁂⁑などです。英数字や欧文用の約物・記号類を横倒しとするMVOではそれらの記号類も横倒しのほうがより自然であり、基本的にすべて正立（英数字も和字扱い）のSVOと使い分ける上で有利と思われます。しかし、SVOではなくてMVOを日本語縦書きのための標準とするUTR50の現ドラフト仕様の考えでは、これらは正立ということのようです。

記号類をひとつひとつ吟味してデフォルトの向き(MVO)を決めるのは難しいから、大雑把にまとめて決めざるを得ないということはあるでしょう。矢印類すべて横倒しというのは、各矢印記号の実際の標準的な使われ方と必ずしも合っていなくて、上向き↑や右肩上がり↗は縦書きで正立させたいことが多いでしょう。一方、三角形類はみな正立とされてますが、上向き三角形▲はそれがよくても、左右方向を指す三角形（◀や▶）は横倒しにしたいことが多いでしょう。しかし記号の種類毎に決めざるをえないため、それで仕方がないかもしれません。意見が別れている記号類も、どこかで線を引いて決める必要があると思います。できるだけ利用者みんなが納得できて、混乱が生じないような仕様になることを願います。

Tweet

前回記事ではUTR50（Unicode縦書きの文字の向き仕様）の議論を紹介しましたが、UTR50が何に使われるかというと、まずCSSの縦書き仕様（CSS3 Writing Modes）であり、それを使っているEPUB3の縦書き実装です。そこで最新のEPUB3対応リーダー（とくにkobo Touch）で縦書きの文字の向きがどうなっているか、ためしてみました。

縦書きでの文字の方向をテストするEPUB3サンプルを作りました。

• EpubTextOrientation.kepub.epub: いくつかの文字について-epub-text-orientation対応をテスト
• UnicodeVertical2.kepub.epub: Unicode全体について縦書きの文字の向きmvoとsvoをテスト

次の画像は、サンプルEpubTextOrientation.kepub.epubをkoboで表示したものとiPadのiBooksで表示したものです。

koboのEPUB3リーダーもiPadのiBooksも、レンダリングエンジンはWebKitがベースです。しかし、koboのほうは縦書きの文字の向きについて手が加えられているようで、iBooksとはだいぶ違います。

気になるダブルクオートの向き

text-orientationがデフォルトの場合がUTR50のMVO (Mixed Vertical Orientation)に相当します。koboでの結果でまず目に付くのが “I’m” のダブルクオート(U+201C/201D)が正立していることです。英語を囲んでいるのにダブルクオート正立はかなり不自然です。それに日本語でもこれでは使えないことは先日ツイートしたとおり：#UTR50 koboの縦書きではdouble quotes “ ” が正立してこんなことに！　ノノカギ〝 〟を使えばよいのに。欧文にも和文にも役に立たないダブルクオート正立。（サンプル：青空文庫『愚人の毒』小酒井不木）

text-orientation: uprightでは括弧()も正立!?

text-orientation: uprightの指定は、UTR50のSVO (Stacked Vertical Orientation)に相当するはずです。しかし、いまのWebKitの縦書き実装の制限らしくkoboでもiBooksでも括弧類やダッシュなどSVO=Rである文字でも正立にしてしまうようです。そして、正立した幅の狭い文字は、行の中で左に寄せられて配置されてます。

text-orientation: uprightでの矢印の向きはとても問題では？

MVOの場合、矢印類はR（90度回転）です。したがって上矢印↑は右向きに、右矢印→は下向きに、右上矢印↗は右下を向きます。これに対してSVO (text-orientation: upright)の場合、UTR50現ドラフトではSVO=U（正立）なので、iBooksの結果のほうが正しいように思えるのですが、しかしCSS3 Writing Modesドラフトのここによるとは、SVO=Uであっても縦書き用字形があればそれを適用するということになっています。その結果、矢印類のうち縦書き用字形（vert）が回転したものになっているもの（↑→など）は回転した結果になりMVOと見た目は同じに、それ以外（斜め方向の↗など）は正立ということになります。問題は、縦書き用字形の有無はフォントによるため、選択されるフォントによって矢印の向きが変わってしまうということです。上矢印↑を縦書きでも上を向くようにとuprightの指定をしても、環境によって上を向いたり右を向いたり方向が決まらないということです。これはUTR50よりもCSS3 Writing Modesの問題かと思います。

WAVY DASH〰〰が正立になってしまう問題

WAVY DASH (U+3030)は「キャ〰〰」のように使われるものなので、縦書きで正立ではまずいです。UTR50ドラフトでは、SVO=MVO=Tr （縦書き用字形を使用、もしくは回転）とされています。しかし、koboでもiBooksでも結果は正立です。理由は、CSS3 Writing ModesドラフトではUTR50のTrもUも区別しないでTu（縦書き用字形があれば使用して正立）と同じに扱うためです。そして多くのフォントではWAVY DASH (U+3030)に縦書き用字形はありません。その結果、ただ正立になってしまいます。

-epub-text-orientation: sidewaysという指定はEPUB 3.0仕様に合ってる？

koboのEPUB3縦書きでは、-epub-text-orientation: sideways（あるいは sideways-right）の指定により、日本語の文字も含め横倒しにできます。気になったことは、それは EPUB 3.0 の仕様と合っていないのではないかということです。

EPUB 3.0 の CSS Profile の CSS Writing Modes のところを見ると、-epub- プレフィックスを付けて CSS3 Writing Modesドラフトの2011-04-28版のプロパティ名と構文を使うこととあります。このドラフトでは、text-orientationの値は sideways- ではなくて rotate- でした。だから EPUB 3.0 で、縦書きでの全文字横倒しを指定するのは -epub-text-orientation: rotate-right のはずです。しかし、koboでは、rotate-right は効果がなくて、現在のCSS3 Writing Modesドラフトでの値である sideways-right や sideways が採用されているようです。

Tweet

cassupportの日記の次のエントリーのとおり、EPUB3.0仕様は進んでいます（今夏遅くに最終の勧告仕様とのこと）：

• 5月23日　EPUB3.0のProposed Specificationが公開されました

「CSS組版」に関係するところは、EPUB Content Documents 3.0 の 3 EPUB Style Sheets です。EPUB3.0で使えることになる CSS のプロパティについて書かれています。
CSS3 Text と Writing Modes については、まだドラフト仕様であるということで、プロパティ名に -epub- プレフィックスを付けたものがEPUB3.0で採用されることになりました。例えば、圏点を付けるプロパティは -epub-text-emphasis、縦書き／横書きの指定は -epub-writing-mode、縦中横は -epub-text-combine、などです。
EPUB3.0で、縦書き、縦中横、ルビ、圏点といった日本語組版の基本的な機能が入りましたが、採用が見送られたものもあります。EPUB3.0に含まれないCSS3 Text の機能としては、句読点のぶら下げの指定 hanging-punctuation、約物詰めなどの制御 text-spacing プロパティがあります。

CSS3 Text の text-spacing プロパティについて

CSS3 Text の以前のドラフト仕様では、和欧文間などにアキを入れる text-autospace、約物の詰め（行頭／行末／約物連続で半角幅に詰めるかどうか）を指定する punctuation-trim、行調整での約物の詰め text-justify-trim プロパティがありました（AH Formatter でもこれらを実装してますので、使っていただいている方にはお馴染みかもしれません）。それらがひとつに統合されたのが最新のドラフトでの text-spacing プロパティです。
以下は、text-spacing プロパティと他のプロパティを組み合わせて日本語の標準的な段落のスタイルを定義した例です（ドラフト仕様なので最終仕様は変わるかもしれません）：

p {
margin: 0;
text-align: justify; /* 行揃え */
text-indent: 1em;    /* 段落１字下げ */
hanging-punctuation: first allow-end;
/* 起こし食い込み、句読点ぶら下げあり */
text-spacing: trim-start trim-end ideograph-alpha ideograph-numeric;
/* 行頭約物半角、行末約物半角、和欧間アケ、和数間アケ */
}

なお、text-spacing プロパティのデフォルト（normal）は space-start（行頭約物全角）、allow-end（行末約物全角/半角）、trim-adjacent（連続する約物間を詰める）の組み合わせなので、これらの値を変えないのであれば明示的に指定する必要はありません（上の例では trim-adjacent が暗黙に有効です）。
text-spacing プロパティは、将来の CSS Text Level 4 ではより詳細な指定ができるようになるかもしれません（Adobe InDesign の「文字組みアキ量設定」と同様のことができるようにという要望があります）。文字クラスの前後の組み合わせごとのアキ量の最適値と下限と上限と設定できるようにすることなどです。例えば ideograph-alpha（和欧間アケ）、ideograph-numeric（和数間アケ）をそれぞれ別のアキ量にしたいというとき便利でしょう。

CSS Line Grid （行グリッド仕様）について

CSS での行の配置方法は、日本語組版で基本とされている行送りを等間隔にすることやベタ組みで行頭行末を揃えることがしにくい問題があり、これを解決するために CSS Line Grid （行グリッド仕様）が必要とされています。
CSS Textと Writing Modes 仕様策定で Elika (fantasai)さんとともに中心になっている石井宏治さんが、Line Grid 仕様のエディターも引き受けてくれて、最近 Editor’s Draft が公開されました：

• CSS Line Grid Module

この仕様は次のことを実現しようとしています：

• 行送りを等幅にして、見出しや図が間に入っても、等間隔が保たれて段組の段どうしで行の位置が揃うこと
• 全角字送りの整数倍の行長になるようにすることで、なるべく等幅の字送り（行調整のアキが字間に入るのを最小に）

この仕様がどうなるかは、まだ議論がはじまったばかりです。
（参考：twitter まとめ「CSS3 Line Grid仕様検討会」、「電子書籍やWebの行揃え」）
いずれこの標準化が進めば、将来のEPUBのバージョンに反映されることでしょう。

次世代電子出版とWeb　表現技術フォーラム

CSSや日本語のレイアウトを中心としたフォーラムが東京（5月30日）と京都（6月1日）であります。主催は「次世代Webブラウザのテキストレイアウトに関する検討会」（Technical Leader は石井宏治さんで、私もメンバー）、W3C/慶應と総務省が後援しています。6月2～4日には京都で W3C CSSWG のミーティングがあり、それに合わせて開催されることになったものです。
次の案内ページをご覧ください：

• 次世代電子出版とWeb 表現技術フォーラム in 東京：5月30日（月）
• 次世代電子出版とWeb 表現技術フォーラム in 京都：6月1日（水）

5月30日の東京フォーラムは定員に達して参加登録受付は終わっていますが、ストリーム中継があります。ぜひご視聴ください。
6月1日の京都のほうは、CSSWG メンバーも多く参加してくれて、ランチミーティングなどで交流できます。ボランティアの通訳がつきます。
（直前の案内になり、すみません）
追記：Twitterでの次世代電子出版とWeb 表現技術フォーラムに関する話題、実況、コメントなどは、ハッシュタグ #css2011jp をご利用下さい。

Tweet

W3C TPAC 2010 で CSS3 Writing Modes は…

今月初め、フランスのリオンでのW3C総会 TPAC 2010 のCSS WG会議で、CSS3 Writing Modes仕様について集中して審議されました。
結果は、石井宏治さん(@kojiishi)がツイッターで報告：

縦書きは順調。論理方向は一歩前進したけど及ばず、でも、継続審議にはなった。EPUB3の最低限ゴールからすれば、合格。でも個人的にはちょっと残念。状況からすれば仕方ないか、論理方向を支持する声は国内でも多くはないし。でも蓋を開けると文句噴出かなぁ、という気はします。難しい。
[3 Nov @kojiishi]

このとき議論されたこの時点でのCSS3 Writing Modes仕様(11月2日版)は次のものです：

• CSS Writing Modes Module Level 3
  Editor’s Draft 2 November 2010
  ※現在の最新版は：http://dev.w3.org/csswg/css3-writing-modes/

やはり論理プロパティ（8. Logical Properties and Values）については議論になり、残念ながら合意までには至らなかったようです。でも以前は反対していた人たちが、最低限の機能（margin と padding のショートハンドの logical キーワードなど）については必要性を認めるようになって、今後も議論を継続ということになったのは一歩前進です。
もうひとつ引用：

CSS WGのDanielから「今年はアジアからの参加者が過去になく多い、なぜだ？」と聞かれた。縦書きだ、と言ったら、うん、それだけ興味を持ってくれるなら日本で何かやらなければ、と言ってくれた。
みんなの貢献が将来につながります。多謝！
[3 Nov @kojiishi]

論理プロパティの必要性

例えばインデント（字下げ）の指定に横書きでは左アキ（margin-left）、縦書きでは上アキ（margin-top）などと物理方向を常に意識した指定が必要ということは制作者にとってとても不便だし、縦書きコンテンツを縦書き非対応のブラウザで横書きで表示した場合に、レイアウトが崩れて正常に読めないものになってしまうなど問題があります。
参考：「縦書きのときの方向指定問題」
それなら縦書きのとき「left」が上を指すように方向の定義を変えるという案もあったのですが、そうすると物理方向（top/right/bottom/left）は書字方向によらず絶対的な方向であるとしてきたCSS仕様の整合性を崩すことになってしまいます。
CSS仕様は中東のRTL（Right-to-Left：右から左への横書き）言語にも対応していますが、その場合、行頭側を空けるインデントの指定には margin-right を使う必要があります。RTL言語を含む多言語対応のウェブページの制作においてはCSSの「left」と「right」を入れ替える必要があり、制作者に負担が強いられているのが現状です（例えば次の変換ツールがこのために使われてます：CSS Janus）。もしも、RTLなら「left」が右を指すとすればCSSの変換は不要になりますが、左右の意味が逆になるのでは混乱するし、今さらそのようなCSSの仕様の変更は不可能です。
論理プロパティの案ならば、RTL言語にも、モンゴル語の左から右への縦書き（writing-mode: vertical-lr）にも有用です。

論理プロパティを別仕様に分離したうえで、CSS3 Writing Modes 公式ドラフト公開へ

CSS3 Writing Modes は、継続審議となった論理プロパティ（8. Logical Properties and Values）を別仕様に分離した上で、近いうちにFPWD（First Public Working Draft：最初のW3C公式ドラフト）となる見込みです。（その準備中の最新版のEditor’s Draft：http://dev.w3.org/csswg/css3-writing-modes/）
来年5月に勧告予定のEPUB3.0には残念ながら論理プロパティ仕様は入らず、縦書きと横書きではスタイルシートを書き直すことが必要になりそうです（インデントの指定に横書きでは margin-left、縦書きでは margin-top など）。これに対処するために、スタイルシートの縦書き／横書き変換を支援するツールなどが提供されることになると思います（論理方向 margin-start などで指定したものから縦横それぞれ用に変換するなど）。
しかし、これは論理プロパティ仕様の標準化がEPUB3.0のスケジュールに間に合わないための暫定的な対策であり、将来EPUBやWebでの縦書きを本格的に使えるものにするためには、やはり論理プロパティの標準化が欠かせません。
論理プロパティ仕様は、新しいCSS3モジュールの Editor’s Draft としてスタートすることになると思います。できるだけ早期にこの論理プロパティ仕様を完成させ、Webでの縦書きで使えるものにし、EPUB3の改訂版（EPUB3.1か）で採用されるようにすることが目標です。

実装が進んでいるCSS縦書きと論理プロパティ

標準化がまだこれからの論理プロパティですが、ドラフト案のものはすでに幾つか実装が進んでいます。
Antenna House Formatter は、CSS縦書きと論理プロパティを実装しています。少し前のドラフト仕様で 「EPUB仕様の日本語組版拡張を目指して(Version 0.8)」 にある writing-mode と論理プロパティに対応してます。
また、株式会社GNN「ブログ出版局」のCopper PDFという製品でも、CSS縦書きと論理プロパティが実装されています。（新・ブログ出版局管理人ブログにその説明とデモサイトの案内があります。）
ブラウザ Safari や Chrome のエンジンである WebKit での、縦書きと論理プロパティの実装も進んでいるようです（-webkit-writing-mode: vertical-rl や -webkit-margin-before、-webkit-logical-width などのプロパティが最新のWebKit Nightly Buildsで使えます）。

関連記事

• EPUB3.0へのCSS3採用の推進に関して [アンテナハウスのブログ I love software]
• 縦書き実現へと向かうEPUBと標準規格の魅力 [村田真，ITmedia]
• CSS3で縦書きスタイルを、電子出版の未来のために。日本発で提案中 [Publickey]
• 電子書籍フォーマット「EPUB」で縦書きとルビのサポート、来年5月には仕様完成の見通し [Publickey]
• CSS3が日本語の禁則処理、傍点、縦書きなど対応へ、ドラフト公開 [Publickey]
• 電子書籍の（なかなか）明けない夜明け　第4回　番外編：「電子書籍交換フォーマット」の正体を総務省に聞く [小形克宏，Internet Watch]
  ※記事の後半のほうで、「EPUB日本語拡張仕様策定」、「次世代ブラウザ（HTML5とCSS3）の縦書きレイアウトの規格化」ということに触れられています。
  （敬称略）

Tweet