‘CSS’ タグのついている投稿

JLREQとCSS(3)

2017/08/04

 こちらのエントリは、JAGAT XMLパブリッシング準研究会で今期の研究テーマとして、W3C文書「日本語組版処理の要件」(JLREQ)と、これに関連してVivliostyleの村上真雄さんたちが提出したW3Cメンバーサブミッション「Web技術を用いた日本語組版の現状」を取り扱っていることに伴い、会員以外の方の意見を広く求めるとともに、記録を残しておく目的で議事録をベースに補足したものを公開するものです。

 間違い、補足などございましたらご意見いただければ幸いです。なお、当ブログはコメント許可制を取っているため、反映に時間がかかります。あらかじめご理解ください。
 方針としましてはW3C文書「日本語組版処理の要件」(JLREQ)を先頭から読んでいき、各要素に対応するCSSが存在するのか、存在するとして実用段階なのか、InDesignなどの組版ソフトではどういった形で機能を実現しているのか(いないのか)、などについて見ています。なお全体に対しての包括的な説明の部分に関しては、細かな部分は次回以降にその部分の説明が出てきた時に掘り下げる、としてスルーしている箇所があります。

 なお、こちらで取り上げております各CSSプロパティはまだドラフト仕様の段階のものも多いため、今現在すぐに使えるものばかりではありません。Webブラウザで使用出来るかどうかはこちらなどでご確認ください。また、電子書籍のRSで使用出来るかどうかは、現在広範に調査した資料がありません。いずれ当研究会の活動として調査を行いたく考えていますが、しばらく時間はかかるかと思います。

JLREQ 3.1.4 始め括弧類,終わり括弧類,読点類,句点類及び中点類が連続する場合の配置方法

 例えば『」「』(閉じカギと開きカギが連続する場合)の間のスペースは前の文字に付くスペースなのか後ろの文字に付くスペースなのか。どちらに付くのかで例えば文字を拡大したときの挙動が変わる。

 これに対して次のような意見が出た。
 「どちらにつくものでもないので、(CSSの規格やRSの実装としては)前後の文字を二分モノと考えて、適宜スペースを挿入するという考え方もありではないか(小林さん)。」
 「適宜スペースを挿入してゆくとどこまでも字間が開いてしまうので、最大値を定めるのもありかもしれない(木枝さん)。」
 私個人の意見としては、現状「版面(というべきかどうか)のサイズを本文文字サイズの整数倍にする」というベタ組みの基本ルールが規格化されていないわけで、それを抜きにして個々の箇所のツメを厳密に決めてもほとんど意味がないと思っている。もし今後も当面ベタ組みの規格化が望めないのであれば、小林さんの案のようにスペースをある程度フレキシブルに伸縮できるものとするのがよいのではないか。その上で木枝さんの話のようにスペースによる調整量にリミットを設け、リミットを超過した場合には文字間を割って調整する形にするのがよさそう。

JLREQ 3.1.6 区切り約物及びハイフン類の配置方法

 「文末にくる区切り約物(疑問符・感嘆符)の前はベタ組とし,区切り約物の後ろは全角アキとする(図73).ただし,区切り約物の後ろに終わり括弧類がくる場合は,この字間はベタ組とし,終わり括弧類の後ろを二分アキにする」
 !?の後のスペースが行頭に送られて字下げにならないように全角スペースのぶら下がりを許容するべきではないか、という意見が出ていた。

JLREQ 3.1.7 行頭禁則

 JLREQ本文には「終わり括弧類,ハイフン類,区切り約物,中点類,句点類,読点類,繰返し記号,長音記号,小書きの仮名及び割注終わり括弧類を行頭に配置してはならない(行頭禁則).これは体裁がよくないからである.」とあるが、注の表記内でさまざまなバリエーションを記述してある模様。
※ベタ組みの横のラインの保持を優先し、長音記号や小書きの仮名の行頭配置を許容する考え方もあるよう。これは歴史のある出版社に多く見られるルールのようだ。

