a要素のrel属性

target=”_blank”を指定した場合、リンク先のページからJavaScriptを使用することで、リンク元のページ情報を取得することができる。こういったことが、情報の悪用などのセキュリティの問題を引き起こす可能性もあり得る。そのため、リンク先が信頼できない場合はrel属性にnoopenerや、より古いブラウザにも対応しているnoreferrerを指定することで、リンク元のページ情報を取得できないように対策することができる。
nofollowはサイト管理者が投稿されたリンク先を承認していないということを明示的に示すことができる。

<!-- 通常 -->
<a href="リンク先のURL"></a>

<!-- 別タブ -->
<a href="リンク先のURL" target="_blank"></a>

<!-- セキュリティ対策 -->
<a href="リンク先のURL" target="_blank" rel="noopener noreferrer"></a>

2022年の時点で、使用されているほとんどのブラウザでnoopenerはサポートされているためrel=”noopener”だけでもほぼ問題はない。

なお、WordPressでは5.1からtarget=”_blank”の属性のリンクに「rel=”noopener noreferrer”」が自動付与されるようになっている。

注: Chromium バージョン 88 以降、target=”_blank” を指定したアンカーは、デフォルトで noopener の動作を自動的に設定する。rel=”noopener” を明示的に指定することで、Edge Legacy や Internet Explorer など、従来のブラウザのユーザーを保護できる。

inserted by FC2 system