MENU
はっち
30代の2児のパパ。上場企業のWebマーケティング部署にて累計1,000以上のSEO施策を実行。SEO対策のセカンドオピニオンとして、躍動中。伴走型のコンサルも並行しています。

【SEO初級】グロナビはテキスト表記が原則!JSでの表記も要注意

ナビゲーションにはテキストを使用すべし

Webサイトの上部表示されるグローバルナビゲーションはSEOに関係ないと思っていますか?

グローバルナビは、Webサイトの構造理解の手助けになるので重要な項目。

もし、グローバルナビゲーションに画像を使用していたり、JavaScriptでリンク生成している場合は、Googleに正しく伝わっていない可能性があります。

SEOの基礎や概念から知りたい人は、こちらもどうぞ!
【全てのWebサイトに共通】SEOの概念と基本的な理解を言えますか?

書いてあること

グローバルナビゲーションはテキスト表記が原則

意外に思うかもしれませんが、グローバルナビゲーション(ナビゲーションメニュー)には、画像ではなくテキストで設定することが推奨されています。

サイト上のページ間のナビゲーションの大部分をテキストリンクで制御すると、検索エンジンが容易にサイトをクロールして把握できるようになります。JavaScript を使ってページを作成する場合は、a 要素とともに href 属性の値として URL を使用し、ユーザーの操作を待つのではなく、ページ読み込み時にすべてのメニュー項目が生成されるようにします。

SEOスターターガイド

これは、GoogleがWebサイトの構造理解をするにあたってテキストをベースに判断しているからです。

グローバルナビゲーションはお店に例えると館内図
その館内図を正確に読み取れないと、Webサイトの構造を理解することは難しいからです。

SEOに詳しくない制作会社やコーダーが作成したWebサイトでは、グローバルナビゲーションに堂々と画像を設置しているケースが多く残念な気持ちになります。

見分け方(簡易的)

PCでみた際に、Windowsであれば「Ctrl + A」、Macであれば「Command + A」を押しましょう。

その結果、グローバルナビゲーションに記載されたテキストを、そのままコピーアンドペーストできる状態であればテキスト化されています。

もし画像だった場合は、テキスト化することを推奨します。

修正に時間や費用がかかる場合は、せめてaltテキストが画像に記載されている文字と同じであることを確認してください。

SEOスターターガイドに記載されているレベルなので、もはや早急に修正していただきたい項目の1つですが、工数と見比べながら対応をしましょう。

私が今まで対応した企業の多くは指摘した後、半日も掛からず修正いただいるので、どんなWebサイトであってもすぐに修正できることが多いです。

JavaScriptによるリンク生成は要注意

ごくたまに、リンクの全てがJavaScriptによって生成されているWebサイトにも出会います。

JavaScriptによるリンク生成は注意が必要で、SEOスターターガイド内にも「JavaScriptを使ってページを作成する場合は、a要素とともにhref属性の値としてURLを使用し、ユーザーの操作を待つのではなく、ページ読み込み時にすべてのメニュー項目が生成されるようにします。」と記載されています。

サイト上のページ間のナビゲーションの大部分をテキストリンクで制御すると、検索エンジンが容易にサイトをクロールして把握できるようになります。JavaScript を使ってページを作成する場合は、a 要素とともに href 属性の値として URL を使用し、ユーザーの操作を待つのではなく、ページ読み込み時にすべてのメニュー項目が生成されるようにします。

SEOスターターガイド

Googleがリンクをリンクと判断する際には、aタグを辿っています。

JavaScriptによって、a要素とともにhref属性がないリンクが生成された場合は、ユーザーはクリックできてもGoogleはクロールできません。

クロールできないということは、ページ先の情報まで辿り着けない(=認識できない、評価できない)ということ。

内部リンクの構築でも触れているので、認識のために覚えておいてください。

グローバルナビゲーションは日本語で表記を推奨

グローバルナビゲーションには、英語ではなく日本語を使用することを推奨しています。

上記はGoogleが言っているわけではなく、あくまで私個人の見解なのでご了承ください。

理由は2点。

  1. アンカーテキストのテキストは内部リンクの側面でも日本語が良いから
  2. 読むユーザーの多くは日本人だから

かっこいいデザインが良い要望を受けたWebデザイナーが、グローバルナビゲーションや見出しを、律儀に英語で記載したWebサイトを散見します。ただ、余程の理由がない限りは日本語に変更することを推奨します。

内部リンクに記載されるテキストは次ページの内容を示すものです。

内部リンクの使い方とアンカーテキスト

この点はGoogleも言及しています。

適切なアンカー テキストがあれば、ユーザーと検索エンジンはリンクされたページの内容を簡単に把握できます。

SEOスターターガイド

ただ次ページに記載する内容が英語より日本語で記載しているほうが、ユーザーもGoogleも次ページの内容を理解しやすいと思いませんか?

例:どちらが次のページだと分かりやすい?
  • A:Price
  • B:料金

パッとみた印象どうでしょうか。

Bの「料金」であれば、脳内で和訳する労力もないですし迷いもしないはず。

では、下記のパターンではどうでしょうか。

例:どちらが次のページだと分かりやすい?
  • A:Actual results
  • B:実績

上記は、BtoBで良く見かける「実績」ページへの案内です。

Bの「実績」のほうが分かりやすい人が圧倒的に多いのではないでしょうか。

ブロガーが運営するWebサイトは英語表記のメニューは見かけませんが、なぜか企業が運営するWebサイトになると急に英語表記のメニューが急増します。

確かに英語表記にすると、デザインが締まってカッコ良いのですが、ユーザーを見ていません。

ユーザーも何のページか分からなくなり離脱する結果になると、「使いにくいWebサイト」として認定され結果としてGoogleからの評価も低くなります。

共通の重要なグローバルナビゲーションには「なんとなく分かる」ではなく、「直感的に正しく誘導」できる導線にすることが重要です。

まとめ

SEOにおけるグローバルナビゲーションの注意点は、言われてみれば確かに・・・という事象ですが、意外と対応していない企業のWebサイトが多いです。

カッコ良いデザインを追求するのは良いですが、利用するのはあなたではなく知見のないユーザーです。

最も意識すべきは「使いやすいWebサイト」であることが鉄則です。

そのうえで、Googleにも構造理解をしやすい設計を心がけWebサイトの運営に努めましょう。

よかったらシェアしてね!
  • URLをコピーしました!
書いてあること