Webページの文章を読みやすくするために

2004年3月 1日

「エディトリアル・デザインはウェブ・デザインの夢をみるか」（wellinton's blog）に基本的に同感（行長＆字数制御の必要性は特に！）で、読みにくいWebページはまだかなり多いと思います。人文系の長文だけでなく、技術系の翻訳モノにも読みにくいWebページが多い印象がありますね。InDesignの師匠（笑）に組んで頂いたフォーマットで紙媒体データを制作する仕事が最近続いているのですが、しっかりした版面設計を見慣れたあとにWebサイトを見ると、正直いろいろと辛いものがあります。

ユニバーサルデザイン志向という理念だけでなく、閲覧環境（Webブラウザ＆表示デバイス）の多様性に対応しきれないという現実からも、この問題に対する決定的な解決策は見つかっていません。ですが、それを言い訳にして、読みやすさの実現を最初から放棄しているような印象も受けます。ある程度の決め打ちを含めて、一般的（これが困難...）な環境での読みやすさは、もっと追求されてしかるべきだと思います（アクセシビリティに関しては、プレゼンテーションとデータの分離によって保持すべきというのが持論です）。

読みやすさを改善するためには、「CSSにおける国際的レイアウト」のように、読みやすいデザインを実現するための仕様／技術を拡張することがまだまだ必要だと思います。またそれだけでなく、いわゆるエディトリアルデザインを専門にするデザイナーが、Webの世界にもっと出てくるべきでしょう。もちろん紙媒体からの転身であるか、電子媒体育ちであるかは問わず、です。

その一方で、デザインだけで読みやすさを改善するのはやはり限界があります。その意味で、読みやすいWebページを実現するためには、テキスト側にも電子媒体にあわせた工夫が必要となります。紙媒体でのライティング習慣を電子媒体にそのまま持ち込んでも、読みやすさにはつながらないのです。「簡潔に！（ウェブの文章作法）」（Alertbox）のようなWebページ用ライティングの必要性は以前から訴えられていますが、具体例を元にしたWebページ用のライティングガイドラインがそろそろ必要なのかもしれません。

ちなみにこのサイトでは、以下のポイントを意識するようにしています。このくらいがテンポ的にも良さそうという判断なんですが、いかがでしょう？

• 読点（、）の数は、1文あたり最大で3個までにする（複雑な依存関係の文章は分割して、接続句で対応する）。
• 1段落（パラグラフ）は4〜5文で構成し、CSSを利用して段落間に適度な空きを確保する。
• 文章の数が少ない場合でも（標準想定閲覧環境での）行数が多くなってしまった場合は、できるだけ段落を改める（7〜8行がリミット）。
• 4〜5段落ごとに、見出しを付ける（または何らかの休みを入れる）。
• 情報の構成にあわせて、ul（並列）やol（順列）などのリスト要素を適宜活用する。

つまり、「段落の持つ意味合いを紙媒体と電子媒体で分ける」ことこそ、Webページ上で読みやすいテキストを実現するための最重要ポイントではないか？ということです。段落の役割として（厳密な）意味のまとまりを伝えるよりも、読むためのまとまりやテンポを与える機能を重視することで、Webページの読みやすさは大きく改善されるのではないでしょうか。