1. ホーム > 
  2. Webサイト集客 > 
  3. SEO(検索エンジン最適化) > 
  4. SEO内部対策 > 
  5. noindexメタタグの使い方と注意点

noindexメタタグの使い方と注意点

noindexメタタグの使い方と使うときの注意点をまとめました。SEO観点からもnoindexは使い方次第で有用なメタタグですが、正しい使い方をしないと大きな問題も起きてしまいますので、細心の注意をしながら使いましょう。

  • 2017/2/12
  • 2015/6/7

Webサイトのリニューアル準備をしている時や、ある日時から始まるキャンペーン用のページを準備している時など、本番用サーバーで問題なく動くかを確認したいという事もあるかと思います。
しかし、正式公開前にGoogleなどの検索結果に表示されては困る!
そんな時、どんな対策をしたらいいのでしょうか?

検索結果に表示されなくなる、noindexタグを対象ページに設置!

noindex

noindexタグとはそのネーミングで分かる通り、検索エンジンに「このページは検索エンジンに登録しなくていいですよ」と伝えるためのタグです。

Googleなどの検索結果に表示されなくなりますので、検索エンジン経由でページを見つける事は不可能になりますが、ページが存在している場合には、ブックマークやSNS経由など、別の方法でアクセスされる場合は考えられます。

noindexタグの使い方

noindexタグは以下のように、headセクションに書きます。

<meta name="robots" content="noindex" />

headセクションのできるだけ上部、<head>の直後に書くといいでしょう。
これは、検索エンジンのクローラーにできるだけ早くnoindexタグを読み込ませて、クローラーの負担を軽くするためです。

特に大規模サイトでは、クローラーの負担をできるだけ軽くする事も重要ですので、こういったちょっとした事にも気をつけて対策をしましょう。

クローラーの訪問頻度や検索エンジンの処理のタイムラグなどにも左右されますが、遅くても数日、早ければ数分で検索結果に表示されなくなります。

ただ「検索結果から削除されるだけ」でクローラーは訪問します。
ここが気をつけなくてはいけないポイントです。

<body>内にnoindexタグを設置した場合

GoogleのGary Illyes(ゲイリー・イリーズ)氏がGoogle+に投稿した内容では、<body>内にnoindexがある場合でも機能するという事。

にわかには信じられないことですが、辻正浩氏が実験したところ本当にnoindexが機能したそうです。
body要素内のnoindex実験結果 – 辻正浩のはてなブログ

<body>内のnoindexも機能するようになったことで、理論上はブログのコメント欄に悪意のあるユーザーがnoindexを書き込むとそのページはインデックスから消えてしまう可能性があります

ただコメント欄の問題は、HTMLを無効化する処理を入れれば解決します。ページにコメント欄があるWebサイトを運営している場合、技術者にHTML無効化処理が入っているか確認してみましょう。

content=”none”を利用する時の注意

noindexタグにはcontent=”none”と指示をすることもできます。

content=”none”と指示をした場合には、noindexとnofollowを含む指示になる事に注意が必要です。

インデックスさせる必要があるページにnoneと指示をしてしまわないように気をつけましょう。

titleタグとh1タグが同じだとペナルティを受けるのか? | 海外&国内SEO情報ウォッチ | Web担当者Forum

noindexタグ設定時、robots.txtの設置は慎重に

noindexタグをページに設置するという事は、検索結果にそのページが表示されないようにしたいという事です。

ここで検索結果に表示されたくないからといって、検索エンジンのクローラーをrobots.txtでブロックしてしまうと、noindexタグの存在が検索エンジンに伝わらず、ページが検索エンジンに残り続けてしまいます。

もしクローラーにもそのページに訪問してほしくないのであれば、noindexタグが認識されて検索結果から消えたあとにrobots.txtでクローラーをブロックするようにしましょう。

テストページでnoindexタグを使うときには注意!

noindexタグは、リニューアル中のページをテストページとしてサーバーにアップロードして、関係者に確認をしてもらう時などに使われる事があります。
まだテスト段階のページが検索結果に表示されてしまっては、ユーザーが訪問してしまうかもしれません。

ただし、noindexタグが付いたまま本番環境にアップロードしてしまうと……数週間後に関係者の顔が真っ青になります。
せっかく作り直したページが検索結果から消えてしまうのですから当然です。

noindexタグはかなり強力で、たとえリニューアル前に検索結果の1位に表示されていても、ある日突然消えてしまいます。

突然インデックスが削除された!という場合、まずは冷静にこういったケアレスミスがないかどうか確認してみてください。
canonicalで別のページに正規化されていないかどうかも同様です。

noindexタグを使うシーン

それではnoindexタグを使うシーンの具体例をいくつかご紹介しましょう。

検索結果ページに設置して低品質ページの自動作成を防ぐ

WordPressなどのCMSには、CMS内に検索機能が搭載されています。

WordPress内の検索機能を使って「seo」と検索すると、下のようなURLのページが自動で作られます。
http://hogehoge.com/?s=seo

このページは、Webサイトを利用しているユーザーにとっては有用ですが、サイト内のページを検索しただけのページですので、検索エンジンにインデックスさせる必要性はありませんが、もしこのページに対して誰かがリンクを設置するなどした場合、インデックスされてしまうかもしれません。