CSS:禁則
CSS Text Module Level 3 5.3. Line Breaking Rules: the line-break property
禁則に関しての規定。autoでは本来は一行文字数に応じて徐々に緩い禁則になる実装が期待されるが、実際にはあまりそういった実装はされておらず、Normalとほぼ同義になっているものと思われる。

JLREQ 3.1.9 行末に配置する終わり括弧類,句点類,読点類及び中点類の配置方法

 「行末に配置する終わり括弧類(cl-02),読点類(cl-07)及び句点類(cl-06)は,その後ろを原則として二分アキとする(図76 ).」

 「(活字組版時代は,次の考え方が主流であった(図78 ).として)行長に過不足が発生し,行の調整処理で詰める処理の必要がある場合(3.8 行の調整処理を参照),優先的に句点類,読点類及び終わり括弧類の後ろの二分アキをベタ組にする.これは,行末でもあり,これらの後ろの二分アキがベタ組になってもほとんど問題にならないからである.なお,この二分アキを中間的な四分アキにするという方法は採用されていなかった.二分アキ又はベタ組のいずれかを選択する,ということである.また,行の調整処理で詰める処理が必要な場合,句点類,読点類及び終わり括弧類の後ろの二分アキより優先順位は低くなるが,中点類の前後の四分アキをベタ組にする.」
※「そもそも活字の時代には全角の中黒しかなかった」とのこと。必要に応じて削っていたそう。そういった対処が必要だったことが、ツメ処理の優先順位で中点類がカギ類などより後になっていることに影響しているのではないか。
※JLREQはあくまで活版ペースでの記述なので、長体平体の記述はない。おそらく写植起源のため。

「DTPなどでは,行末に配置する句点類,読点類及び終わり括弧類のすべての後ろをベタ組とする処理法も行われている(図79 ).」
これに対応するCSS指定がtext-spacingの「trim-end」。なお、「no-compress」という指定もあるが、これは後日JLREQ 3.8.2に関連して触れる予定なのでここでは深掘りしない。

JLREQ 3.1.10 分割禁止

「次のような文字・記号が連続する場合は,その字間で2行に分割しない(分割禁止).これは,それらの文字・記号を一体として扱いたいためである.」
※分離禁止とは違う用語なので注意。
 JLREQでは二倍ダーシ、三点リーダ、アラビア数字の字間などの例が挙げられている。

※UnicodeでTWO-EM DASHという符合位置が規定されたのに対応して、2倍ダーシを独自グリフとして持っているフォントも出てきている(源ノ角ゴシックなど)。これは活版のグリフの再現と見ることもできそう。なお符合位置としてはTHREE-EM DASHも既にあるようだ。
※図84の123 4 のアキは位取りとのことだがほとんど見たことがない。用例はどのあたりだろうか? また、ちょっとわかりにくく、誤植を疑ってしまったのでもう少し桁数を増やして欲しい。

CSS:分割禁止/許容
CSS Text Module Level 3 5.3. Breaking Rules for Letters: the ‘word-break’ property
・word-break:normal
一般的なルールに従って単語を分断する
・word-break:keep-all
単語の中での分断は禁止される。CJKの文字(漢字、かな、カナを含む)は分割されなくなる。
・word-break:break-all
normalでの分断可能部分に加えて、単語の中での分断も許容される。

 今回はここまで。次回はJLREQ 3.1.10のgから。

(2017.8.7)

CSS Text Module Level 3のリンク参照先を10 August 2017のワーキングドラフトに変更しました。

(2017.9.4更新)

JLREQとCSS(2)

