Nuxt.jsでnoindexを設定する方法
今回は、Nuxt.jsでnoindex
を設定する方法ついて解説します。
noindex
は、価値の低いページを検索結果に表示させないようにして、サイト全体の評価を下げるのを防ぎます。
noindexを設定する方法
noindex
を設定するには、<head>
に以下のような<meta>
を設定します。
<meta name="robots" content="noindex" >
Vueファイルでnoindexを設定する
記事ページのhead()
に以下のようなコードを書きます。
head() {
return {
meta: [
this.article.fields.noindex
? { hid: "robots", name: "robots", content: "noindex" }
: {},
]
}
}
Contentfulを使っているので、ArticleモデルにBoolean型のnoindex
カラムを追加しています。
他のCMSやWebフレームワークでも同じような形にできると思います。
this.article.fields.noindex
がtrue
の場合に、nofollow
のリンクが設定されます。
以上でnoindex
の設定はおわりです。
noindexを確認する
設定すると、以下のようなリンクが設定されているはずです。
実際に、インデックスされているかどうかはGoogleサーチコンソールから確認できます。
価値が低いページはnoindex
を貼っておいた方がいいでしょう。
noindexとnofollowの違い
nofollow
と類似するリンクで、noindex
があります。
noindex
との違いは、
- noindexは、検索結果に表示させないようにする。
- nofollowは、クローラーにページ内のリンクを辿らせないようにする。
ことです。
nofollow
は、外部リンクをページの評価(ページランク)に含めないようにすることです。
noindex
は、各記事ページに設定しますが、nofollow
は、外部リンクに対して設定します。
nofollowの場合
nofollow
の場合は、以下のようにリンクを設定します。
<a href="リンク先URL" rel="nofollow">リンクテキスト</a>
nofollow
は、外部リンクをサイト評価に含めたくない場合に貼っておいた方がいいでしょう。