ホームページの上部に並ぶ「レッスン内容」「料金」「お問い合わせ」などの案内は、作ったときのまま使い続けていることが多い部分です。
サービスやページが増えるうちに、初めて訪れた方がどこを押せばよいか迷う並びになっていないか、気になっている方もいらっしゃるでしょう。
設定を変える前に公開中のページで何を見ればよいか、項目名、並び順、移動先、スマートフォンでの開き方まで順番に整理しました。
メニューはページを移るための案内
ホームページの上部に並ぶ言葉の一覧は、メニューと呼ばれます。訪れた方はここを見て、知りたい情報がどのページにあるのかを判断します。
見た目を整えることに加えて、どんな項目がどの順番で並び、それぞれ何と書かれているかが分かることも大切です。
項目を足したり削ったりする前に、今のメニューがどう動いているかを確かめておくと、直すべき点を見誤りにくくなります。
変更前に、今のメニューの動きを見る
最初に、公開中のホームページを訪問者と同じ画面で開きます。管理画面から確認を始めると、実際のページで起きていることを見落としやすいためです。
パソコンでは、上部に表示される項目を左から順にメモしておきましょう。ロゴや事業名を押したときにどのページへ移るかも、あわせて確かめておくと安心です。
スマートフォンでは、メニューが三本線のボタンなどに折りたたまれていることがあります。その場合は、押す前と押した後の画面を両方見てください。
端末によって見え方が変わることもあるので、確認した端末と日付を短く残しておくと、あとで比べるときに役立ちます。
料金やプロフィール、お問い合わせなど、内容の違うページでも同じメニューが出ているか、途中で項目が欠けていないかも見ておきたいところです。
この段階の作業は、気づいたことをメモに残すところまでです。設定の変更は、見直す点がひととおり出そろってからにします。
読者が探す順番から項目を並べる
メニューの並びを運営側の作業の区分で決めると、初めての方には分かりにくくなることがあります。見直すときは、訪れた方が何を知りたいかを起点に考えてみてください。
小さな教室やサロンなら、内容を知る、料金を確かめる、場所を見る、質問する、という流れがひとつの目安になります。実際の動き方は人それぞれですが、並びを考える土台としては使いやすい順番です。
次に、今の項目ごとに移動先を一つずつ書き出します。似た項目が同じページへつながっていれば、二つに分けておく理由があるかを考える材料になります。
反対に、一つの言葉から内容の違うページへ分かれているなら、初めての方でも迷わず選べる言葉かどうかがポイントです。
上部に置くのは、よく探される入口だけでも大丈夫です。詳しい情報は、移動先のページからたどってもらう形もあります。
運営する側が見てほしいページと、読者が最初に探すページを分けて書き出してみると、両者の違いが見えてきます。並べて比べることで、それぞれの項目を上部に残す理由も整理しやすくなるでしょう。
押した先が想像できる項目名にする
メニューの項目名は、短さに加えて、押した先の内容を想像できることがポイントです。
「ご案内」「詳しくはこちら」のような言葉が複数並ぶと、それぞれの違いが伝わりにくくなります。「レッスン内容」「料金」「アクセス」のように、移動先の中身が見える言葉になっているかを確かめてみてください。
メニューには短く内容の分かるラベルを付ける考え方がおすすめ。読者が案内の役割を理解できるかを確かめる手がかりとして、参考にしやすい考え方です。
項目名を読んだら、実際にリンク先を開き、ページの主な見出しと項目名が大きくずれていないかを見ます。
古いサービス名が残っていたり、「料金」を押すと予約ページだけが表示されたりする場合は、項目名と移動先のどちらを直すのかを分けてメモしておきましょう。
項目名だけを紙やメモに書き出し、初めて見る人になったつもりで読んでみる方法もあります。写真や色から離れて言葉だけを見ると、似た言葉が重なっている箇所に気づきやすくなります。
「講座」と「レッスン」のように似た言葉が並ぶ場合は、それぞれの違いを短く説明できるか考えてみてください。移動先に、初めての方が選び分けられるだけの情報があるかも確認しておきたいところです。
迷う項目は、すぐに消さず、誰がどんな場面で使うのかを一行添えておきます。使う場面をうまく説明できない項目は、上部に置き続けるかどうかを考えるきっかけになります。
現在地と戻り道を確かめる
メニューは、別のページへ移った後にも使う案内です。
料金ページからプロフィールへ、プロフィールからお問い合わせへ、というように二つか三つのページを続けて開き、毎回同じ位置でメニューが使えるかを見てみてください。
今開いているページの項目に色や印が付く場合は、それが現在地の目印になります。W3Cの解説も、メニューの中で現在のページを示すことが、訪れた方の位置の把握に役立つと案内しています。
目印が色の違いだけで表されているときは、ほかの方法でも現在地が分かる作りにできるか、制作を担当した方に相談してみる方法もあります。
表示のしかたは、ホームページの作成サービスやテーマによって異なります。
ロゴや事業名が、トップページへの戻り道になっていることもあります。見た目だけでは押せるかどうか分かりにくいので、実際に押して確かめておくと確実です。
スマートフォンでメニューを開いて閉じる
小さな画面では、上部のメニューが折りたたまれていることがよくあります。画面の幅が変わって一部の項目が隠れる場合でも、表示される項目の順番、言葉、移動先をそろえておきましょう。
パソコンで見たメニューと同じ案内になっているかを意識しながら、次の順に試してみてください。
メニューを開くためのボタンがすぐに見つかるかを確かめます。三本線のアイコンなど、形はホームページによって違います。
一度押して、項目が表示されるかを見ます。パソコンで見たときと並び順や言葉が大きく違っていないかも、ここで確かめておきましょう。
もう一度押すか、閉じる印を選んで、元の画面へ戻れるかを試します。
項目の下にさらに項目がある場合は、親の項目を押したときにページへ移るのか、下の項目が開くのかを見ておきます。
隣の項目を押し間違えやすくないか、指で選んで目的のページへ移れるかが最後の確認点です。
階層のあるメニューについて、マウスだけでなくキーボードでも操作できることや、下の階層のページへ別の経路からもたどれるようにしておくのも大切です。
たとえば、親の項目のページにも下の階層へのリンクを載せておく方法があります。
技術的な修正まで自分で行う必要はありません。開かない、閉じられない、押した先が予想と違うなど、起きたことをそのまま記録しておけば、作成サービスの案内を調べるときや、制作を担当した方へ相談するときの材料になります。
確認できるのは手元の端末での結果なので、端末とブラウザの名前を書き添えておくと、相談するときに状況を正確に共有できます。
修正候補を一つずつ分ける
確認した結果は、次の四つに分けて整理します。一つの項目に複数の問題が重なっていても、分けておけば一つずつ直しやすくなります。
| 分類 | 書き残しておくこと |
|---|---|
| 項目名 | 今の言葉と、移動先のページの見出し |
| 並び順 | 誰がどんな場面で何を探すか |
| リンク先 | 今の移動先と、本来つなぎたいページの候補 |
| 操作 | 端末、ブラウザ、確認した日時、起きた動き |
記録には、作業に必要な情報だけを残します。お客さまの名前やお問い合わせの内容は書き込まずにおきましょう。
実際に直すときは、一度に多くの項目を変えるより、一つ直すたびにパソコンとスマートフォンで同じ動きを確かめる進め方が安心です。
変更前の状態をメモしておけば、思ったとおりにならなかったときにも元に戻しやすくなります。
編集する場所は、使っている作成サービスやテーマによって異なります。具体的な手順は、利用中のサービスの公式案内や、制作を担当した方に確認してください。
まとめ
メニューの見直しは、設定を変える前に今の動きを確かめるところから始まります。
- パソコンとスマートフォンで今のメニューを開き、気づいたことを記録する
- 読者が探す順番から、項目の並びを考える
- 押した先が想像できる項目名かを、リンク先と照らし合わせる
- 別のページへ移っても、現在地と戻り道が分かるかを見る
- 直すときは一つずつ、変更のたびに動きを確かめる
ホームページやSNSの案内を一人で整理しにくいと感じたときは、ライフデザインアカデミーの対面講座や個別サポートも選択肢のひとつです。詳しくは講座一覧ページをご覧ください。
ライフデザインアカデミーでは、プロフェッショナル講師による各種講座を開講しています。対面講座からオンライン講座まで、学習環境に合わせて受講できます。
→ 講座一覧とお申し込みはこちら
上記に掲載していない限定講座（非公開講座）も定期的に開講していますので、学びたいことのご相談はお問い合わせよりお気軽にご連絡ください。