2017/07/11

 こちらのエントリは、JAGAT XMLパブリッシング準研究会で今期の研究テーマとして、W3C文書「日本語組版処理の要件」(JLREQ)と、これに関連してVivliostyleの村上真雄さんたちが提出したW3Cメンバーサブミッション「Web技術を用いた日本語組版の現状」を取り扱っていることに伴い、会員以外の方の意見を広く求めるとともに、記録を残しておく目的で議事録をベースに補足したものを公開するものです。

 間違い、補足などございましたらご意見いただければ幸いです。なお、当ブログはコメント許可制を取っているため、反映に時間がかかります。あらかじめご理解ください。
 方針としましてはW3C文書「日本語組版処理の要件」(JLREQ)を先頭から読んでいき、各要素に対応するCSSが存在するのか、存在するとして実用段階なのか、InDesignなどの組版ソフトではどういった形で機能を実現しているのか(いないのか)、などについて見ています。なお全体に対しての包括的な説明の部分に関しては、細かな部分は次回以降にその部分の説明が出てきた時に掘り下げる、としてスルーしている箇所があります。

 なお、こちらで取り上げております各CSSプロパティはまだドラフト仕様の段階のものも多いため、今現在すぐに使えるものばかりではありません。Webブラウザで使用出来るかどうかはこちらなどでご確認ください。また、電子書籍のRSで使用出来るかどうかは、現在広範に調査した資料がありません。いずれ当研究会の活動として調査を行いたく考えていますが、しばらく時間はかかるかと思います。

JLREQ 2.6 柱とノンブル

 縦組み、横組みそれぞれの柱とノンブルの代表的配置例が示されている。ただし、DTPによるレイアウトが一般化した現在では、ここの例に留まらない様々なレイアウトが行われている。

CSS:柱とノンブル
CSS paged media module level 3で規定されている。
ノンブル、柱の表示指定は「@page{ }」の中に書く。CSSでのページ関連プロパティ指定の基本。
@page :right/@page :left
 左右ページの指定疑似クラス(pseudo-class)。
@page :first
 先頭ページ(扉など)の指定疑似クラス。
@page :blank
 空白ページの指定疑似クラス(改丁などで生じるもの)。
・@bottom-center { content: counter(page) }
 ノンブルの記述方法。@bottom-centerは表示位置指定。
・@top-center { content: “Sample Contents” }
 柱文字の記述方法。この場合は「Sample Contents」が肩文字として表示される。@top-centerは表示位置指定。
表示位置の指定はこちらを参考に。
特定ページのみノンブルを隠すのはclass名を定義して@pageで指定すれば一応可能。

JLREQ 2.6.3 柱及びノンブルの配置方式

 「柱には,両柱方式と片柱方式とがある」

CSS:複数ノンブル(時計数字と通常ノンブルetc)
Page Based Countersでスタイルを指定する
・content: counter(page, lower-roman)
 などでそれぞれのノンブルを指定してやる。漢数字などで表示させることもできる(参考)。
 なお、epub等でよく見られるように複数ファイルを通しでノンブルを振るような仕組みが現状CSSにはない。これは提言があってもよいかも。
font-feature-settings:"onum"
 ノンブルにオールドスタイル字形を使うことができる。他にもさまざまな数字の表示指定が可能。

JLREQ 3.1.1 縦組と横組で異なる約物など

 縦組と横組で形が異なる約物には、以下のものがある。
■句点類と読点類
「縦組では,句点類には,句点[。]を,読点類には読点[、]を使用する.」
「横組で使用する句点類と読点類の組合せには,次の3つの方式がある.」
 コンマ[,]とピリオド[.]を使用する
 コンマ[,]と句点[。]を使用する
 読点[、]と句点[。]を使用する.

