metaタグの書き方

metaタグとは、ブラウザにどのように表示させるのか指定したり、検索エンジンに対してそのページの情報を正しく伝えたりする役割もあり、SEO対策をする上でも一役買っています。それでは、いくつかmetaタグの種類と書き方を見ていきましょう。

設定しておくべきmetaタグ

いろいろなmetaタグがありますが、最低限、設定しておくべきものを紹介します。ちなみにmetaタグを記述する場所はheadタグ内となります。

charset

「charset」は、文字コードを指定する際に使用します。まず、headタグ直下にこれを記述しておきましょう。

<meta charset="utf-8">

description

「description」は、そのページの抜粋を表示させます。基本的には、descriptionで設定された内容が検索結果に表示されるので、ユーザーに対してきちんとしたページの内容を伝えるためにも、できる限り設定しておいたほうが良いでしょう。

<meta name="description" content="抜粋を記述" />

OGP

「ogp」は、TwitterなどのSNSでシェアされた際に表示させるために設定します。SNSからの流入を重要視する場合は設定しておくと良いでしょう。

<meta property="og:title" content="ページタイトル" />
<meta property="og:type" content="ページのタイプ">
<meta property="og:url" content="ページURL" />
<meta property="og:image" content="画像のURL" />
<meta name="twitter:card" content="表示するカードの種類" />
<meta name="twitter:site" content="そのサイトのTwitterアカウント" />

この他にもいろいろなmetaタグがありますが、（例えば、モバイル端末での表示を最適化するために「viewport」を設定する）必要に応じて適宜、設定をするようにしてください。