ホームページの情報は何から載せる?読者の用事に合わせて順番を決める方法

載せたい情報が多いときは、読者が何をしたいかを決め、その判断に必要な説明・条件・準備・行き先を先に結びます。別の用事に必要な情報は、消す前に案内先を確かめます。
小さな会社のWeb担当者に向け、情報の書き出しから、同じ原稿の二つの並び方、別ページへ移す判断、画面での確認まで説明します。読み終えると、一つのページで何を先に置き、何を確認待ちにするか決められます。
設備保守の会社と二つの案は架空の説明例です。実際の利用者の理解、問い合わせ、公開や改善の結果を示すものではありません。

この図の内容を文章で読む
問い:情報が多い原稿から、何を先に決める?
答え:読者の用事と、対象・条件・準備・窓口を対応させてから並べる。
架空のサービス原稿と、読者の用事を示す具体的なメモの対応。
まず、読者がこのページで済ませたい用事を決める

この図の内容を文章で読む
問い:読者の用事に必要な情報はどれ?
答え:機器が対象かを知るには対象と地域確認、相談前の準備には写真と窓口を結ぶ。
2つの用事と4項目の対応。地域は問い合わせで確認のまま。
情報の順番を決める前に、このページへ来た人が何を確かめ、次に何をしたいのかを一文で書きます。会社が伝えたいことを一覧にするだけでは、読み手が対象かどうか判断する前に別の話へ移ってしまうためです。
ここでは、設備の保守相談を受ける架空の小さな会社を例にします。訪問者の用事は「自分の機器が対象か、相談前に何を用意するかを確かめる」ことです。会社の担当者は、原稿に対象の機器、写真の準備、対応地域の確認方法、窓口、会社の沿革、採用案内を載せたいと考えています。
これは説明用の架空の原稿です。機器の種類、対象地域、写真の枚数や受付時間はこの例では確かめていません。実際の会社の条件として補わず、担当者に確認してから記入します。
判断に必要な情報を、用事と結び付ける

この図の内容を文章で読む
問い:読者の判断に必要な情報と別の用事をどう分ける?
答え:点検対象と地域確認、写真準備と窓口を相談の用事へ結び、沿革と採用は別の用事として残す。
相談の対象・条件・準備・行き先と、別用途の沿革・採用を見分ける。
訪問者が「相談してよいか」を考えるときは、点検対象と対応地域を確認する方法が必要です。「相談する準備をしたい」なら、写真についての案内と担当窓口が必要です。対応地域は「問い合わせで確認」とする材料なので、地域名を推測して書きません。
掲載内容を次の三つに分けると、順番を決めやすくなります。①その用事に答える説明、②判断や準備に欠かせない条件、③別の用事や、詳しく知りたい人のための補足です。条件は短く省略できても、判断できなくなるほど離したり削ったりしません。
実際には複数の訪問目的があります。採用情報を探す人にとって採用案内は必要です。今回のサービス相談を主目的にしたページで後ろに置くことと、サイトから消すことは別の判断です。
同じ六つの材料で、二つの順番を比べる
同じ六つの材料が、各画面のどこに置かれているかを見てください。①対象、②地域の確認、③写真の準備、④窓口の順に探す経路の一例を、二つの画面案へ重ねています。


会社情報が先の案では、対象・地域確認・写真準備・窓口が離れた位置にあります。相談情報が先の案では、この四項目を続けて置き、沿革と採用も別の用事の入口として残しています。線は説明上の探し方の一例で、実際の視線や試験結果、優劣を示しません。対象の具体的な機器、地域、写真の条件などは確認が必要です。
次は同じ架空原稿から作った二つの案です。Aは沿革と採用案内から始まります。Bは点検対象、対応地域の確認、写真の準備、窓口を続け、その後に沿革と採用案内を置きます。どちらも六つの材料を残しています。
案A:会社の情報から始める
- 会社の沿革
- 採用案内
- 点検対象の機器
- 担当窓口
- 相談前に用意する写真
- 対応地域は問い合わせで確認
案B:相談する人の用事から始める
- 点検対象の機器
- 対応地域は問い合わせで確認
- 相談前に用意する写真
- 担当窓口
- 会社の沿革
- 採用案内
案Bを原稿にするときは、見出しだけ並べて終わりにせず、それぞれに何を書くかも確認します。次は説明用の下書きです。角括弧の中は確認が必要な項目で、会社の条件として決まった内容ではありません。
案Bの原稿の置き方(架空の下書き)
点検対象の機器:[担当者に対象を確認して記入]
対応地域:お問い合わせで確認してください。
相談前に用意する写真:[必要な写真を担当者に確認して記入]
担当窓口:[窓口の案内先を確認して記入]
ほかの用事:会社の沿革・採用案内への入口を確認します。
たとえば対象の機器をまだ確認できなければ、その部分は確認待ちのまま担当者に戻します。沿革や採用の案内先も、この例ではまだ確認されていません。順序の案と、掲載してよい原稿が完成した状態は別です。
Bでは、対象かどうかを考える説明と、準備・窓口が近くにあります。Aでも目的の情報は存在しますが、対象と地域確認が離れているため、順番を見直す理由が見えます。これは二つの紙上の案の比較で、実サイトの変更前後や利用者テストの結果ではありません。どちらが実際に使いやすいかは、確認するまで分かりません。
補足と別の用事は、行き先を残して移す

