あなたが避けなければならない10の一般的なウェブサイトナビゲーションの間違い

より良いユーザーエクスペリエンスの提供

必要な情報をどこで見つけるかについて混乱しただけで、Webサイトやオンラインストアにアクセスしたことがありますか？ さらに悪いことに、オンラインで請求書を支払う、特定の製品を購入するなど、意図したタスクを実行できませんでしたか？ 残念ながら、これはより一般的になっています。 彼らの仕事を際立たせるために、多くのウェブデザイナーはメニューデザインで創造的になり、一般的なウェブサイトナビゲーションの間違いにつながります。

Webサイトのナビゲーションは、サイトのデザインで最も重要な要素の1つです。 訪問者は、ナビゲーションを使用してWebサイトを移動し、探している情報をすばやく見つける必要があります。

ナビゲーションが混乱したり、ユーザーがつまずいたりすると、ユーザーがイライラしてサイトから完全に離れてしまうリスクがあります。 簡単に言えば、ウェブサイトのナビゲーションは簡単で直感的でなければなりません。 これらの特性を実現するために、回避しなければならない10の一般的なWebサイトナビゲーションの間違いについて概説します。

一般的なウェブサイトのナビゲーションの間違い

1.ナビゲーションでクリエイティブになる

あなたは多くのデジタルマーケティングのブログやウェブサイトを通過した後、あなたのビジネスのウェブサイトを作成することに決めたかもしれません。 あなたが出くわしたかもしれないアドバイスの1つは、オンラインマーケティングの取り組みとは異なり、創造的であるということです。 しかし、あなたのウェブサイトのナビゲーションに関しては同じことは当てはまりません。

ナビゲーションルールブックはありませんが、いくつかの慣行が非常に一般的になり、人々は今ではすべてのWebサイトでそれらを期待しています。 たとえば、垂直方向のナビゲーションバーを左側に配置するか、水平方向のナビゲーションバーをWebページの上部に配置する必要があります。 残念ながら、何か違うものは訪問者を苛立たせ、バウンス率を上げる可能性があります。

2.ナビゲーションメニューを非表示にする

ミニマリストのデザインは、ウェブサイトの間でますます人気が高まっています。 このようなWebサイトでは、ホームページに会社/ブランドに関連する大きな高精細画像のみが掲載されており、可能な限りいくつかのオプションがあります。 しかし、物事を最小限に抑えるために、多くのWebサイトは、主にハンバーガーアイコンの下にナビゲーションを隠しています。

モバイルの画面は小さいため、この方法はモバイルWebサイトでは受け入れられますが、デスクトップWebサイトでは避ける必要があります。 Nielsen Norman Groupの調査によると、ハンバーガーアイコンは、表示されているナビゲーションバーよりも使用されておらず、主にモバイルWebサイトで好まれています。

ここにあなたが覚えておきたいかもしれないもう一つの事実があります。 45歳以上のユーザーの52％だけが、ハンバーガーアイコンの意味さえ知っています。 したがって、その人口のほぼ半分にとって、これらの3つの小さな線はまったく意味がありません。 純粋な好奇心がない限り、クリックする可能性はほとんどありません。

したがって、Webサイトに3つの小さな行を組み込むことを決定する前に、その影響を必ず検討してください。 モバイルデバイスを使用する可能性が高い若いユーザーには問題はありません。 ただし、高齢の消費者や主にデスクトップやラップトップを使用する消費者をターゲットにしている場合は、彼らのニーズを予測する必要があります。 たとえば、アイコンの横に「メニュー」という単語を含めると、エンゲージメントが高まります。

3.オプションが多すぎます

選択できるオプションを15個与えると、7個または8個のオプションしか与えなかった場合よりも選択に時間がかかります。 したがって、誰かが行うことができる可能な選択が少ないほど、それらの選択をより迅速に評価して決定することができます。

残念ながら、Webサイトのナビゲーションに関しては、多くの企業が、訪問者がすべてのページオプションにすぐにアクセスできるように、サイトのプライマリナビゲーションバーに可能な限りすべてを詰め込もうとしています。

ナビゲーションメニューに無限のオプションとリンクがあるWebサイトに出くわしたことがあるかもしれません。 残念ながら、過度に豊富なメニューは、ウェブサイトのナビゲーションについて可能な限り包括的にしようとする最も一般的な初心者の間違いの1つです。

