みなさんこんにちは
aタグの使い方を改めて見直してみたいと思います。
突然ですが…
正しいリンク貼れていますか？
<a href=“(飛ばしたいURL)”>だけで何をするにも全て解決していませんか？
全く間違えている訳ではないのですが、今回は少しだけ…記事等を書くうえでSEO対策としても重要になる属性について考えたいと思います。
今回は「target属性」と「rel属性」について触れていきます。
ところでrel属性っていっぱいありますよね・・・
基本的に記事を書く目的だとaタグのrel属性で覚えなければいけないのは「nofollow」、「noopener」、「noreferrer」3つだと思います。
では、それぞれの違いについてまとめてみます。
rel属性「nofollow」とは？
書き方
<a href=“(飛ばしたいURL)” rel=“nofollow”>nofollowは外部リンクに対して使います。そのリンクとサイトを関連付けたくない場合、またはリンク先のページをサイトからクロールさせない（SEO効果を上げさせない）ようにする場合は、nofollow の値を使用します。
rel属性「noopener(ノーオープナー)」とは？
書き方
<a href=“(飛ばしたいURL)” target=“_blank” rel=“noopener”>現在は「noopener」を使わなくてもchrome、safari、Firefox等では自動付与されているようですが、
「target=”_blank”」 は、新しいタブで開いたりすることができますが、どうやらセキュリティの観念から非常に脆く、参照先の子ページや外部リンク等のプログラムの負荷が重いことでパフォーマンスも低下させてしまう（リンク先ページのJS等）…
そこで、安全に使用するために rel=“noopener”という属性が作られたそうです。
WordPress等でブログを書く際に自動付与されているので、チェックしてみてください。
rel属性「noreferrer（ノーリファラー）」とは？
書き方
<a href=“(飛ばしたいURL)” target=“_blank” rel=“noreferrer”>まず、リファラーとはそもそも
・ユーザーがどのような経路でWEBサイトに来たのか？（自然検索？広告？）
・どんなキーワードを検索したのか
上記のことはGA（グーグルアナリティクスという解析ツール）にて確認できます。
しかし、リンクを貼ったGAにその情報すらも取得できないようにするのが「noreferrer（ノーリファラー）」の役目です。
リンクは貼らせていただくけれど、相手に情報を与えたくない場合等に使います。
以上となりますが、まだまだ記事を書くことがあると思うので、次からはここを意識しながら取り組んでいきたいと思います。
