サイトで rel="noopener" を使用して外部アンカーを開く

● サイトで rel="noopener" を使用して外部アンカーを開く

target="_blank" で開くリンクに rel="noopener" をつけ忘れてはいませんか?

target="_blank" を使用して任意のページから別のページにリンクしている場合、リンク元のページとリンク先のページは同じプロセスで動作します。 そのため、リンク先のページで負荷の高い JavaScript が実行されていると、リンク元のページのパフォーマンスが低下するおそれがあります。

また、target="_blank" にはセキュリティ上の脆弱性もあります。リンク先のページでは window.opener を使用して親ウィンドウのオブジェクトにアクセスしたり、window.opener.location = newURL によって親ページの URL を変更したりできます。

リンクに rel="noopener" を追加する

<a href="link.html" target="_blank">サイトへのリンク</a>

  ↓

<a href="link.html" target="_blank" rel="noopener">サイトへのリンク</a>

リンクに rel="noopener noreferrer" を追加する

<a href="link.html" target="_blank">サイトへのリンク</a>

  ↓

<a href="link.html" target="_blank" rel="noopener noreferrer">サイトへのリンク</a>

https://developers.google.com/web/tools/lighthouse/audits/noopener?hl=ja

No.1329
02/15 12:00

edit