■かぎ括弧(始めかぎ括弧[「]及び終わりかぎ括弧[」])とクォーテーションマーク(左ダブルクォーテーションマーク[“] 及び右ダブルクォーテーションマーク[”] 並びに左シングルクォーテーションマーク[‘] 及び右シングルクォーテーションマーク[’])
「縦組では,始めかぎ括弧[「] 及び終わりかぎ括弧[」] を用いる」
「横組では,始めかぎ括弧[「] 及び終わりかぎ括弧[」] に替えて左ダブルクォーテーションマーク[“] 及び右ダブルクォーテーションマーク[”] ,又は左シングルクォーテーションマーク[‘] 及び右シングルクォーテーションマーク[’] を用いる方法がある」
「ダブルクォーテーションマークに似た括弧類にダブルミニュート(始めダブルミニュート[〝] 及び終わりダブルミニュート[〟] )がある.これは,縦組専用の括弧類であり,横組では使用しない.」
※これは最近横組みでの用例が映像分野などでは見られたりする。
「ブラケット(始め大括弧[[] 及び終わり大括弧[]] )と,きっこう(始めきっこう括弧[〔] 及び終わりきっこう括弧[〕] ) ブラケット([ ])を縦組用に変形したものが,きっこう(〔 〕)である.したがって,特別な場合を除き,横組ではブラケットを使用する.」
 これは縦横の明白な使い分けが今ひとつピンと来ない。両方あるような。
 他、長音記号なども縦横でグリフ(字形)が変わる。

JLREQ 3.1.2 句読点や,括弧類などの基本的な配置方法

「読点類,句点類,始め括弧類,終わり括弧類及び中点類の字幅は,半角であるが,これらの約物が漢字等,平仮名又は片仮名と連続する場合は,原則として,それぞれの約物の前又は後ろ(中点類は,その前及び後ろ)に一定の空き量をとることで,結果として全角というサイズになる」
 カギの中のカギ、小カギはUnicodeでは分離されていない。

JLREQ 3.1.4 始め括弧類,終わり括弧類,読点類,句点類及び中点類が連続する場合の配置方法

 句読点や括弧類などの約物が連続した際の組版処理方針に関しての記述がある。このツメ処理はInDesignなどの組版ソフトでは実現できているが、ウェブブラウザや電子書籍ビューアではほとんど実現できていない(電子書籍ビューアのhontoでツメ処理の実装例が見られるが、制作者のCSS指定を反映してツメ処理を行う形ではなく、ビューア側で強制的に処理をする独自実装)。

CSS:括弧類や中点類、句読点が連続する場合などの文字ヅメ文字アケ処理
text-spacing:normal
 CSS Text Level 4で規定されている。normal指定でspace-start allow-end trim-adjacentが適用される。個々のプロパティは別々に指定もできる。
text-spacing:space-start
 段落先頭カギを全角として扱う
text-spacing:trim-start
 段落先頭カギを二分モノとして扱う
text-spacing:allow-end
 行末に句読点やカギが来た際に二分幅になることを許容する
text-spacing:space-end
 行末に句読点やカギが来た際に必ず全角幅として扱う
※W3Cの仕様書に「Set fullwidth opening punctuation with full-width glyphs (spaced) at the start of each line.」とあるがおそらく「Set fullwidth ending punctuation with full-width glyphs (spaced) at the end of each line.」の間違い(space-startと全く同じ説明文が記載されている)。
text-spacing:trim-end
 行末に句読点やカギが来た際に必ず二分幅として扱う
text-spacing:space-adjacent
 行頭行末以外の括弧類を全角モノとして扱う
text-spacing:trim-adjacent
 句読点グリフ間のスペースを縮小する(おそらく括弧と句読点が重なった際などの自動ツメ処理を指しているものと思う)
text-spacing:ideograph-alpha / text-spacing:ideograph-numeric
 和欧間の4分アケ処理指定。ideograph-alpha が英文字、ideograph-numericが数字。

JLREQ 3.1.5 行頭の始め括弧類の配置方法

 行頭括弧類の字下げ量について。以下の3つの方針がある。
「改行行頭の字下げは全角アキ,折返し行頭は行頭に空き量をとらない配置法である天付きとする.」
「改行行頭の字下げは全角半(全角の1.5倍)アキ,折返し行頭の字下げは二分アキとする.」
「改行行頭の字下げは二分アキ,折返し行頭は天付きとする」

 CSS Text Module Level 4 10.1.3にそれぞれの実現方法の記述例がある。

 CSSでの基本的方針として行末に来た全角スペースは自動で取って欲しいという要望が出た。ぶら下がりの対象文字に全角スペースを含める方式がよいのではないか。