この図の内容を文章で読む
問い:採用案内や沿革は消してよい?
答え:別の用事として案内先を残し、判断前に必要な条件は失わない。
サービス案内内の対象・地域確認・準備・窓口と、沿革・採用の別入口。行き先は案であって実URLなし。
ページから情報を減らすときは、まず「誰のどんな用事に必要か」「別のページや入口で見つけられるか」を確かめます。沿革や採用案内は、サービスの条件と同じまとまりに並べる必要がない場合でも、探す人に届く入口を残します。
たとえば、サービス相談の案内では対象・地域確認・準備・窓口を一続きに置き、会社情報や採用はそれぞれの案内へつなぐ構成を検討できます。これは構成案です。実際の別ページやリンク先が存在するかは、この架空原稿では未確認です。移す前に担当者と内容・移動先・入口を確認してください。
同じ説明が複数の場所にあるときは、必要な条件を一方に集め、もう一方から案内する方法もあります。ただし、費用や対象など判断前に必要な説明を、リンク先にしか置かず見落とす状態にしてはいけません。元の説明を確認し、必要な範囲を残します。
確かめられていない条件は、担当者に戻す

この図の内容を文章で読む
問い:並びを決めても未確認の内容はどう扱う?
答え:確認済みの材料と記録のない条件を区別し、対象・写真・窓口の詳細を担当者に確かめる。
「対応地域は問い合わせで確認」の原文と、機器種類・写真枚数・受付時間の未確認を区別した資料。
順番が決まっても、原稿の内容が確定したとは限りません。点検対象の機器、対応地域、相談前の写真、窓口の案内を、それぞれ誰が確認できるか書き出します。地域は問い合わせで確認という現在の説明を維持し、機器の種類や写真の必要枚数など、記録のない条件を勝手に加えません。
確認を頼むときは「どのページの、どの説明を、何の判断に使うか」を示します。たとえば「対象の機器の説明を先に置きたい。現在の原稿で相談対象を判断できるか確認したい」と伝えると、順番の意図と残る不足を同時に共有できます。確認を依頼したことと、内容が承認されたことは分けて記録します。
画面と利用者の用事で、並べた案を確かめる

この図の内容を文章で読む
問い:並べた案を何で確認する?
答え:目的を渡し、対象・地域確認・写真準備・窓口を探せるか観察し、見つかった事実と理由の仮説を分ける。
画面案・読者の用事・確認メモの対応、未試験は未確認。
完成案は、パソコンとスマホで同じ内容を追えるか確かめます。対象、地域の確認、写真の準備、窓口の見出しを順に読み、リンクがある場合は行き先が正しいか確認します。狭い画面で条件が隠れる場合は、文字を小さくする前にまとまりや順序を見直します。
利用者に試してもらえる場合は、たとえば「自分の機器が対象か、相談前に何を用意するか調べてください」と用事を渡します。見つけた場所、読んだ説明、途中で迷った点を観察し、「なぜ迷ったか」は推測として別に書きます。質問や観察は、実施した範囲の記録です。少数の反応を全員の行動や問い合わせ増加の証明にはしません。
画面確認や利用者による試し読みをまだ行っていなければ、結果は未確認です。画面案を見ただけで公開済み・使いやすさ確認済みとはしないでください。複数の用事がある場合は、それぞれの入口と、行き先から戻れるかも確認します。
まとめ:一つの用事と、その判断に必要な情報を結ぶ

この図の内容を文章で読む
問い:最初の一歩は何をすればよい?
答え:1ページの読者の用事と、その判断に必要な情報を一つずつ対応させる。
対象・地域確認・写真準備・窓口を、架空の相談という用事の近くに整理する原稿の具体例。
読者の用事を一つ選び、その判断に必要な説明・条件・準備・行き先を先に結びます。同じ材料で別の並びを作り、条件が離れていないか比べます。別の用事に必要な情報は入口を残し、未確認の条件は担当者へ戻します。
今日の最初の一歩は、見直したいページを一つ選び、「このページで読者が済ませたい用事」と、判断に必要な情報を紙に書き出すことです。その対応ができたら、今の順番と並べたい案を見比べてください。
出典と、この例の範囲
情報の順序は、英国統計局:利用者の必要に合わせたコンテンツ設計、Nielsen Norman Group:情報の優先順位、同:ページ内リンク、W3C:見出しとページ構造を参考にしています。英国のサービス向けの指針を日本の会社への法的義務や、この架空例の検証結果にはしていません。
仕事の流れから、顧客との接点まで。
一体で見直す、最初の一歩を。


