cashaan
aタグで外部へリンクを繋げる時、単純に
<a href=”〜〜〜〜” target=”_blank”>リンクを繋げる</a>
と「target=”_blank”」の設定をするだけに止まっていませんでしょうか？
aタグにはいくつものパラメーターがあり、それらを設定しないことには、ページ表示におけるパフォーマンスの低下や、SEOにおけるページ評価のダウンに繋がりかねません。
rel属性をつけて対処をする必要があります。
aタグのrel属性
aタグにはrel属性をつけ、そのリンク先が何であるのか、またはページ先へ移動したときに元のページの情報をどうするのか、などの指定ができるようになっています。
rel属性の種類と意味
| alternate | 現在のページの代替ドキュメントへのリンクである |
| author | リンク先の著者 |
| bookmark | ページ内におけるパーマリンクである |
| help | ヘルプ内容のリンクである |
| license | 著作権情報へのリンクである |
| next／prev | 次へ、または前のページへのリンクである |
| tag | 現在のページに定義づけられたタグを説明するページへのリンクである |
| search | 検索ページへのリンクである |
| nofollow | リンクを自分のサイトと関連付けない（詳細は以下へ） |
| noopener | 新しい閲覧コンテキストで開き、リンク元の文書へアクセスできないようにする（詳細は以下へ） |
| noreferrer | 現在のページの情報をリンク先へ渡さないようにする（詳細は以下へ） |
上記のうち、altenate〜searchの上8つはリンクの意味を表す設定になりますが、
下3つのnofollow〜noreferrerについては、リンク先と現ページとのデータのやりとりの設定となり、重要な項目となります。
ドメイン外への外部リンクを繋げる時に設定しておくべきrel属性
noopener
端的に言うと「セキュリティのためにつけておくべき設定」となります。
例えば何も設定がない状態でリンク先を開いた時、リンク元のページの文書を渡している状態になります。
すると、もしリンク先のページに、リンク元への書き換えスクリプトが仕込まれていたとしたら、
元のページにそのまま戻ると、表示されている状態では書き換わっている状態になってしまうのです。
これはJavaScriptのwindow.openerを使用することで可能となる技術の一つです。
別のウィンドウから（
Window.openを使用して）開かれたウィンドウは、主ウィンドウへの参照をwindow.openerとして保持します。
この方法を利用して、リンク先からリンク元に戻った時に別ドメインに転送されてしまうという状態に陥ることもあります。
このように悪意のあるスクリプトが仕込まれているページと切り離すため、まっさらで新しいページとして立ち上げ直す、という意味があります。
セキュリティの観点からnoopenerを設定しないと飛べないブラウザもある
target=”_blank”問題。
— ごれむす (@goremusn) August 8, 2019
既出かもしれないけど、
①blankあり&noopenerなし 遷移できない
②blankあり&noopenerあり 遷移できる
③blankなし 遷移できる
じゃない？
スマホのOSアプデのセキュリティ強化の影響？
うちのサイト、CVR落ちてたけどこれの影響かも。
「target=”_blank”」をつけるだけではリンクが繋がらないという状態も発生しています。
noopenerはつけておいて損は無いようです。
また、元のページとは違う新たなページとして立ち上げることで各タブの処理もそれぞれに行われます。
パフォーマンスの向上にも繋がります。
nofollow
Googleは検索順を決めるために、ページを評価しています。
評価されたページとリンクされた外部ページは、「評価が高いページにリンクされた」として評価を受け継ぐことができます。
数年前に流行った、リンク評価によるSEO対策はこの仕組みを利用していたというわけです。（今では古い手法で今ではわざとやるとペナルティを受けます）
しかし逆もあります。「悪い評価がされているページにリンクされたページ」という評価も存在します。
このように評価はリンクによっても影響を受け合うということです。
そこでこの「nofollow」の出番です。
「nofollow」は「自分のサイトとリンク先を関連付けない」とするので、評価の受け渡しを行いません。
これでページ先に迷惑はかかりませんし、万が一悪い評価のページと繋がってもこの影響を受けなくなります。
同ドメインやグループなど、管理者として関連があれば特段必要ありませんが、
基本、他所へのページリンクにはnofollowを設定することを推奨します。
noreferrer
URLを移動する際、情報もリンク先に渡っていきます。
身近なところで言うと、Google Analyticsなどで「参照元」という「どのページからやってきたか」という情報を計測できるかと思います。
これらはnoreferrerをつけていないと渡っていく情報となります。
一見危険なように見えませんが、万が一IDなどの大事な情報が入っていた場合にそれらも送信されることになり、analyticsなどでこれを拾われてしまう結果となります。
表には見えなくても裏では様々な情報が渡っていくことを認識しておきましょう。
リンクの設定は今一度確認を
リンクの設定がページの評価に全て直結しているとは一概に言えません。
しかしページそのものの情報や、閲覧者などを守るためには上記のような設定を仕込んでおく必要があります。
「target=”_blank”」を使用する場合は設定を再確認してみてください。
参照サイト一覧
[HTML] Aタグにおけるrel属性の意味と効果について
https://ocws.jp/blog/post1974/
https://blog.jxck.io/entries/2016-06-12/noopener.html
https://www.araccoon.com/rel-attribute-3no/
