かつてのWeb サイトは、見る・読むといった受動的な行為が主体でしたが、今日では、ネット環境の向上やスマートフォンなどの台頭などによって、買い物をする、SNS に投稿する、グルメ情報を探すといった、ユーザが能動的にサイトを「使う」という場面が増えてきました。それに伴い、より操作しやすく使いやすいサイトを求める声が高くなってきています。
使いやすさとは、たとえば「ユーザが快適に操作をおこない目的の情報に対して迷わず快適に辿り着いてもらうこと」を指します。使いやすい情報の配置を考え、どこに何をどのように配置したら良いのかを決めて実現するのがデザイナーの役割です。
調べやすい・分かりやすい情報表現のためには、情報の構造化が必要です。難しいようにも聞こえる言葉ですが、私たちは日常的に構造化された情報を目にしています。たとえばこのサイトも、単に文章が並んでいるだけではなく、各教程の表紙・大見出し・中見出し・本文に分かれています。大見出しには数字が振られていることで、今自分がどのへんを読んでいるのかが分かりやすくなっています。これが情報の構造化です。
不便にしてやろう、と考えて設計している製作者はいません。ところが残念ながら、サイトやアプリを操作するときに「あれ？」と感じる場合があることも事実です。
こうしたケースを普段から収集し、改善ポイントを考える訓練をしましょう。
情報を整理する方法はいくつかあります。ここではまずリチャード・S. ワーマンが提唱する「情報の組織化手法」のLATCHモデルについて紹介します。LATCHとは、Location, Alphabet, Time, Category, Hierarchyの頭文字を並べたものであり、情報の組織化の方法は全てこれらのどれ かに当てはまるという考え方です。具体的に日本語に直すと以下のようになります。
たとえば“Location”は都道府県順、“Alphabet”はあいうえお順、といった解釈ができるでしょう。場所を探したり、自分の情報を入力するときに、どのように情報がまとめられて表示されていると便利かを考えてみましょう。
実装側の情報設計という点では、コードのメンテナンス性と結びついている部分もあります。
たとえばコンポーネント化やアトミックデザインなどと呼ばれる、いわゆる「パーツ化（グループ化）」をしておくことで、BEMというCSSの命名規則と相性のよいコード＝メンテナンス性の高いコードを実現できます。また、何度も同じパーツが規則的に登場することで、ユーザーに対しての使いやすさを向上できます。
サイト全体に共通して表示されているナビゲーションです。通常はサイトの上部に横一列か、左右のどちらかに配置されることの多いメニューです。
特定のカテゴリ（ディレクトリ）にのみ表示されるナビゲーションです。グローバルナビゲーションが横一列であれば縦に配置され る場合が多いものの、情報量の多いサイトではこの限りではありません。
コピーライト表記やロゴ、住所などのほかに、サイトの下部のフッタ部分がナビゲーションになっているものも多くあります。フッタがナビゲーションになっていることで、一度ページをスクロールしたあとに再度別のコンテンツへアクセスする可能性が高まります。
ページの階層が深くなっていくにつれて、元の階層に戻ったり、今いる階層がわからなくなることがあります。そこで「パンくずリスト」で階層へのリンクを示すことで、地図としてのナビゲーションの役割を果たします。
タップやクリックして「押す」ことで、次のページに移動したり、入力した内容を送信したりといったさまざまな行動を実行するため のUI です。
ユーザに対して、それがボタンだと認識させるにはいくつかのテクニックが必要になります。一般的なものとしてはボタンの角を丸く したり、陰影をつけたり、マウスホバーしたときにアニメーションさせるテクニックなどが知られています。
LP（ランディングページ）などにおいては成約のためのボタンはとりわけ目立つ位置に固定されていたり、アニメーションで目立つように工夫されているケースが多いです。