ブログの現代的なメニューを作成するためのヒント

ウェブサイトの適切な使用の特徴には、次のものがあります。

• モバイル応答性 ：ますます多くの人々が携帯電話を介してインターネットにアクセスしています（そしてGoogleは、これがモバイルイニシアチブの一環としての検索ランキングにとって重要であると考えています）。
• ページ読み込み速度 ：人々がウェブサイトをどのように操作するかとの相関関係を通じて、Googleからのさらに別の重要なランキングシグナル。 Kissmetricsによると、消費者の47％は、ウェブページが2秒以内に読み込まれることを期待しています。
• Webサイトのナビゲーション： Orbit Media Studiosによると、Webサイトが使いやすく、コンテンツが見つけやすい場合、検索エンジンからのトラフィックにプラスの影響があります。 Gerry McGovernは、特定のページへのリンクをクリックする方が簡単で速いため、70％の人が検索ではなくナビゲーションに依存していることを調査しました。ウェブサイトの。

このチュートリアルでは、メニューデザインとベストプラクティスの観点からユーザビリティに焦点を当てます。

サイト上でのナビゲーション

ウェブブラウジング は、サイトの内部リンクアーキテクチャを指す一般的な用語です。 とりわけ、その主な目的は、ユーザーがWebサイト上の関連コンテンツを簡単に見つけられるようにすることです。 ナビゲーション構造は、Webサイトのサイトマップの基礎にもなり、Googleなどの検索エンジンの巨人がそれに応じてWebサイトのインデックスを作成するのに役立ちます。

確かに、効率的なWebサイトのナビゲーションに貢献できることがいくつかありますが、今のところは特に メニュー、 これは通常、ユーザーが新しいWebサイトにアクセスしたときに最初に操作するページだからです。

メニュー内のナビゲーション

ナビゲーションメニューは、Webサイトの前面と中央に配置される傾向があります（比喩的に言えば、中央に配置されたメニューが便利です）。 さまざまなカテゴリのWebサイトの場合、ドロップダウン機能はスペースを節約し、分類の必要性を満たすためのオプションです。

今日では、ミニマリズム（およびモバイルの使いやすさ）のショーで、多くのWebサイトがハンバーガーメニューデザイン（基本的に、メニューをワンクリックで展開できることを示すXNUMX本の短い水平線のある正方形）を採用しています。 。

ストアフロントのテーマ WooCommerce 右上隅に実用的な例を示します。

ハンバーガースタイルのウェブサイトメニューデザインは、モバイルウェブサイトのデザインに関して最も人気があります。開発者は、非常に狭いスペースで使用可能なナビゲーションを作成する責任があるためです。 確かに、モバイルサイトで使用するためのドロップダウンメニューを作成するのは難しい場合があります。

それによると、多くのデザイナー 侮ります ハンバーガーメニューは、サイトナビゲーションを楽しく機能的にするための創造的な方法を見つけるための新しい動きにつながりました。 これを念頭に置いて、一般的なWebサイトのメニュー設計ヒューリスティックでは、メニューナビゲーションを各Webページの上部に永続的に配置して、ユーザーが簡単に移動したり、次のページを検索したりできるようにします。

メニューデザインのベストプラクティス

ほとんどの WordPress テーマには、事前定義された Web サイト メニュー デザインが付属しています。 現状を維持する場合でも、完全にやり直す場合でも、使いやすさと機能性を念頭に置いてメニュー ナビゲーションを設計するためのベスト プラクティスを次に示します。 SEO あなたのこころで：

• 可能であれば、ドロップダウンメニューを避けてください。 多くの Web サイトでは、スペースを節約できるという理由でドロップダウン メニューの使用を好みますが、特に次の点に関しては推奨されません。 SEO テクニカル。 ユーザビリティテストの結果、ほとんどの人がドロップダウンメニューを好まないことが判明しました。 これは、人間の目は手よりも早く機能するため、クリックする対象をすでに決めているのに他のものが落ちてしまうのを煩わしく感じ、特定のページへのアクセスが減少するためです。 とはいえ、デザインしているサイトにドロップダウン メニューなしでは対応できないほど多くのコンテンツがある場合は、「メガ ドロップダウン」メニューの方が多少受け入れられます。
• 説明的である。 「サービス」や「製品」などの一般的な単語を削除します。 代わりに、製品またはサービスの方法を指定してください 整合性のある、「一般的な言葉や「サービス」を備えた製品を実際に検索する人はいないからです。 さらに良いことに、メニュー項目の正確な名前を決定する前に、SEOキーワード調査で含めることを正当化してください。 OrbitMediaが推奨する説明的なラベルを使用するこれは、検索エンジンがサイトをクロールするときに、この方法がユーザーとあなたの両方に利益をもたらすためです。 ナビゲーションはすべてのページに表示されるため、業界に関連する用語を使用すると、本当に気にかけていることをGoogleに警告することになります。 特定のトピックに焦点を当てている限り、各ページをランク付けできることを忘れないでください。
• さらに、Orbit Mediaは落胆します ナビゲーションベース 上の フォーマット、 なので'組織 すべてのビデオ、すべてのインフォグラフィックなどのコンテンツベースのページ。 これは、人々が形式ではなくトピックで検索するためです。
• ナビゲーションメニューの項目の配置（またはレイアウト）は重要です。 「About」ページ、「Contact」ページなど、サイト訪問者が最も頻繁に検索するページであるWebサイトで提供するページの一般的なリストがあります。 これらの目立つページは、（はっきりと見えるため）トラフィックが多いことが多く、エンゲージメント率が低いことがよくあります。 Google Analyticsを使用して、最も重要なページを特定し、最適化の機会を見つけます。 最も重要なナビゲーション項目を最初に表示します（またはメニューバーの方向によっては上部に表示します）。
• メニュー項目を最大XNUMXつ保持します 7の最大値 。 調査によると、人々は一度に最大7つの情報しか記憶または処理できないことがわかっています。 メニュー項目のカテゴリが多すぎると、検索でのランク付けに影響を与える可能性があります。Googleは、一見無関係に見えるカテゴリが多すぎると、サイトが特定のニッチに同調していないことを示していると解釈する可能性があるためです。 XNUMXつ以上のメニュー項目が必要になることがわかっている場合は、それらをサブカテゴリに分割します。

上記の点に関して、ユナイテッドのウェブサイトのメニューデザインは複雑すぎます（訪問者にとって選択肢が多すぎます）：

• メニューを監査する 時々。 めったにクリックされないリンクを削除します。 一般的なラベルの名前を変更して、人間の訪問者や検索エンジンをわかりやすくします。

これらのヒントは以上です。WordPressのさまざまなメニューをより適切に整理できるようになることを願っています。 リストされていないプラクティスがありますか、それらを投稿してください。