rel =” noopener noreferrer”タグはどういう意味ですか? (&それはSEOに影響しますか?)
公開: 2022-04-14あなたのウェブサイトのセキュリティに注意を払うことは、サイト所有者であることの最も重要な側面の1つです。 URLプレフィックスにHTTPSを含めることの重要性、またはSSL証明書が必要な理由を理解しているかもしれません。 しかし、 noopener noreferrer HTMLタグ属性の意味と、それらをいつ使用する必要があるかを知っていますか?
この記事では、 rel =” noopener noreferrer”の意味、いつ使用すべきか、SEOの観点からサイトにどのように影響するかについて説明します。 すぐに飛び込みましょう。
rel =” noopener noreferrer”とは何ですか?
rel =” noopener noreferrer” HTML属性は外部ハイパーリンクに表示されます。 具体的には、 noopener属性とnoreferrer属性の両方を使用すると、次のことが防止されます。
- リンクがクリックされたのと同じタブでのリンクのターゲットの読み込み
- 宛先サイトの分析で参照トラフィックとして表示されないバックリンク
これは、タグ属性が実際にどのように見えるかです。
<a href="https://www.google.com/" target="_blank" rel="noopener noreferrer">
WordPressは、新しいウィンドウで開くように設定した外部リンクにこれらの属性を自動的に追加します。 それらを分解して、各属性が何をするかを見てみましょう。
noopener
外部リンクがユーザーの元のブラウザーウィンドウを制御しないようにする場合は、 noopener属性を追加する必要があります。 MDNによると、
「[ noopener ]は、ブラウザを開いたドキュメントへの新しいブラウジングコンテキストアクセスを許可せずに、ターゲットリソースに移動するようにブラウザに指示します。 […]これは、信頼できないリンクを開くときに、元のドキュメントを改ざんできないようにするために特に役立ちます…」
つまり、 noopenerは主に、悪意のあるリンクがユーザーのブラウザにアクセスするのを防ぐためのセキュリティ対策です(タブナビングと呼ばれるフィッシング攻撃)。 以前は、リンクにtarget =” _ blank”をそのままにしておくと、このセキュリティの脆弱性が発生していました。 これで、 target =” _ blank”を使用して新しいブラウザウィンドウで開くように外部リンクを設定する場合は常に、ほとんどの検索エンジンとSEOの専門家は、 noopenerを一緒に使用することがベストプラクティスであると考えています。
(Mozilla Developer Network(MDN)によると、 target =” _ blank” 属性「 noopenerと同じ<rel>動作を暗黙的に提供するようになりました」。 すべてのユーザーが最新の安全なブラウザでリンクをクリックするわけではないため、二重に安全で、 noopenerを含めることは依然として価値があると考えています。)
noreferrer
基本的に、 noreferrerは、外部サイトがWebサイトにその資料へのリンクを含めたことを知らないようにします。 これは、プライバシーまたはセキュリティ上の理由から重要になる可能性があります。 全体として、この特定の属性は、リンクに適用する前に検討したい属性です。 それを使用することは本当にあなたの好みに依存します。
noreferrer属性は、宛先分析での参照リンクをマスクします。 それはあなたのサイトの情報があなたのユーザーがナビゲートしているウェブサイトに転送されることから保護します。 その結果、これにより、リンクは特定のドメインからの参照トラフィックではなく、GoogleAnalyticsで直接トラフィックとして表示されます。
誰かがnoreferrerを含まないリンクを使用してあなたのウェブサイトに移動した場合、あなたはあなたのアナリティクスダッシュボードのあなたの紹介トラフィックリンクにリストされた彼らのウェブサイトを見ることができます。 ただし、リンクにnoreferrerが含まれている場合は、直接トラフィックに表示されます。 これらのリストは、GoogleAnalyticsの[集客]>[すべてのトラフィック]>[チャネルと集客]>[すべてのトラフィック]>[参照]にあります。
SEOの「リンクジュース」は引き続き通過しますが、発信者に関するデータは通過しません。 あなたがそのSEOブーストを渡すことに興味がないなら、 nofollowはあなたが追加したい追加のタグになるでしょう。