コンテンツに簡単にアクセスできるようにすることは価値のある目標であるため、すべてのコンテンツへのリンクを設定することは良い考えのように思えるかもしれませんが、ナビゲーションリンクの過負荷は逆効果になります。 訪問者が利用可能なページをすばやく確認できるようにする代わりに、訪問者は選択肢の幅に圧倒され、次に何をすべきかを決定できなくなります。

4.間違ったオプション

サイトのナビゲーションを計画するとき、特にプライマリナビゲーションに何を残すか、サブセクションナビゲーションに何を移動するかを決定するときに、人々が犯すもう1つの間違いは、間違ったアイテムを切り取って、サイトの実際のオーディエンスにとって重要ではないリンクを残すことです。

Webサイトは、それを使用する人々のニーズに対応する必要があることを忘れないでください。 したがって、それらにとって重要なコンテンツまたは機能に焦点を当てる必要があります。

会社のCEOには、「社長からのメッセージ」のようなリンクが必要になる場合があります。 ただし、ターゲットオーディエンスがそのコンテンツを探していない場合、特にサイトの顧客にとって重要なリンクの代わりにコンテンツがそこにある場合は、ナビゲーション行にコンテンツを配置するのは誤った方向に進みます。

5.デバイス間の不整合

今日、人々はラップトップ/ PC、タブレット、スマートフォンなど、さまざまなデバイスを使用してWebサイトにアクセスしています。ラップトップ/ PCを介してWebサイトに定期的にアクセスするユーザーは、Webサイトをナビゲートすることに慣れています。 しかし、誰かがスマートフォンやタブレットからWebサイトにアクセスした場合、ナビゲーションエクスペリエンスはまったく異なり、混乱を招く可能性があります。

ほとんどのWebサイトは、さまざまなデバイスを使用する訪問者のナビゲーションの不整合を考慮していません。 デスクトップとモバイルのWebサイトにサブメニューを設定しても問題ありませんが、主要なコントロールとナビゲーションは、すべてのデバイスと画面サイズで同じである必要があります。 一貫性は、デバイスに関係なく親近感を提供します。

6.応答しない

現在、ユーザーはさまざまなデバイスや画面サイズからWebサイトにアクセスしています。 巨大なデスクトップモニターだけがWebコンテンツにアクセスする時代は過ぎ去りました。そのため、今日のWebで成功するには、サイトとそのナビゲーションがさまざまな画面に対応する必要があります。

ナビゲーションスキームは、大画面モニター専用に設計されていることが多すぎます。 その結果、タブレットや電話などの小さな画面ではナビゲーションが機能しなくなり、使用できなくなります。 したがって、Webサイトは、マルチデバイスサポートへの応答性の高いアプローチで構築する必要があります。

7.過剰なサブメニュー

サイトのプライマリメニューのオプションの数を編集していくと、サブメニューとしてより適切に表示されるリンクやページが見つかり始めます。 たとえば、プライマリナビゲーションには「OurCompany」のオプションがある場合があります。 このボタン/セクションの下に、サイトに必要であるものの、プライマリナビゲーションの配置を保証するほど重要ではない他のオプションがある場合があります。 これらには次のものが含まれます。

• 会社の歴史
• 首脳部
• 証言
• キャリア

これらのサブメニューを表示する方法の1つは、ドロップダウンまたはフライアウトメニューを使用することです。 トップレベルのリンクにマウスカーソルを合わせると、フライアウトメニューが表示されます。 このオプションは一般的ですが、いくつかの課題を提示する可能性があります。

たとえば、技術的に「ホバー」状態がないタッチスクリーンデバイスでは、ユーザーがリンクにアクセスできることを確認する必要があります。 また、3つ以上のレベルのフライアウトメニューは避けたいと思います。 他のフライアウトからのフライアウトを使用してメニューシステムをナビゲートするのは難しい場合が多いため、設計するサイトではこれらの扱いにくいメニューを避けてください。

8.一貫性のないナビゲーション

ナビゲーションメニューの使用方法を理解し、すべてがどこにあるかを理解したら、それを変更しないでください。 Webサイトは、メニューの反復ごとに、デバイス間で、どのページにあるかに関係なく、エクスペリエンス全体を通じて一貫したナビゲーションを行う必要があります。 サブメニューはページごとに変わる可能性がありますが、プライマリナビゲーションまたはメニューを石で設定する必要があります。

