「リンクに識別可能な名前がありません」というエラーを修正するにはどうすればいいですか?

ウェブサイトの検索エンジン最適化（SEO）に積極的に取り組んでいる場合、ウェブページのパフォーマンス向上に役立つ情報を提供するGoogle Lighthouse、「リンクに分かりやすい名前が付けられていない」というものがあります。

このエラーは監査レポートの「SEOセクション」で指摘されており、ウェブサイトのユーザーエクスペリエンスの向上に関連するものです。.

この記事では、Google Lighthouseのエラーを修正する方法について解説します。その前に、Google Lighthouseツールについて簡単に説明します。.

要約：不明瞭なリンクラベルを素早く修正する方法

• Google Lighthouseは、意味のあるテキストが欠落しているリンクを警告表示します。これは、アクセシビリティやユーザーエクスペリエンスを損なう可能性があるためです。.

• 「ここをクリック」のような曖昧な表現は、リンク先を明確に説明する分かりやすいリンクテキストに置き換えてください。.

• クリック可能な画像には、支援技術がその目的を理解できるように、適切な代替テキストを追加してください。.

• アイコン、ボタン、または動的要素には、aria-labelなどの属性を使用して、アクセシビリティを高め、理解しやすくしましょう。.

Google Lighthouse とは何ですか?

Lighthouseはオープンソースソフトウェアであり、ウェブページの監査を支援し、改善のための有益な提案を提供するGoogleの無料ツールです。

Google Lighthouseツールがウェブサイトを監査する際の基準となる5つのパラメータは、パフォーマンス、アクセシビリティ、SEO、ベストプラクティス、およびプログレッシブウェブアプリ（PWA）です。

これらのパラメータに基づいて、ウェブサイトの全体的なパフォーマンスを向上させるための提案が提示されます。それでは、それぞれのパラメータについて簡単に見ていきましょう。.

パフォーマンス

Lighthouseのパフォーマンス監査は、ウェブサイトのページ速度。ウェブサイトの読み込み速度と、ユーザーにとってどれだけ最適化されているかを評価します。パフォーマンススコアは、0～49、50～89、90～100の3つのカテゴリに分けられます。

90～100のスコアは、ウェブサイトが適切に最適化されていることを示します。90未満のスコアは、ウェブサイトの改善が必要であることを意味します。Lighthouseは問題点をハイライトし、ウェブサイトのパフォーマンスを改善する。

アクセシビリティ

この指標は、支援技術を利用するユーザーにとってウェブサイトがどれだけアクセスしやすいかを測定するものです。リンクに分かりやすい名前がなかったり、ボタンの説明が不十分だったり、画像に代替テキスト（alt属性）が含まれていなかったりすると、視覚障害のある方や視覚に障がいのある方がウェブサイトにアクセスするのが難しくなります。.

アクセシビリティ監査レポートでは、Lighthouseがウェブサイトを100点満点で評価します。ここでも、点数が高いほどアクセシビリティが高いことを示します。このツールは、アクセシビリティを改善するための提案も提供します。.

読む: WordPress のアクセシビリティ WCAG 準拠

検索エンジン最適化

SEOの観点から見ると、このツールはウェブサイトのテクニカルSEOを分析します。包括的なSEO監査レポートを提供するわけではありませんが、修正が必要な重大なエラーを明確に示してくれます。.

分析対象となる項目には以下のようなものがあります。

• 有効な構造化データ
• 説明文付きのリンク
• 有効なrobots.txt
• Web ページの応答性とインデックス作成可能性。.
• メタタグ– タイトルと説明
• 画像と画像の代替テキスト
• 内部リンクのクロール可能性

ベストプラクティスチェック

、ウェブサイトまたはウェブページの構築に使用されているウェブ開発標準を分析します。ベストプラクティス監査レポートは、100点満点でスコアを表示し、修正が必要な問題点を指摘します。

このツールは、ウェブページが以下の条件を満たしているかどうかを判断するのに役立ちます。

• ブラウザエラーや非推奨のフレームワークやAPIがない
• HTTPSを使用して安全なサーバーからリソースを読み込む
• 画像の正しいアスペクト比の使用
• クロスサイトスクリプティング（XSS）攻撃に対して安全
• JavaScriptライブラリの脆弱性から保護されています。.

失敗要素のないベストプラクティスに準拠した Web サイトを構築したい場合は、トップクラスのWordPress 開発会社にご連絡ください。

関連記事：よくあるテクニカルSEOの問題点とベストプラクティス

プログレッシブウェブアプリ（PWA）

Google Lighthouseの最終監査レポートは、ウェブアプリケーションの妥当性を検証するのに役立ちます。ウェブアプリの速度と信頼性、そして最適なユーザーエクスペリエンスを提供しているかどうかを確認します。.

このツールは、ウェブアプリが複数のデバイスに簡単にインストールできるか、オフライン機能やプッシュ通知を提供しているかを確認します。また、プログレッシブウェブアプリが最適化および設定されているか、すべてのHTTPトラフィックをHTTPSにリダイレクトしているかも確認します。.

この監査レポートでは、ウェブアプリがさまざまな要素においてどの程度優れたパフォーマンスを発揮しているかに基づいて、PWAバッジが付与されます。Google Lighthouseは、ウェブアプリケーションのパフォーマンスを向上させるための役立つ提案も提供します。.

「リンクに識別可能な名前がありません」とはどういう意味ですか?

「リンクに識別可能な名前がありません」というのは、説明を要しませんが、ここではコンテキストを示す例を示します。.

例1

