この記事の目的
今やビジネスにおいてコンピュータ・情報・通信などを中心とする「IT用語」に対する知識は欠かせません。
あまり馴染みがない各分野のIT用語を、なるべく専門用語を使わずに解説していきます。
この記事の対象読者
Web制作を始めたばかりの人。
自社のWebマーケティングを任された人。
専門用語についていろいろ知りたい人。
Webマーケティングを行なっているが、言葉の定義を再確認したい人。
など、Webに限らずDXに携わるすべての方に。
metaタグとは
metaタグ（メタタグ）とは、Web サイトの情報を記述するHTMLタグです。
metaタグには様々な情報が載せられます。Webサイトのテーマやタイトル、どのような内容が掲載されているのかといった情報を記載し、検索エンジンやブラウザに伝えます。これらの特性からSEOにおいて必須知識となります。
metaタグはHTMLのヘッダー情報にあたる<head>~</head>要素内に記載するため、Webサイトを閲覧中のユーザーには見えません。
metaタグの役割
アクセス前のユーザーに伝える
metaタグにはページのタイトル（titleタグ）や、ページの概要を記述するタグ（descriptionタグ）があります。これらのタグで記述したテキストは、検索結果画面やSNSのシェア情報として表示され、アクセス前のユーザーにWebサイトの情報を一目で伝える役割を果たします。
ユーザーは自分が求めている情報があるコンテンツかどうかを、ページのタイトルや概要を見て判断するため、metaタグの設定はアクセス数に直結する重要な要素です。
検索エンジンに伝える
metaタグの中には、検索エンジンに向けたタグがあります。
Webサイトはサーバーに設置しておくと自動的に検索エンジンが巡回にやって来て、検索結果に表示されるようになります。そこで、巡回に来てほしくないページや、検索結果に載せたくないページがある場合、「巡回拒否」（nofollow）や、「検索結果に表示させない」(noindex)といった旨を検索エンジンに伝えるmetaタグがあります。これらのタグは主にSEO評価の低下を防ぎ、自サイトを守るために用いられます。
ブラウザに伝える
metaタグにはブラウザがページを表示させるために必要な情報を記載するタグがあります。CSSやフォントなどの外部ファイル読み込み、デバイスに応じた画面の幅(viewport)、文字化け対策(charset)などを設定できます。これらのタグはWebサイトを正しく表示させるために必須のタグです。SEO対策ではほぼ触る必要のない部分ですが、順番が変わるだけでWebサイトが正しく動作しなくなるなど、修正する際は注意が必要です。
SEO対策に重要なmetaタグ
metaタグには様々な種類がありますが、ここではSEO上、必須とも言えるmetaタグを紹介していきます。
title（タイトル）タグ
titleタグはページのタイトルを設定するタグです。検索結果画面に大きく表示される内容ですので、必ず設定しておきましょう。30文字程度が推奨されます。
設定する際はheadタグ内に以下のように記述します。
<title>ここにページのタイトルを記述 </title>
meta description（メタ ディスクリプション）
descriptionタグはWebサイトの内容を100～120文字程度で要約した文章を記述します。検索結果画面にページの概要として表示されます。文字数が長すぎると、表示しきれない部分は省略されますので、文章の前半（50文字目程度）に大事なキーワードを織り込むようにしましょう。
設定する際はheadタグ内に以下のように記述します。
<meta name=”description” content=”ここにメタディスクリプションを記述”>
文字コード
metaタグのcharset属性で、HTML文書をどの文字コードでエンコードするかを指定します。文字コードが合っていないと文字化けします。日本語の場合「utf-8」、「shift_JIS」、「euc-jp」が使用されるケースが多いですが、基本的にはutf-8で良いでしょう。utf-8は世界中のほとんどの言語をサポートしています。
設定する際はheadタグ内の上の方に以下のように記述します。
<meta charset=”utf-8”>
viewport タグ
viewportタグはPCやモバイルデバイスの画面サイズを最適化させるための設定で、レスポンシブデザインには必須のタグです。
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
noindex／nofollow
noindexタグを設定したページは検索エンジンにインデックスされず、SEO評価の対象外となります。サンクスページやエラーページ、コンテンツの質が低いページに設定し、サイトの評価が下がらないようします。
nofollowタグは、ページ内に設置した外部リンクをクロールさせないように検索エンジンに要求します。リンク一つ一つ個別にnofollowを設定することも可能ですが、metaタグにnofollowを設定すると、ページ内のすべてのリンクに対してnofollowが適用されます。
設定する際はheadタグ内に以下のように記述します。
<meta name=”robots” content=”noindex,nofollow”>
まとめ
metaタグはユーザーとしてWebサイトを閲覧しているだけだと、全く意識することは無いと思います。SEOやWebマーケティングにおいて、metaタグを最適化することで、クリック率向上や、検索結果上位表示の材料になるため、適切に設定するようにしましょう。