CSS:ぶら下げ
hanging-punctuation:force-end / hanging-punctuation:allow-end
 強制的にぶら下げがforce-end、ぶら下げを許容するのがallow-endか

今回はここまで。

(2017.7.11)

JLREQとCSS(1)

2017/06/09

 こちらのエントリは、JAGAT XMLパブリッシング準研究会で今期の研究テーマとして、W3C文書「日本語組版処理の要件」(JLREQ)と、これに関連してVivliostyleの村上真雄さんたちが提出したW3Cメンバーサブミッション「Web技術を用いた日本語組版の現状」を取り扱っていることに伴い、会員以外の方の意見を広く求めるとともに、記録を残しておく目的で議事録をベースに補足したものを公開するものです。

 間違い、補足などございましたらご意見いただければ幸いです。なお、当ブログはコメント許可制を取っているため、反映に時間がかかります。あらかじめご理解ください。
 方針としましてはW3C文書「日本語組版処理の要件」(JLREQ)を先頭から読んでいき、各要素に対応するCSSが存在するのか、存在するとして実用段階なのか、InDesignなどの組版ソフトではどういった形で機能を実現しているのか(いないのか)、などについて見ています。なお全体に対しての包括的な説明の部分に関しては、細かな部分は次回以降にその部分の説明が出てきた時に掘り下げる、としてスルーしている箇所があります。

 なお、こちらで取り上げております各CSSプロパティはまだドラフト仕様の段階のものも多いため、今現在すぐに使えるものばかりではありません。Webブラウザで使用出来るかどうかはこちらなどでご確認ください。また、電子書籍のRSで使用出来るかどうかは、現在広範に調査した資料がありません。いずれ当研究会の活動として調査を行いたく考えていますが、しばらく時間はかかるかと思います。

JLREQ 2.1.1 日本語組版に使用する文字

「日本語組版に使用する和文文字では,主に漢字等,平仮名及び片仮名を使用する」
 対象とするUnicodeの符号番号も参考として記述されている。
 JLREQで使われているコードと実際の組版ソフト内で使われているコードには違っているケースがある(付属書A)。

JLREQ 2.1.2 漢字等,平仮名,片仮名

 「漢字等,平仮名及び片仮名は,正方形の文字の外枠を持っており,その文字の外枠の天地左右中央に,文字の外枠よりやや小さくした字面を持っている」
※日本語の文字の構造についての概略的な説明。
※参考リンク:モリサワフォント用語集「字面」

JLREQ 2.1.3 漢字及び仮名の配置の原則

InDesignでのフォント内情報を利用した詰め組指定

InDesignでのフォント内情報を利用した詰め組指定

 「漢字等,平仮名及び片仮名は,行に文字を配置していく際には,原則として,文字の外枠を密着させて配置するベタ組にする」
 柱や見出しなどではアキ組みを使うケースがある。
※あくまでも書籍本文組版に関しての話であることには注意するべき。広告などでは詰め組みが多い。
※参考リンク:なんでやねんDTP「「ベタ組み」について…少しだけ…」
 詰め組の方法としては均等詰めと字面詰めがある。

CSS:文字のアケ・ツメ
■通常の文字ツメ・文字アケ
letter-spacing
 追加のスペースを隣接する文字と文字の間に入れる。いわゆる手動での文字アケ・ツメ指定

■Opentypeフォント内部の情報を利用する文字ツメ
font-feature-settings: “pwid”; フォント内のプロポーショナル(文字ツメ)情報を有効にする。これは今のブラウザでも一応使える。
font-variant-east-asian: proportional-width; 日本語などのフォント内のプロポーショナル(文字ツメ)情報を有効にする。より使いやすくなるはずだが実装はまだまだ。
font-variantが上位プロパティ(フォント関係のさまざまな指定をここでまとめて指定できる)。
 なお、このツメ処理は表示フォントがプロポーショナル(文字ツメ)情報を持っていることが条件になる。従ってユーザーが表示フォントを切り替えるなどの操作を行った際に無効化される可能性はある。

