Webサイトで別タブを開く際に使う target="_blank"。実は、これだけを記述するのはセキュリティのリスクがあります。安全かつ効果的なサイト運営に欠かせないrel属性について、簡単に解説します。
target=”_blank” に潜む危険性とは？
何も対策をせずに新しいタブを開くと、リンク先のページから元のページを操作できてしまう 「タブナビング（Tabnabbing）」 という攻撃を受けるリスクがあります。
具体的には、リンク先のページに仕込まれた悪意のあるプログラムが、JavaScriptの window.opener という機能を使って、元のタブのURLを勝手に書き換えてしまうのです。
タブナビングの攻撃方法例
- なりすまし：元のタブが、銀行やSNSなどの偽ログイン画面（フィッシングサイト）に切り替わり、パスワードを盗まれてしまう
- 情報奪取：ユーザーが新しいタブを読み終えて元のタブに戻ると、そこには「セッションが切れました。再ログインしてください」といったメッセージが表示されてしまい、ユーザーは自分のサイトに戻ったつもりなので、疑わずにパスワードを入力して盗まれてしまう
各rel属性の意味と特徴
以前のブラウザ仕様では、target="_blank" で開いた先のページ（リンク先）から、元のページ（リンク元）を操作できてしまう「タブナビング（Tabnabbing）」 という脆弱性を防ぐのが以下の属性です。
noopener
リンク先ページから、リンク元ページへの参照window.openerを切り離します。これにより、リンク先が悪意のあるサイトだった場合、元のタブのURLを勝手に書き換えてフィッシングサイトを表示させる、といった攻撃を防ぐことができます。
最新の主要ブラウザ（Chrome, Safari, Edgeなど）では、target="_blank" を指定すると自動的に noopener が適用されるようになっています。
noreferrer
リファラ（参照元URL情報）をリンク先に送らないようにします。これにより、どこからアクセスしたかを隠せるためプライバシー保護になります。
アフィリエイトリンクの場合 noreferrer を入れるとリファラが送られないため、ASPのシステムによっては計測漏れ（報酬が発生しない）が発生するリスクがあります。
また、リンク先が「どこから来たか」を判別できなくなるため、アクセス解析にも影響が出ることがるので、注意が必要です。
nofollow
検索エンジン（Googleなど）に対し、「このリンクを辿らないでください」「このリンク先に評価を渡さないでください」と伝えます。セキュリティ対策というよりは、SEO対策（スパム防止）のための属性です。有料広告や、信頼できないコンテンツへのリンクに使用します。
またGoogleのリンクスパムに対するポリシーの中で、広告やスポンサー活動は「ウェブ上での通常の経済活動の一環だということを理解しています」とされており、広告リンクには rel="nofollow" または rel="sponsored" を付けることでGoogleポリシーへの違反を防げます。
どう使い分けるべき？
通常のリンクの場合はrel="noopener" を使用することでセキュリティが確保できます。
アフィリエイト広告ではrel="noopener sponsored" または rel="noopener nofollow" を使用することで、報酬計測を阻害せず、SEOガイドラインを守ることができます。
匿名性を保ちたい場合はrel="noreferrer" を使用すると、相手にアクセス元が伝わらなくなります。
まとめ
target="_blank" を使用する際は、目的に合わせて適切な rel 属性をセットで記述することが重要です。
rel属性を正しく理解して使い分けることで、ユーザーにとっても自分にとっても安全で信頼性の高いサイト作りを目指しましょう。
