target="_blank" で開くリンクには rel="noopener" をつけたほうがいい

htmlタグのリンクタグ<a>タグで、target="_blank" で別窓でリンクを開かせる場合、rel="noopener" をつけたほうがいいとか。

これ、じつは最近まで知りませんでした。

※ある時から、WordPressでリンクを貼るとnoopenerが自動でつけられるようになっていたので気が付いて、調べました。WordPressを使い始めた頃の記事にはついていないので、その後のバージョンUPで改良されたのですね、きっと。

（検索してみたら、WordPress Version 4.7.4(2017年4月20日)からそうなったようです。サーバーの自動更新で Version Up されていますので、サーバーに採用されたのは、記事を辿るとどうやら９月ごろ？）

なぜコレが必要かというと、target="_blank"で開いたウィンドウと、開いた元のウィンドウはまったく無関係ではないという事のようです。

「リンク元のウィンドウを、開いた先のウィンドウから操作できてしまう」というセキュリティ上の問題があるとか。

☆ rel="noopener" だけでなく、「 noreferrer 」も付けたほうが良いらしいとのこと(※ページ下部に追記あり)。

<a href="url" rel="noopener, noreferrer" target="_blank">url</a>

さらには、「開いた先のウィンドウで何か重い処理をしていると、元のウィンドウまで重くなる」などの問題もあるのだとか。

The performance benefits of rel=noopener
rel="noopener" prevents opened pages tampering with the original page, but it also has a performance benefit.…

jakearchibald.com

たくさんウィンドウをう開いた時に重くなるのはそのせいもあったのかも？

詳しいことは理解できてませんが(笑)

外部リンク先に悪意のあるコードが含まれていると、遷移先のページからフィッシング詐欺など悪意のある操作を行うことができる可能性があるとか。

開いた先のウィンドウから元の自分のウィンドウが操作されるのは気持ち悪いので、とりあえずrel="noopener"つけておいたほうがいいですね。。。

※追記

WordPressの当初の改変では、rel="noopener noreferrer" が負荷されるようになっており、このnoreferrerがあることで、アフィリエイトをやっている人の場合は成果が発生しなくなるのでは？という懸念があったようです。

その後の調査で、各アフィリエイト運営会社は概ね、影響はないという解答だったようですが、その後、WordPressのVersion Upでrel="noopener"だけになったようですね。