クイックナビゲーション
Googleは、新しいライトニングトークシリーズの最初のエピソードで、リンクがJavaScriptで正しく機能するようにする方法を説明しています。
Googleライトニングトークは、世界中のGoogleウェブマスターカンファレンスで共有された可能性のあるプレゼンテーションの短いバージョンです。
対面式のイベントが当面キャンセルされることを考慮して、Googleは会議コンテンツをWebに適合させています。
Googleライトニングトークシリーズの動画は、年間を通じて公開される予定です。
リンクとJavaScriptに関するGoogleのMartinSplitt
Splittは、ライトニングトークの最初の記事で、「みんなのお気に入り」のトピックであるリンクについて話し合うことに専念しています。
より具体的には、JavaScriptWebアプリのリンク。
Splittは、ユーザーと検索エンジンクローラーの両方にとってリンクが果たす重要な役割について説明します。
彼はまた、リンクとJavaScript機能を組み合わせることのすべきこととすべきでないことをリストしています。
人間とボットへのリンク
リンクは、ユーザーがコンテンツ間を移動できるようにするという明白な目的を果たします。
ただし、サイトの所有者は、ボットや検索エンジンに対してもリンクが果たす役割に注意する必要があります。
何よりもまず–リンクにより、クローラーはWebサイトの他のページを見つけることができます。
クローラーは、あるページから別のページへのリンクをたどることによって、Webサイトの他のページを検出してインデックスを作成します。
リンクをたどることで、クローラーはサイトの構造と情報アーキテクチャを理解できます。
これは、特定のトピックに関連する可能性のあるページを理解するのに役立ちます。
関連:SEOのための最新のJavaScriptの実践的な紹介
JavaScriptを使用したリンクの作成–すべきこととすべきでないこと
リンクの作成はあなたが思うほど簡単ではありません、とマーティン・スプリットは警告します。
これは、JavaScript機能をリンクに追加する場合に特に当てはまります。
JavaScriptを使用すると、サイトはさまざまな方法でリンクをカスタマイズできますが、そうすると、クローラーがリンクを使用できなくなる可能性があります。
Splittが推奨するものは次のとおりです。
実施:わかりやすくする
サイトにリンクを配置する最も簡単な方法は、ahrefタグを使用することです。
いくつかの条件が満たされている限り、JavaScript機能を使用して標準リンクをアップグレードすることもできます。

禁止事項:ahref属性を省略してください
リンクにJavaScript機能を追加する場合は、ahref属性を除外することを検討してください。
「それは良い考えではありません」スプリットは言います。
その理由は、JavaScriptが正しく機能する場合にのみリンクが機能するためです。
ahref属性がないと、クローラーはJavaScriptを実行しないため、リンク先を特定できません。
禁止事項:疑似URLを使用する
また、有用なURLがない場合、または次の例のように「疑似URL」がある場合は、ahref属性を追加することもできません。
結果はahref属性のないリンクと同じです。つまり、これは良い考えではありません。
禁止事項:ボタンを使用する
ボタンを使用することは、ページへのリンクを追加するための実行可能なオプションのように思えるかもしれませんが、それも良い考えではありません。
経験則では、リンクが現在のページで何かをトリガーする場合、それはおそらくボタンである必要があります。
一方、リンクによってユーザーが以前はページになかった別のコンテンツに移動する場合は、標準のリンクである必要があります。
禁止事項:クリックハンドラーに依存する
また、サイトの所有者は、他のHTML要素を使用したりJavaScriptのクリックハンドラーを使用したりしてリンクをシミュレートしないでください。
これにより、組み込みのユーザー補助機能が機能しなくなるため、お勧めできません。
実施:セマンティックHTMLを使用する
これらすべての要点は、セマンティックHTMLマークアップを使用し、リンクを適切なURLにポイントすることです。
適切なURLは何ですか?これについては次のセクションで説明します。
「適切な」を使用するURL
これらのURLは、「適切なURL」と見なされるものの典型的な例です。
次の属性が含まれているため、これらは適切なURLです。
- プロトコル
- ホスト
- 特定のコンテンツへのパス
- フラグメント識別子(オプション)
関連:SEOとJavaScript:良い点、悪い点、不確実性
フラグメント識別子に注意してください
フラグメント識別子はオプションであり、同じコンテンツ内の場所を指しているため、クローラーはそれらを無視します。
これは、フラグメント識別子でいっぱいのリンクを使用してシングルページアプリケーションを構築する場合に特に重要です。
クローラーはリンクをたどらないため、Webアプリを理解できません。
要約すれば
Googleライトニングトークの最初の記事からの重要なポイントは次のとおりです。
- 適切なリンクマークアップを使用します。
- シングルページアプリで異なるコンテンツを読み込むためにフラグメントを使用しないでください。
- JavaScriptでうまく機能するWebサイトを構築すると、リンクが見つかります。