最近ではこういった仕組みを利用したスパム行為も増えていますので、不要なページが勝手にインデックスされたりしないよう、検索結果ページにはnoindexタグを設置しておきましょう。

重複コンテンツ対応でもnoindexタグが威力を発揮

noindexタグは重複コンテンツの処理にも使えます。
同じ内容を掲載したページの統合や正規化は、301リダイレクトやcanonicalタグを使うのがセオリーですが、noindexタグで重複ページを検索エンジンから消してしまう方法でも、重複コンテンツの解消になります。

canonicalは正規化するURLを指定する必要がありますので、どうしてもシステム上の都合でcanonicalを使えない場合、noindexタグを使って重複コンテンツ対応をするといいでしょう。

しかし安直にnoindexタグを設置する前に、そのページが独自の価値を提供できないかどうか、もう一度よく考えてみてください。

例えば、タブレットの内容が書かれているページとiPadの内容が書かれているページでは、同じタブレットに関する内容が書かれていても、タブレットのページではNexusなどの他のタブレットの情報を追記して、iPadの内容が書かれているページには、より多くのiPadの情報を追記するなど、そのページ独自の価値を持たせる事で重複コンテンツを防ぐことができます。

こういったコンテンツの改修を行う事で独自の価値を持ったページが増えていけば、重複コンテンツを解消できるだけでなく、Webサイト全体の評価も高まりますので、まさに一石二鳥と言えるでしょう。

noindexタグと一緒に使われる事が多いnofollow、noarchive

nofollow(ノーフォロー)noarchive(ノーアーカイブ)タグは、noindexタグと一緒に使われる事が多いメタタグです。
それぞれのタグの意味をご紹介しましょう。

リンクを辿らないように指定するnofollowタグ

nofollowタグは検索エンジンのクローラーが、ページ内のすべてのリンクを辿って別のページに移動することを制限することができます。
ページランク(Googleが使っている評価値)を渡さないようにする事ができ、リンク先のページを(理論上は)インデックスさせないようにする事ができます。

理論上はと書いたのは、リンク先のページが別のページからリンクされている場合などは、たとえnofollowタグを付けていたとしてもインデックスされますし、最近の検索エンジンはどのページからもリンクがなくてもインデックスする事があります。

<head>セクションに記述したnofollowメタタグがページ全体のリンクに適用されるのに対して、個別のリンクに設定するnofollow属性というものもあります。
以下のように記述します。

<a href="index.html" rel="nofollow">

nofollow属性を指定しているリンクは検索エンジンのクローラーが辿らないリンクになりますので、広告目的のリンクなどに設定するといいでしょう。

不自然な発リンクがあるWebサイトにもGoogleの手動対策ペナルティが課される場合があります。
金銭の対価としてリンクを張る場合は、nofollow属性を設定するようにした方が安全です。

検索エンジンにキャッシュしないように指定するnoarchiveタグ

noarchiveタグは検索エンジンにキャッシュを保存しないように指定できるメタタグです。

こちらのページはこのブログのトップページのキャッシュですが、こういったキャッシュを保存しないように、と指定する事ができます。

ECサイトで商品内容の変遷が激しいページなどは、noarchiveタグを設定しておいてもいいかもしれませんが、通常のWebサイトであれば特に気にする必要はないと思います。

Webデザイン・プログラムスキルを身につけたい方におすすめしたいスクール

私もWebスキルを身につけるためにスクールに通いましたが、正直言って「趣味の講座レベルのスクール」が多く、実践的なスキルを身につける事ができるスクールは多くありません。

ただ全くの未経験ではWebを仕事にする事が難しいのも事実。そこでWebの実践的なスキルを身につけられるスクールをご紹介します。

スクールの価格は安くありませんので、まずは無料体験レッスンや無料カウンセリングで体験してみて、良さそうだなと思ったら本格的に取り組む方法をおすすめします。

WebCampPro(3ヶ月の超ガッチリ型)

3ヶ月の実践カリキュラムと3ヶ月のキャリアサポートで「転職・就職を保証してくれる」スクール。来校型のスクールですが、平日は毎日13:00以降、講師が常駐しているので質問や疑問もすぐに解消できるのが良いです。それぞれの学習スピードに合わせてカリキュラムが組まれますが、3ヶ月間という短期で一人前のエンジニアになるのが目標なので、かなりきつい部分もあるかと思います。

しかし裏を返せば「本気でキャリア形成をしたい」、「プログラムを仕事にしたい」という方にはピッタリなスクールです。

WebCamp(1か月の集中型)

こちらは1ヶ月の短期集中型。と言っても、最初のカウンセリングを通してカリキュラムは個人ごとのオーダーメイドなので、自分の都合で学べるのが良いです。

このご時世、直接Web制作に携わらない部署の人もWebに関する知識は必要なので、社会人の方の受講も多いです。

CodeCamp(2〜6か月のカスタマイズ型)

現役エンジニア・デザイナーからマンツーマン指導が受けられるスクールです。内容的には他のスクールにひけはとらないにもかかわらず、オンラインのみなので価格が安いのが良いです。

新卒などの社内研修でも利用されているので、社員のスキルギャップに悩んでいる方にも良いかもしれません。

「役にたった」と思ったらシェアお願いします