9.長いメニューラベル

サイトのナビゲーションオプションを編集して選択肢を少なくすることは不可欠ですが、残っている選択肢のテキストラベルが短くて甘いことも確認する必要があります。

「OurCompany」、「Company」、「About Us」、または「About」だけで問題がない場合は、「AllAboutOurCompany」というリンクは不要です。 この変更は大きな編集のようには思えないかもしれませんが、4語から1または2語に変更しました。

ナビゲーションバー全体でこのように編集すると、それらのリンクに適切なコンテンツを伝えながら、人々が処理しなければならないテキストの量を効果的に半分に減らすことができます。

10.間違ったトーン

すべてのウェブサイトにはトーンがあります。 そのトーンはルーズでフレンドリーかもしれません。 それは専門的で率直な、または他の可能性である可能性があります。 サイトのスタイルが何であれ、ナビゲーションの言語はそれを反映する必要があります。

ウェブサイトが親しみやすく役立つものである場合は、「サービス」というリンクよりも「どのように支援できるか」というリンクの方が適している場合があります。 サイトのメッセージのトーンを理解することで、そのトーンで一貫したナビゲーションを設計できます。

はい、この場合、最初のテキストは2番目のテキストよりもはるかに長く、この記事で提示されている他のヒントとは反対のようですが、目標は必ずしもテキストをできるだけ短くすることではなく、全体的に正しい選択をすることであることを忘れないでください。 選択肢には適切なテキストの長さが含まれますが、適切なトーン、オプションなども含まれます。

シンプルなナビゲーションが不可欠です

Webサイトのナビゲーションのデザインは、ユーザーエクスペリエンスを左右する可能性があります。 ナビゲーション構造が明確で使いやすいことを確認することで、訪問者がサイトでより多くの時間を費やし、訪問者に不可欠でビジネスに不可欠なコンテンツや機能に誘導できるようにします。

あなたのウェブサイトの訪問者が彼らが探しているものを見つけることができないならば、彼らは他の場所に行きます。 あなたが最も素晴らしいコンテンツ、製品、またはサービスを持っていても、訪問者がそれらを見つけることができなければ、それは何の役にも立ちません。 そのため、わかりやすくわかりやすいナビゲーションオプションを提供することが不可欠です。 お手伝いします！

より良いユーザーエクスペリエンスを提供する必要がありますか？

あなたのビジネスや製品ブランドのために信頼できるウェブサイトを作りたいですか？ 私たちのプロのデザイナーチームが喜んでお手伝いいたします。 しかし、最初に、私たちのポートフォリオを見て、私たちのケーススタディを読んでください。

それから、私たちがあなたのウェブデザインのニーズにぴったりだと信じているなら、話しましょう！ カスタムWebデザインと開発、eコマースソリューション、Webサイトの再設計、多言語Webデザイン、検索エンジン最適化、WordPress最適化など、ビジネスと製品ブランド向けの幅広いコンサルティングとデザインサービスを提供しています。

そして、プロのウェブデザインがあなたのビジネスにどのように役立つかまだわからない場合は、話しましょう！ 私たちのチームはあなたに耳を傾け、あなたの質問に答え、あなたがあなたのオンライン訪問者の信頼を得るのを手伝います。 結局のところ、それは私たちの専門の1つです！

あなたは訪問者があなたのウェブサイトをナビゲートするのを手伝っていますか？

訪問者はあなたのオンラインプレゼンスを信頼していますか？ または、潜在的な消費者が必要なコンテンツをすばやく簡単に見つけることを妨げる特定の要素はありますか？ 私たちの一般的なウェブサイトのナビゲーションの間違いに追加するものはありますか？ 多分あなたはあなたが共有できるあなた自身のいくつかの例を持っていますか？ または、好きなナビゲーションメニューの例を共有できますか？

次の投稿を見逃さないように、視聴者が私たちのフィードを利用して利益を得ることができるように、以下にコメントを残してください！ そして、この投稿を他のビジネスオーナーと共有することで、他のビジネスオーナーがより良いユーザーエクスペリエンスを提供できるように支援してください。

ありがとうございました！ 一度に1ピクセルずつ、悪いビジネスWebサイトを終了するためにあなたの助けに感謝します！

PixoLaboによる

あなたの平均的なWordPressウェブデザインエージェンシーではありません

@pixolabo