rel =” nofollow”で使用する
rel =” noopener noreferrer”を含むリンクにnofollow属性を追加すると、コンテンツやパースペクティブを承認しているように見えずに、他のWebサイトにリンクできます。 Googleによると、この属性は「ページにリンクしたいが、ランキングクレジットを別のページに渡すなど、いかなる種類の承認も暗示したくない場合」に使用する必要があります。
基本的に、 nofollowは、特定のサイトにリンクしているという理由だけで、特定のサイトをサポートしていると認識させたくないことをGoogleに伝えます。 スポンサーコンテンツやユーザー生成コンテンツにラベルを付けるための属性など、Googleがリンクの背後にある意図を理解するのに役立つ同様のリンク属性がいくつかあります(その多くはスキーママークアップを介して追加できます)。
つまり、 noopener 、 noreferrer 、 nofollowの3つの属性すべてをリンクに追加すると、次のようにGoogleに通知されます。
- 潜在的に悪意のある外部リンクからサイトユーザーを保護する意思がある( noopener )
- 参照されたトラフィック( noreferrer )としてWebサイトの分析データに表示されたくない
- リンク先のコンテンツまたは作成者を推奨したくない( nofollow )
nofollow属性はかなり具体的であるように思われるため、一般的なルールとしてではなく、ケースバイケースでのみ使用することをお勧めします。 多くのブログでは、ボットや会話に参加していない人からのコメントスパムを避けるために、コメントセクションをnofollowに設定しています。
「noopenernoreferrer」を使用する場合
あなたはあなたのウェブサイトがあなたの訪問者のために可能な限り安全であることを望みます。 強力な被リンク戦略を構築して活用したいので、 rel =” noopener noreferrer”を常に使用することはありません。 たとえば、サイト内の内部ページにリンクする場合は使用しないでください。
rel =” noopener noreferrer”を使用すると、リンクのセキュリティに関心があることがGoogleに通知されます。 また、特定のサイトに自分のサイトを紹介として認識させたくありません。
「noopenernoreferrer」がSEOに与える全体的な影響
外部リンクでrel=” noopener noreferrer”属性を使用する場合、これがSEOバックリンク戦略に直接的な悪影響を与えることはありません。 どちらの属性も、技術的なSEOランキングに影響を与えることはありません。 実際、 target =” _ blank”と一緒にnoopenerを使用すると、ユーザーが別のサイトに移動してもサイトにとどまるため、ページ上のSEOが向上します。
ただし、 noreferrerは、他のサイトにリンクしているときにGoogleが認識できないようにします。 そして、他のウェブサイトの所有者は、あなたが彼らにリンクしているときに見ることができなくなります。
つまり、相互リンクの可能性を排除しているということです。 結局のところ、サイトの所有者が分析を行ったときに参照トラフィックを表示するオプションを提供していない場合、サイトの所有者はそれがあなたからのものであることを知ることができません。
他の場所からあなたのウェブサイトへのバックリンクは保証されていません。 それでも、好きなサイトやコンテンツに接続するためにできる限りのことをすることは害にはなりません。 ただし、一般的に言えば、外部リンクでrel =” noopener noreferrer”を使用しても害はありません。 内部リンクを使用するときは、自分のWebサイトページでそれらを使用しないように注意してください。 これを行うと、独自のサイト分析や、Googlebotがサイト構造をクロールしてインデックスを作成する際に問題が発生する可能性があります。
結論
Webサイトでrel=” noopener noreferrer”を使用する方法がわかったので、それに応じて計画を立てます。 必要に応じて、サイトに含める外部リンクのスプレッドシートを作成することを検討してください。 また、それらが表示されているページと、それらに適用した属性を追跡します。 そうすることは、将来変更を加える必要がある場合のクイックリファレンスに役立ちます。
ハイパーリンクでrel=” noopener noreferrer”を使用していますか? なぜまたはなぜそうではないのですか? コメントをお送りください。ご意見をお聞かせください。
Sammby/shutterstock.com経由の注目の画像