結局METAタグはどれを入れたら良いか困った時に見るページ

2017年9月29日 2018年5月23日

METAタグで、どれを入れたら良いのか忘れちゃった時に見返せるページがあったら良いな、と思ったので、最低限必要・不必要なMETAタグを集めて紹介します。

Googleがサポートしているメタタグ

google

charset

ページのコンテンツタイプと文字セットを定義します。

使用例

ブラウザの文字コードをUTF-8に設定します。
IEの自動互換表示切り替え機能対策で、ドキュメントモードを固定します。

description

ページの簡単な説明を表す文をcontentに入れます。
検索結果に表示されるスニペットの一部として使用されます。

SEO的に重要とされている部分で、複数のページに同じ内容が入れられていると「重複コンテンツ」と認識されるので要注意。

robots

既定値は「index, follow」で特に指定する必要はありません。

ページを検索エンジンに登録したくない場合はnoindex,nofollowを指定します。

noindex: ページをインデックスに登録しないようにします。
nofollow: Googlebot がページのリンクを追跡しないようにします。

noindex, nofollow と同じ意味のnoneでも可。

google-site-verification

サイトの最上位のページにこのタグを挿入すると、Search Console(旧ウェブマスターツール)で所有権を確認できます。

contentにSearch Console指定のトークンIDをコピペしてください。

msvalidate.01

Bing Web マスター ツールで所有権を確認できます。

contentに指定のトークンIDをコピペしてください。

http-equiv=”refresh”

一定の時間が経過するとユーザーを新しい URL にリダイレクトします。

使用例

但しこれはW3C では非推奨

Google ではサーバーサイドの 301 リダイレクトを使用することをおすすめしています。

.htaccessの編集・設置が必要です。

引用:Google がサポートしているメタタグ
https://support.google.com/webmasters/answer/79812?hl=ja

スマホサイトやレスポンシブサイトで使うMETAタグ

スマホサイトやレスポンシブサイト

format-detection

連続した数字を電話番号と誤認識して自動リンクする機能を停止させます。

viewport

推奨されるviewportの書き方は以下の通り。

下記ページでは、”minimum-scale、maximum-scale、user-scalable を避ける”とハッキリ言われています。
特に、user-scalableはiOS10以降無視されるようになり、iPhone等では効きません(ズーム可能)。

引用:ビューポートを設定する
https://developers.google.com/speed/docs/insights/ConfigureViewport?hl=ja

METAタグまとめ

まとめると、以下のMETAタグはデフォルトで入れておいて良いと思います。

google-site-verificationやmsvalidate.01は必要に応じて。

SEO的に非推奨のMETAタグ

もしこのタグを使っていたら、即削除したほうが良いでしょう。
誰かに「時代遅れ」と鼻で笑われているかも知れません。

お気軽にコメントをどうぞ。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください