質問
Google の検索エンジンでは、a タグの rel を通じてリンクに対する評価や情報の制御を行います。それらを理解した上で、HTML のコーディングを行うようにしましょう。
更新: 

Google の検索エンジンでは、a タグの rel を通じてリンクに対する評価や情報の制御を行います。
それらを理解した上で、HTML のコーディングを行うようにしましょう。

rel タグについて

nofollow

a タグの rel 属性にnofollowを設定することで、検索エンジンにリンクを辿らないでほしいと伝えます。
通常のリンクは、リンクジュース(ページ評価)をリンク先ページに渡しますが、nofollow 属性が設置されているリンク先には、評価を渡しません。

https://searchengineland.com/infographic-nofollow-tag-172157

ユーザーが編集可能なデータや、広告等については nofollowをつけることをおすすめします。

noreferrer

a タグの rel 属性に noreferrer を付けることで、参照先に対して参照元のリンクを渡さないようにすることができます。
参照元リンク情報を渡さないことで、渡したくない情報が URL リンクに含まれていても大丈夫になります。

noreopener

a タグが、target="_blank"を保つ場合は、rel 属性にnoopenerをつけましょう。
noopenerをつけることで、新しいタブを別スレッドで開くことができます。

これをつける一番の理由はセキュリティです。
noopenerを付けないと、JavaScript で window.opener というオブジェクトが操作できるようになり、 新しいタブで開いたページから元タブのページの操作が可能となります。

コーディングにおける rel の重要性

上記の rel 属性の役割を正しく理解して実装を行うようにしましょう。これによって、サイトをセキュアにして、Google の検索エンジンにサイトの正しい価値を伝えることができます。

この記事が気に入ったら応援お願いします🙏
8
ツイート
LINE
Developer
Price Rank Dev
I use Next.js (React) and Firebase (Firestore / Auth) for development. We are also developing APIs for Ruby on Rails and GraphQL. Our team members are 6 Vietnamese and Japanese engineers.