<h3>ウェブサイトの速度をチェックしてみませんか？</h3><li><a href="https://seahawkmedia.com/tools/website-speed-test/">ここをクリック</a></li>

例2

<h3>ウェブサイトの速度をチェックしてみませんか？</h3><li><a href="https://seahawkmedia.com/tools/website-speed-test/">無料ツールを使ってサイトの速度をチェックしましょう</a></li>

次の 2 つの例のうち、どちらが「リンクに識別可能な名前がありません」というエラーをフラグ付けしますか?

例 1 と答えた方は、まさに正解です。

簡単に言うと、Googleはウェブサイト上のすべてのリンクとボタンに、説明的または非常に明確なテキストを使用するべきだと述べています。テキストは、ユーザーがクリックした場合に何が起こるかを明確に示す必要があります。たとえば、例2では、​​「この無料ツールを使用して、サイトの速度を確認してください」と明確に示されています

Googleはユーザーエクスペリエンスの向上を最優先事項としています。そのため、リンク、ボタン、画像内のテキストを分かりやすく記述することで、Googleのガイドラインに準拠することになり、検索結果におけるウェブサイトのパフォーマンス向上につながります。.

「リンクに識別可能な名前がありません」というエラーを修正するにはどうすればいいですか?

Google Lighthouse でリンク テスト監査が失敗した場合、「SEO セクション」の下に次のエラー メッセージが表示されます。

画像ソース: https://developer.chrome.com/en/docs/lighthouse/seo/link-text/

このエラーを回避するには、次のような Lighthouse が提供するリンク テキストのベスト プラクティスに従う必要があります。

• リンクテキストを書く際は、ウェブページまたはブログ記事のトピックに沿った内容にしてください。ページの内容と関係のないリンクテキストは避けてください。.

• リンクテキストの説明は短く簡潔にしてください。短いフレーズに絞りましょう。.

• ページの URL をリンクの説明として使用しないでください。.

• 内部リンクには説明的なテキストを必ず含めてください。これにより、ユーザーと検索エンジンロボットのナビゲーションが容易になります。.

「リンクに識別可能な名前がありません」というエラーを修正するためのその他のヒントは次のとおりです。

テキストハイパーリンクに説明的な名前を追加する

上記の例で述べたように、「ここをクリック」や「続きを読む」といったハイパーリンク付きのテキストは、ユーザーに目的を明確に示していないため、Googleでは十分な説明とはみなされません。.

ユーザーは、以下に説明するように、テキストだけでリンクの目的を判断できるべきです。これにより、ユーザーエクスペリエンスが向上し、離脱率。

<h3>ウェブサイトの速度をチェックしてみませんか？</h3><li><a href="https://seahawkmedia.com/tools/website-speed-test/">無料ツールを使ってサイトの速度をチェックしましょう</a></li>

Google Lighthouseツールは、「リンクに識別可能な名前がありません」というエラーが発生したウェブページをリストアップします。このエラーを修正するには、 HTMLタグ内に簡潔で説明的なテキストを追加するだけです。

ハイパーリンクされた画像に画像のALTテキストを追加する

ハイパーリンク付きの画像には、リンクの目的を説明するalt属性を追加してください。画像には（テキストハイパーリンクのように）画面上にテキストが表示されないため、画像のaltテキストには、画像をクリックしたときに何が起こるか、またはユーザーがどのページに移動するかを説明するテキストが必要です。.

例えば、下の画像では、alt属性が「W3Schools.com」に設定されています。そのため、ユーザーが画像にカーソルを合わせると、画像をクリックすることでどこに移動するのかが正確にわかります。.

画像ソース: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_image_link

画像の代替テキストは、シンプルかつ簡潔に記述してください。画像の説明は不要です。画像の「リンクに識別可能な名前がありません」というエラーを修正するために、画像の目的を明記するだけで十分です。.

複雑なコンテンツを含むリンクに識別可能な名前を追加する

複雑で動的な要素や非テキストコンテンツの場合は、リンクにaria-label属性を追加する必要があります。これにより、特に支援技術を使用するユーザーにとって、リンクのアクセシビリティが向上します。.

例：ポップアップボックス内の閉じるボタン（X）

<div id="box">これはポップアップボックスです<button aria-label="Close" onclick="document.getElementById('box').style.display='none';" class="close-button">。X</button></div>

上記の例では、リンクをクリックするとポップアップボックス（div要素）が表示されます。「閉じる」要素は、文字「X」のみのボタンです。.

ここでは、aria-label=”close”によってボタン（X）に分かりやすい名前が付けられています。.

最後に

「リンクに識別可能な名前がありません」というエラーの修正は非常に簡単です。Google Lighthouseは、SEO監査レポートでこのエラーを指摘します。.

リンクに分かりやすい名前が含まれていないウェブページを特定したら、HTMLタグ内に説明文を追加することで問題を解決できます。ハイパーリンクされた画像の場合は、画像のalt属性を追加してください。一方、動的な要素、アイコン、およびテキスト以外のコンテンツには、aria-label属性を使用できます。.

技術的なSEOエラーは、ウェブサイトのパフォーマンスを低下させるだけでなく、ユーザーエクスペリエンスの悪化にもつながります。また、ウェブクローラーがウェブサイトを正確にインデックスすることを妨げ、サイトのランキングに影響を与える可能性もあります。

ユーザーエクスペリエンスとサイトのパフォーマンスを向上させるには、一般的なSEOの問題をすぐに特定し、修正する必要があります。また、サポートが必要な場合は、いつでもマネージドSEOサービスプロバイダー。

「リンクに識別可能な名前がありません」エラーに関するよくある質問