そもそも「target=”_blank”」とは
target=”_blank”とはHTMLタグの一種で、リンク先を別ウィンドウ（タブ）で新しく開くように指定できます。
主に自サイト以外（アフィリエイトリンク、参考リンク等）をリンクする場合に使用されます。別ウィンドウで開くため現ページに影響を受けずに違うページを開けるメリットがあります。
記述方法は下記のように記載します。
<a herf="https://ad-affi.info" target="_blank">当サイト</a>どのような問題が起こったのか
ほぼ全サイトに使用されているといっていいこのタグですが、2019年8月頃にTwitter上で一部「target=”_blank”」が指定されているリンクが開かないトラブルが発生し、SNSやスマホでこのタグの使用を制限する動きが広がりました。
リンク先が開かないというのはWEBサイトにおける根幹の部分が使えなくなっているのと同義です。
そのため追従してサイト運営者も、自サイトに外部リンクを貼っているaタグの修正をする対応に追われることになりました。
現在も同様の対応をする必要があるかというと、結論からいうと現在は特に何も対応する必要はありません。
一体どのような問題だったのか紹介します。
「target=”_blank”」のパフォーマンス問題
「target=”_blank”」を挿入して任意のページから別のページにリンクしている場合、起点となるサイト（リンク元ページ）と同一のプロセスでリンク先ページが実行されるため、リンク先で重いJavaScriptが走ると巻き添えを食います。
他のページは、あなたのページと同じプロセスで実行される場合があります。他のページが多くのJavaScriptを実行している場合、あなたのページのパフォーマンスが低下する可能性があります。
https://web.dev/external-anchors-use-rel-noopener/
ページのパフォーマンス低下はSEO上かなりのマイナス要因になりえますので気を付けたいポイントです。
「target=”_blank”」のセキュリティ問題
「target=”_blank”」リンクは別タブで開かれるため、リンク元とリンク先のページの両方が同一ブラウザ内に存在する状態になります。
問題は、ここでリンク先のページに悪意があり、JavaScriptの「window.opener」を使用すれば、呼び出し元のサイトのURLをリダイレクトして書き換えることができてしまう点にあります。
他のページは
https://web.dev/external-anchors-use-rel-noopener/window.openerプロパティを使用してあなたのwindowオブジェクトにアクセスできます。これにより、他のページがあなたのページを悪意のあるURLにリダイレクトする可能性があります。
そもそも「target=”_blank”」は、昔から脆弱性があると問題になっており、フィッシング詐欺等に使用されたりすることも問題になっていました。
当サイトの記事アダルトサイトでよくあるクリック後に広告ページを表示する方法で紹介しているような使い方です。
「target=”_blank”」問題における対処方法4選
主に4パターンの対応方法がありました。
繰り返しになりますが、現在は明示的に対応する方以外は、特に対処する必要性はありません。
「target=”_blank”」を削除
問題になる部分を削除してしまう方法です。シンプルかつ、分かり易い解決方法です。
しかし、ページ遷移がすべて同一タブ、ウィンドウ上で行われることにより、自サイトのページ滞在率が減少する等の弊害があります。
「rel=”noopener”」を追加
今まで通り別タブ、ウィンドウでリンクを開きたい方は、「rel=”noopener”」を追加することで解決できます。
「rel=”noopener”」を追加することによって、リンク先ページはwindow.openerプロパティにアクセスできなくなり、別のプロセスで実行されるようになります。
<a herf="https://ad-affi.info" target="_blank" rel="noopener">当サイト</a>「rel=”noreferrer”」を追加
「rel=”noreferrer”」を指定することにより、Refererヘッダーがリンク先ページに送信されなくなり、「rel=”noopener”」と同様の効果が期待できます。
<a herf="https://ad-affi.info" target="_blank" rel="noreferrer">当サイト</a>referrer（リファラー）とは参照元のことで、1つ前に閲覧したWEBページのリンク情報を指します。基本的に何も指定せずにリンク元ページからリンク先ページへ飛ぶとreferrer情報が付与されています。
noreferrerとは反対にこのreferrer情報を送信しないという設定です。
アフィリエイト広告は、このreferrer情報を見て○○さんのサイトからアクセスがあったんだなと判断しているケースがあります。その場合、referrer情報が消えていますので報酬が発生しないことになります。
「rel=”noopener noreferrer”」の両方追加
両方を同時に指定する方法です。
WordPress等は表示の際に、ページ内の「target=”_blank”」に対して自動的にこちらが付与されます。
<a herf="https://ad-affi.info" target="_blank" rel="noopener noreferrer">当サイト</a>アフィリエイトASPの対応
アフィリエイトASPほぼ全社、基本的に「target=”_blank”」はつかわない方針に変更になり、広告リンクから削除されました。
ほぼ問題が解決された現在でもこの方針は変わっていません。
ASP側からすると広告リンク先を別タブ、ウィンドウで開かれるより、同一タブで開かれるほうが広告掲載企業側にメリットが多いためだと考えられます。
WordPressでの対応
WordPressでは、バージョン4.7.4（2017年4月20日公開）から、「target=”_blank”」（外部リンク）に対して自動的に「rel=”noopener noreferrer”」が付与されるようになりました。
そのため特に何もする必要はありません。
まとめ
この「target=”_blank”」問題について調べてみると主要ブラウザベンダもこの脆弱性に気付き、2021年1月頃までに「Safari」、「FireFox」、「Chrome」、「Edge」は「target=”_blank”」を指定した外部サイトへのリンクに対しては、デフォルトで「rel=”noopener”」を指定したときと相応の動作をする修正がはいりました。
WordPress等のCMSでサイトを構築しているとデフォルトで対策されるようになっているため、個人ですることは基本的にありません。
仮に挿入されなくてもブラウザ側で挙動が変更されているため問題ありません。
「rel=”noreferrer”」は必要性に応じてつけましょう。
もし主要ブラウザ以外の挙動不明なブラウザにも対応したい場合のみ、明示的に「rel=”noopener”」を指定し、既にサポートが切れているIEも対応したければ「rel=”noreferrer”」を指定します。
基本的に信頼できる外部リンクは何も付与せず、アフィリエイトリンク以外の信頼できない外部リンクがあるのであれば「rel=”noreferrer”」をつける対応が良いと思います。
誰でも分かるアダルトアフィリエイト5ステップ
