Webデザインは「文字」ではなく「関係」を設計している
描画される形は、日本語「あ」や英語の「a」といった何らかの記号だ。
文字はフォントによって形を変え、黒や赤といった色情報によって知覚されるものも異なってくるだろう。
一方でWebサイトにおける文章表現の多くは、見出しやタイポグラフィ、画像文字を除き、同一のフォント、文字色、スケールで描画されることが多い。
つまり、Webサイトの本文は、ほとんどの場合同じフォント、同じ文字サイズで表示される。
その中で我々は、発話者が誰であるか、どのようなニュアンスで何を説明しているかを文脈から読み取っている。
裏返せば、設計者がユーザーが読み取るだろうと判断している部分もあるだろう。
その場合において、設計者が取りうる一般的なデザイン手法は、文脈の付近に画像を設置するといったものである。
たとえば、スタッフの顔画像の横に文章を設置するとか、ビルの画像の横に文章を設置するとかである。
これは既に社会的な規範としてユーザーに認知されているから、それに違和感を覚える者は多くないだろう。
だが、私はこの構造に対して、それが最良であるという認識を持てないでいる。
なぜなら、テレビゲームでは違う。キャラクターが話し、声があり、その発話は明確に「誰のものか」が分かる。
テレビゲームでは既に体験として発話者が固定された手法を利用し、文章だけではなく音声としての表現に昇華しているからだ。
それに比べると、Webの文章は「誰の声なのか」が曖昧なまま流れていく。
本記事では、Web制作という制約を前提に表現手法としてどのように発展させて行くかについて考察する。
文字の制約
Webサイトにおける言語記号には制約がある。
この制約が現実世界と大きく異なる。
我々が日常的に用いる何らかの文章というのは、発話者によって記号の差が生じる。
記号の差を見て、この文字は誰が書いたか、どの年齢層が書いたか、どの性別が書いたかなどある程度の推測をするだろう。
Webサイトはフォントの指定が出来る一方で本文のフォントの指定は大体の場合は同じだ。
body直下に置かれる文字も、スタッフの声で置かれる文字も基本的には変わらない場合が大多数となる。
こういった制約の主だった要因として、
1.Webフォントの多様はページ読み込み時の負荷が生じること
2.日本語フォントは英数字や平仮名、片仮名、漢字など種類が多いこと
3.画像文字は検索エンジンに読まれないこと
などがある。
この場合において、本文のフォントを変えないことは設計において合理である。
合理であるが故に変える理由にもならない。
変えるためには最もらしい説明が必要であるし、その説明をするにもコストが生じる。
だから、この制約については受け入れて話を進めよう。
発話者は誰か？
前述のように、Webでは文字そのものを大きく変えることは難しい。
さらに、言葉の意味は文脈や受け手の解釈に依存するため、文章だけで「誰が話しているか」を明確にするのは簡単ではない。
たとえば、スタッフインタビューのように、ひとつの文脈で完結している場合は、発話者をある程度固定できる。
しかし、Webサイトではセクションごとに文脈が分かれることが多く、ひとつのページの中に複数の「声」が混在する。
一般的なコーポレートサイトであれば、大きく次のように分けられるだろう。
・人（スタッフの声など）
・概念（会社概要など）
・システム（エラーメッセージなど）
ここで少し不思議なことがある。
会社そのものが話しているわけではないし、システムも本来は発話主体を持たない。
それでも私たちは、「これは説明だな」「これはシステムのメッセージだな」と自然に理解している。
これは誰かに教わったわけではなく、これまでの経験の中で身についた読み取り方だ。
文章の長さや位置、操作との関係などから、無意識に「誰の声か」を判断している。
一方で、テレビゲームではこの構造がかなり明確になる。
キャラクターが話すときは、顔や名前とともにテキストが表示され、音声も伴う。
説明はナレーションとして区別され、エラーや制限は短いメッセージや効果音で示される。
発話者ごとにインターフェースが分けられているため、「誰が何を言ったか」が自然と整理される。
この違いが、情報の理解しやすさや没入感に影響しているのかもしれない。
Webサイトにおける表現方法の難しさ
では、ゲームのような表現をそのままWebに持ち込めるだろうか。
結論から言えば、それは簡単ではない。
ゲームは、画面の流れや視点がある程度コントロールされた状態で進む。
一方でWebサイトは、ユーザーが自由にスクロールし、クリックし、ページを移動する。
この違いは大きい。
たとえば、ゲームではキャラクターの会話は専用の枠の中に表示される。
名前や顔、音声とともに、「誰が話しているか」が明確になる。
では、これをWebで再現しようとするとどうなるか。
モーダルのように、画面の一部を切り出して表示する方法が考えられる。
しかし、この方法には別の問題がある。
モーダルは基本的に、クリックなどの操作をきっかけに表示される。
つまり、「何をすれば次に進めるのか」がユーザーに伝わっていないと成立しない。
もしページ内の多くの要素がモーダルを開く仕組みになった場合、それぞれの要素がどのような意味を持っているのかを理解する必要が出てくる。
これは、単に情報を読むのとは別の負荷になる。
ゲームでは、プレイヤーは操作の流れを自然に理解できるように設計されている。
「次に何をすればいいか」が、体験として提示されるためだ。
しかし、Webではこの流れを維持するのが難しい。
そのため、部分的にゲームの表現を取り入れたとしても、同じような体験を再現することは簡単ではない。
こうした制約を考えると、Webサイトにおいて「誰が話しているのか」を明確にすること自体が、そもそも難しい問題であると言える。
文脈は「文字の外側」で作られる
ここまで見てきたように、Webでは文字そのものを大きく変えることは難しい。
また、発話者を完全に固定することも容易ではない。
では、どうすればよいのだろうか。
ひとつの考え方として、文字そのものではなく、「周囲との関係」で意味を作る方法がある。
たとえば
・どの位置に置かれているか
・前後にどのような情報があるか
・どのような余白や区切りがあるか
同じ文章でも、これらの違いによって受け取り方は大きく変わる。
私たちは文字そのものを読んでいるようでいて、実際にはその周囲の情報も含めて意味を解釈している。
つまり、Webにおける表現は、文字の装飾だけではなく、配置や構造によって支えられているとも言える。
この視点に立つと、発話者を明確にするための方法も変わってくる。
誰が話しているのかを示すために、必ずしも顔写真やアイコンが必要とは限らない。
むしろ、情報のまとまりや配置の仕方によって、「これは誰の声なのか」を自然に伝えることができる場合もある。
だからデザインは何をするのか
ここまで、Webにおける「誰が話しているのか」について見てきた。
一見すると小さな違いのように思えるかもしれない。
しかし実際には、この曖昧さが体験全体に影響を与えている。
近年、さまざまな場面で「人の代わりにシステムが対応する」機会が増えている。
Webサイトにおいても例外ではなく、多くのやり取りがシステムを通じて行われる。
その中で表示されるメッセージは、単なる情報であると同時に、「何かを求められている言葉」として受け取られることもある。
同じ内容であっても、それが人の言葉として伝わるのか、システムの処理として提示されるのかによって、受け取り方は変わってくる。
書物であれば、読み進める中で自然と語り手の文脈が立ち上がる。
一方でゲームは、発話者を明確に分離することで体験を作っている。
Webはそのどちらとも異なる。
だからこそ、単に文章を配置するだけではなく、「この言葉は誰のものなのか」を含めて設計する必要がある。
文字の見た目を整えることだけがデザインではない。
どの言葉がどこに置かれ、どのような関係の中で読まれるのか。
その構造を整えることが、Webにおけるデザインの役割のひとつではないだろうか。