ホームページの縦書きレイアウトを試してみました。   home

なたさかあ
にちしきい
ぬつすくう
ねてせけえ
のとそこお
あいうえお
かきくけこ
さしすせそ
たちつてと
なにぬねの

.
和文の筆記方向には、、縦書きと、、横書きがあります。

、tb−rl 上から下に(↓)文字を連ねてゆき、右から左に(←)行を並べてゆく。
        (漢文のスタイルと同じ。歴史的に見て、和文本来のスタイルです。)

、lr−tb 左から右に(→)文字を連ねてゆき、上から下に(↓)行を並べてゆく。
        (近代になって、欧米語文の影響を受けて成立したスタイルです。)

 私が子供の頃、煙草屋の店先には「こばた」という看板が掲げられていました。
〔tb−rl〕という和文本来のスタイルにおいて、あえて横書きがなされる場合、右から左に
(l←r)書き連ねられることになる。そういうと、2つのスタイルの間の溝は深そうですが、

  ↓tb  → lr  〔tb−rl〕を反時計回りに90度回転すると〔lr−tb〕にぴったり重なる。
 ← rl   ↓tb  〔lr−tb〕を時計回りに90度回転すると〔tb−rl〕にぴったり重なる。

このように、2つのスタイルの体つきは、およそ同じであって、縦書き、横書きといっても、ただ単に2つのスタイルが置かれる境遇が自ずから相違しているだけなので、違和感にはあまり惑わされずに、国語の教科書は縦書き、数学の教科書は横書きというふうに、文の内容に適合したスタイルが当然に選択されていると思ってしまうわけです。
(参考文献;横書き登場〜日本語表記の近代〜 矢名池誠著:岩波新書)

それはともかく、縦書きスタイルは、生活様式の急速な西欧化の波に耐えて、依然健在です。筆記においても、印刷においても、一定のシェアーを確保して、急に衰える気配もありません。ところが、インターネットの世界では、様子が違います。実際、ホームページ上において、縦書き文を見かけることは滅多にありません。「Webページだけが例外なのです。」

Webページだけが例外なのです。HTML はこの形式のレイアウトを処理できません。しかし、Web制作者は、これまでこの縦書きレイアウト表示を行うためにビットマップ画像の作成から、非常に幅の狭い表のセルまであらゆることを試してきましたが、どれも満足できるものではありませんでした。

(Internet Explorer 5.5 における縦書きレイアウトの使用
  Mark Grinols Microsoft Corporation 日本語版最終更新日 2000 年 11 月 2 日)

http://msdn.microsoft.com/ja-jp/library/bb250415(v=vs.85).aspx

HTML は〔tb−rl〕をどうにも処理できないまま現在に至ったわけですが、そのことをHTMLの発達の歴史に即して考えてみました。
Webの母胎となった欧米語において、HTMLは、文字列を水平に配置(Horizontal layout)して表示すればことたりたので、文字列を垂直に配置(Vertical layout)するスタイルを別途用意しておく必要もなかった。さて、HTMLが最初に東アジアの言語に接触したとき、東アジア言語の側には、文字列を水平に配置(Horizontal layout)するスタイルが既に用意されており、HTMLはこれに迎えられた。
したがって、東アジア言語特有の、文字列を垂直に配置(Vertical layout)するスタイルの存在が認識されたのは、HTMLにおいては、ごく最近のことかもしれません。

私が、3年前から公開されていたこの記事を、遅ればせながら探し出すことが出来たのは、自作HPでの縦書きを模索していたからです。満足できない試みと評されている過去の「縦書きレイアウト」法の一つを、私は最近自発的に試みていました。
実際に、幅の狭い表のセルで、縦書きレイアウト表示してみたら、つぎのようになりました。
.

使用した記号フォント

 

 `

`¬

L``

  

¬出雲國風土記L`゚

神門郡の名所記事より

`` 或陵礒
 ゚ 
起松山南端美久我林
 `尽石見與出雲国堺中嶋埼
之間
 `或平濱
 `
`` 埋松林
 ゚今
 `半埋
 `半遺
 ゚恐
 `遂被埋已歟
 ゚
並 無也
 ゚白沙耳積上
 ゚即
 `松林茂繁
 ゚四風吹時
 `沙飛流
 `掩
坐時之綱矣
 ゚今
 `俗人號云
 ¬薗松山
L`゚ ` 
地之形體
 `壌
・石
 `

 ゚長廿二里二百卅四歩
 ゚廣三里
 ゚此者
 `意美豆努命之國引
鯔魚
・鎮仁
・須受枳
・鮒
・玄蠣也
 ゚即
 `水海與大海之間
 `有
神門水海
 郡家正西四里五十歩
 ゚周卅五里七十四歩
 ゚裏則有
``

Microsoft FrontPage を用いて作ってみた結果は見てのとおりですが、つぎのような難点が指摘されます。

◎〔lr−tb〕を本来のスタイルとするHTML文書の実態としては、表左上の「使」から書き始めて、右下の「有」に終わるという順序で記述されています。それで、HTMLソースが意味ある文として読まれる際には〔lr−bt〕ともいうべき奇妙なスタイルになっています。 

、などの記号を利用できない。この種の記号フォントの縦書きに直接適合するものが用意されていないのです。この例文では、やむをえず、90などで代用しました。

◎この例文は、私のページ(出雲国風土記全文)から写したものですが、縦書きに合うように加工して貼り付けるまでにかなり手間がかかっています。もっとも、便箋に筆記するような調子で文字を入力してゆくぶんには案外楽かもしれません。

しかし、所詮このセル縦書き法がしていることは、いつでも横書き(lr−tb)を強制しているHTMLの支配下において、横書きの1行の文字の数を1個に制限してしまうという姑息な手段に訴えているだけのことです。たまにするのは良いけれども、常々行なって良いような立派なことではない。それを思うと、とても恥ずかしくて、作業を続けるのが厭になってしまいます。もちろん、Mark Grinolsさんが「どれも満足できるものではありませんでした」といわれた試みの一つになることは免れません。
ただ、私自身は、この短い古典文の縦書きレイアウト表示をこのように試みて、その出来栄えには十分満足しており、直感的で素人にもとっつきやすいこの方法は、まんざら捨てたものでもないと思います。

.
Vertical layout
(Internet Explorer Only)

神門水海 郡家正西四里五十歩。周卅五里七十四歩。裏則有「鯔魚・鎮仁・須受枳・鮒・玄蠣」也。即、水海與大海之間、有山。長廿二里二百卅四歩、廣三里。此者、意美豆努命之國引坐時之綱矣。今、俗人號云「薗松山」。地之形體、壌・石、並無也。白沙耳 積上。即、松林茂繁、四風吹時、沙飛流、掩埋松林。今半埋半遺。恐 遂被埋已歟。

起松山南端美久我林、尽石見與出雲国堺中嶋埼 之間、或平濱、或陵礒。
 writing-mode: tb-rl; width: 467; height: 514

.

.

.

.

.

.

.

.

.

.

.

.

Microsoft Internet Explorer 5.5 に新しく追加された機能によって、Vertical layoutページを作成して公開すると、ほかのWebブラウザで見ている方々の顰蹙を買いそうですが、このページは、未対応のブラウザの方へも、ほぼ同じ体裁のものを配信している関係上、その心配はなさそうなので、Vertical layout を試してみました。

私は、Microsoft FrontPage の編集画面とプレビュー画面を行き来するばかりで、HTML文を開いて見ることもあまりないのですが、今回は、「<div style="writing-mode: tb-rl; width: ; height: " lang=ja>」「</div>」という文を手ずから挿入しました。あとは、いつものとおりで、編集画面の文字列はやはり水平に配置されています。さすがに Microsoft なので、FrontPage のプレビュー画面は、Vertical layout に対応しており、垂直に配置された文字列が見られます。

おわりに
現代日本語文の縦書きと横書きは、その文の内容に適したスタイルが、選択されています。ところがWebの世界では、ホームページでも、電子メールでも、縦書きを選択することはおろか、縦書きの手段を会得することすら難しいのが現状です。しかし、数年前は、横書き一辺倒があたりまえで不自由も何もなかったわけで、インターネットが私たちの生活文化に奥深く浸透した今現在、ようやく不自由だと感じる余裕が出てきたのかもしれません。しかし、Vertical layout にしても、ホームページ作成ソフトの編集画面ではやはり横書きに書いている現状は、書く側をいまだに満足させていないわけで、ここのところが最大の難点ではないかと思います。編集画面にも縦書きに表示する機能が追加されて、編集画面とブラウザ画面が一致するようになれば、文の内容に適した筆記方向で書き読みされることが多くなり、日本のWeb全体の内容は今よりずっと豊かになる可能性があります。
それはともかく、私自身のページ作りでは、これからも横書きを基調にするにしても、縦書きで示すのが適当な参考資料などは、かならず縦書きで表すように極力心掛けてゆきたいと思います。(2004. 1. 5)

home