縦書きの美しさを
ウェブの世界へ

縦書きWeb普及委員会は、日本の文化である縦書きを利用した
Webコンテンツの普及促進に取り組んでいます。

縦書きWebとは

Webは横書きが当たり前?

ウェブサイトは横書きしかできない。そんな常識は変化しつつあります。

ウェブにおける縦書きの取り組みは、Internet Explorer 5.5(二〇〇〇年)による独自の実装がありました。その後、二〇一〇年以降、W3C CSS Working Group による仕様策定が活発化し、ブラウザベンダーによる実装や、有志によるテストなどの協力の成果として、最新の主要なウェブブラウザは縦書きを表現できるようになっています。

私たちは縦書きをウェブの世界でどのように役立てることができるのでしょうか。縦書きの表現はコンテンツのみならず、さまざまな閲覧デバイスやそのユーザーインターフェイスの可能性をも広げます。

当サイトでは、CSS Writing Modes を中心に、ウェブサイトで縦書きをはじめとする日本語レイアウトを実現するための技術解説と、縦書きを利用したウェブサイトの事例を紹介します。

当サイトのコンテンツが、縦書きを利用した新しいウェブデザイン探求の一助となることを願っています。

技術解説

縦書きをはじめとする日本語レイアウトを実現するための仕様について解説します。

CSSによる縦書きWebサイト

CSSによる縦書きを使用してデザインされたWebサイトを紹介します。

くらげごはん

個人ブログのレシピ集。お品書き風のレシピ一覧と各レシピが書籍のように縦書きでデザインされている。

  • 制作
  • KAZUYUKI MOTOYAMA
自作ゲーム大年表

コンピュータ黎明期からの個人・グループ作成ゲームに関する年表。年表部分が縦書きにて記載。

  • 制作
  • hiroki_yo
  • 長澤美郷
Writer

縦書き日記風のはてなブログ用テーマ。CSSで細かくデザインも指定できる。

  • 制作
  • nitro_idiot
さやのもとクリニック

横書き縦スクロールのサイトに部分的に縦書きを採用している。

  • 制作
  • カワセ タケヒロ
あけおめ企画

CSSのみを用いた縦書きの年賀状。サンプルコードと詳しい解説あり。

  • 制作
  • phi

縦書きWebコンテンツの例

小説や雑誌など、普段目にする縦書き文書をCSSを用いて作成してみました。

縦書きWeb普及委員会について

日本語とウェブの未来にむけて

縦書きWeb普及委員会(正式名称:次世代Webブラウザのテキストレイアウトに関する検討会)は、電子書籍端末メーカー、印刷事業社、通信事業者などの民間企業等により構成される組織で、Webにおける縦書きやルビ等の日本語固有の表現の実現に関し、国際標準化や普及促進に関する活動を行っています。

縦書きに代表されるような日本語固有のテキストレイアウトの表示機能がWebブラウザに実装され、端末に依ることなく縦書き表現が利用できるようにすることは、日本の文化である縦書き表現を継承する観点や、世界に向けた日本語コンテンツの発信を維持・強化する観点から、非常に重要な事柄です。

Webブラウザに関する国際標準化団体であるW3C(World Wide Web Consortium)では、Webページの記述方式であるHTMLやCSS等の標準化作業が進められていますが、日本の雑誌や書籍等で表現される縦書きテキストレイアウトの表示機能についてもWebブラウザの基本機能となるよう標準化議論が進められています。

縦書きWeb普及委員会は上記のW3Cの標準化議論に日本からの貢献を行うとともに、縦書き等の日本語固有の表現を利用したWebコンテンツの普及促進に取り組んでいます。

| Twitter | Facebook | Google Plus