JLREQ 2.2.3 基本となる組体裁の主な設計要素

 基本版面、柱、ノンブルなど組要素の概略説明。
 「日本語組版と基本版面の基本的概念を理解するためには,格子モデルよりも,大きさが基本版面の1行に相当する,いわばスリットモデルをイメージした方が理解が容易」
 日本語組版では書字方向へのスペース調整は随時行われるが、ページ進行方向のラインは不動。
※参考リンク:JAGAT 【日本語組版とつきあう 4】基本版面の設定と文字の配置

CSS:組方向
writhing-mode ※日本語の縦書きに関する部分
 horizontal-tbが横書き、vertical-rlが縦書き。
 vertical-lrはモンゴルなどで使われる。この他、「sideways-rl」、「sideways-lr」というプロパティがあるが、これは例えば縦書き文書内で特定のブロックを回転させる時などに使う。表の項目とか縦組みで大きな表を入れるときのキャプション横倒しとか。

CSS:段組
 段組に関しての各CSSプロパティの記述は以下。
段幅(段組の最適(最小)文字数指定)
column-width
段数
column-count
段間
column-gap
段間ケイ
column-rule
※なおJLREQには段間ケイに関しての記述がない模様。
※その他いわゆる段抜き見出しに関する処理の記述もあるが、そこは後日JLREQ4章で詳しくやるので今回は割愛。

JLREQ 2.3.2 縦組と横組の主な相違点

日本語の段組の段の配置方法の基本ルールや、日本語の文中に英単語を挿入するための各種の方法(正立/横転/縦中横)に関しての概略的な説明。

CSS:縦中横
text-combine-upright:all
 epub3での古いプロパティとして -epub-text-combine:horizontal などもあった(epub3規格策定時にCSSプロパティ名が正式に確定していなかったため多少の混乱がある)。
※後日JLREQの3章で詳しくやるので今回はこれだけ。

CSS:段組のなりゆきの処理
column-fill:balance/balance-all
 JLREQの見本の指定通りにするには縦組みだとauto、横組みだとbalance-all。

JLREQ 2.4.1 基本版面の設計手順

「日本語組版では,正方形の文字の外枠をベタ組にすることから,まず基本版面のサイズを設計し,そのうえで,仕上りサイズに対する基本版面の位置を決めている」
ここが大きな特色。

JLREQ 2.5.1 基本版面からはみ出す例

 (1行目の)ルビ/圏点、ぶら下がりは版面の外側にはみ出る。ここはボックスモデルを基本としてきたこれまでのCSSと根本的に異なる考え方のひとつ。
※参考リンク:Adobe Indesignヘルプページ ルビの設定方法(InDesign CC/CC 2014)
※参考リンク:InDesinの勉強部屋 InDesign1.0 No.66 圏点
※参考リンク:Wikipedia「ぶら下げ組み」

CSS:裁ち落とし
bleed
Webブラウザなどにはまず関係しないと思われるものだが、仕様としては提案されている。
※参考リンク:日経印刷DTPテクニカルガイド「仕上がりサイズと裁ち落とし」

今回はここまで。

(2017.6.9)

プロフィール
Jun Tajima

こちらにて、電子書籍&Web制作を担当しています。
このブログは、EPUB3をはじめとした電子書籍制作担当オペレータからの、「電子書籍の制作時にたとえばこんな問題が出てきていますよ」的な「現地レポート」です。少しでも早い段階で快適な電子書籍閲覧・制作環境が整うことを願って、現場からの声を発信していこうと目論んでおります。

当ブログ内の記事・資料は、私の所属しております組織の許諾を得て掲載していますが、内容は私個人の見解に基づくものであり、所属する組織の見解を代表するものではありません。また、本ブログの情報・ツールを利用したことにより、直接的あるいは間接的に損害や債務が発生した場合でも、私および私の所属する組織は一切の責任を負いかねます。