2008-01-26

CSSを使った、即席の縦書きビューワ

 縦書きとは、無論、文字列を右から左へ、垂直に表記するのがことを指す。近年、コンピュータの普及により、左から右へ、水平方向に表記すること多くなり、既に皆なじんでいるが、やはり、縦書きで読みたいこともある。読むだけなのに、縦書きとは少しおかしいが、他に適当な言葉も思い当たらないので、縦書きという。  まず単純に、文字列を縦に表示するコードを書くのは、それほど難しくない。誰でもかける。ところが、大勢に役立つビューワを作るのは、とても難しい。例えば、フォントフェイスをはじめとして、フォントサイズや文字色、背景色、行間、文字間、も変更可能でなければならないし、禁則処理をする、しない。等々、要求は尽きない。  また、たんなるPlain Textのみを表示できればよいというわけではない。例えば、既存のHTML、XHTMLを、レイアウトの崩れはともかく、縦で読みたい需要もあるし、文字コードは、日本語ならば、最低でもJIS、シフトJIS、EUC、Unicode(UTF8とUTF16の最低でもリトルエンディアン)には対応していなければならないし、青空文庫のような、政治的な規格でこそないが、デファクトスタンダードになっているような書式もある。事に、今の日本では、青空文庫を無視して、「さあさ、お立会い、此は縦書き表示可能にして、我が朝に、このソフトウェアありと云われし、優れたるテキストビューワなり」などと謳えば、いい笑いの草となることは、火を見るよりも明らかである。  さて、世にテキストビューワは色々あれども、いずれも我が用を果たさざる。smoopyなどと自称せるソフトウェアを試してみたが、どれもあまりできがよくはない。かといって、おいそれと自分で作る、というわけにもいかぬ。なんとなれば、上記したる要求を満たすには、途方もない労力と時間が必要だ。  そこで、こんな選択肢もあるということを紹介しよう  青空文庫を縦書きで読む場合を考える。青空文庫は、XHTMLでも提供されていて、これには、文字コードにはない特殊な文字が、画像として提供されている。また、青空文庫は、冒頭で、二つ上の階層にある、default.cssを参照している。なるほど、では、ローカルに保存するときも、このように保存してやればいい。二階層上に、次のようなCSSファイルを置くのだ。
body { direction : rtl ; } div.main_text { writing-mode : tb-rl ; font-family : "MS 明朝" ; } h1, h2 { display : none ; } div.bibliographical_information, div.notation_notes { display : none ; }
 これで、縦表示になる。問題は、writing-modeをサポートしているブラウザが少ないことだが。

No comments: