Webサイトの、「title」「description」って何？
titleやdescriptionは、Webページの内容を検索エンジンやユーザーに伝えるための重要な情報です。
Webサイトを制作・運営していると、「title」や「description」という言葉を目にすることがあります。titleやdescriptionは、Webページの内容を検索エンジンやユーザーに伝える重要な情報です。
この記事では、title・descriptionの基本的な意味から、SEOとの関係、具体的な設定方法まで初心者向けに解説します。
- title、descriptionとは何か
- meta情報とは何か
- title、descriptionの最適な設定方法
Webディレクター
さかき
制作会社で働く現役のWebディレクターです。日々の業務で培ったWeb制作・SEO・WordPressの知識を、初心者にもわかりやすく発信しています。実務で役立つ情報はもちろん、仕事術や無料で使えるWeb制作ツールも紹介しています。
title、descriptionとは？
titleとdescriptionは、それぞれ以下のような役割を持っています。
- title：Webサイトのタイトルを伝える
- description：Webサイトの内容を簡潔に説明する
例えば「Web制作の流れ」を解説するページなら、以下のような形で設定します。
| title | WebページのタイトルをWeb制作の流れとは？企画から公開までの基本手順を解説 |
| description | Web制作の流れを初心者向けに解説。企画・提案からデザイン、コーディング、テスト、公開まで、基本的な制作工程を紹介します。 |
titleとは？
titleは、Webページのタイトルを示す情報で主に検索結果のタイトルやブラウザのタブなどに利用されます。titleは検索エンジンにページのテーマを伝える役割もあるので、以下のようなことを意識して設定しましょう。
- ページの内容が分かるタイトルになっている
- 狙うキーワードを自然に入っている
- 重要な情報を前半に入れている
- キーワードを不自然に詰め込んでいない
設定したtitleが検索結果に必ずそのまま表示されるとは限りません。
descriptionとは？
descriptionは、Webページの内容を説明するための情報です。一般的には「meta description」と呼ばれ、検索結果ではtitleの下にページの説明文として表示されることがあります。
そのため以下のような点を意識するとよいでしょう。
- ページの内容を簡潔に説明している
- titleの内容を補足した文章になっている
- 狙うキーワードを自然に含んでいる
- 重要な情報を前半の文章に入れいてる
descriptionに設定した文章が検索結果に必ず表示されるわけではありません。Googleなどの検索エンジンの判断で、ページ内の別の文章を表示する場合もあります。
title、descriptionの文字数の目安
検索結果に最適に表示させるため、titleとdescriptionの文字数も意識して設定しましょう。目安としてtitleは30文字前後、descriptionは90〜100文字程度を意識するとよいでしょう。
| 項目 | 文字数 |
|---|---|
| title | 30〜32文字以内 ※長すぎると「…」で省略されてしまう |
| description | PC（パソコン）：120文字程度 スマホ（スマートフォン）：60〜70文字程度 ⇒両方のバランスを考えると、90〜100文字前後が望ましい |
title、descriptionはmeta情報と呼ばれることも
titleやdescriptionの情報は、制作現場ではまとめてmeta情報と呼ばれることもあります。厳密にはtitleは「metaタグ」ではなく<title>要素になりますが、コーディングの際にtitleとdescriptionを合わせて考えることも多いため、制作現場では合わせて「meta情報」として扱うことが多いです。
HTML上では、titleは<title>要素として設定します。
<title>Web制作の流れとは？企画から公開までの基本手順を解説</title>一方、descriptionは<meta name="description">というmeta要素で設定します。
<meta name="description" content="Web制作の流れを初心者向けに解説。企画・提案からデザイン、コーディング、テスト、公開まで、基本的な制作工程を紹介します。">同じmeta情報の中には、「keyword」というサイトに関するキーワードを記載する項目もあります。昔はこちらの情報もSEO効果がありましたが、現在はあまり効果がないため登録しなくても問題ないです。
title・descriptionはSEOにどう関係する？
titleとdescriptionはSEOにおいて役割が異なります。titleは検索エンジンやユーザーにページのテーマを伝えるのに対して、descriptionは検索結果でページの概要を伝えてユーザーがページをクリックするか判断する材料になります。
- title：ページのテーマを伝える
- description：ページの内容を補足する
と考えると分かりやすいでしょう。
title・descriptionを設定するときの注意点
title・descriptionを設定するときは、以下の点に注意しましょう。
ページごとに適切な内容を設定する
複数のページで同じtitleやdescriptionを使い回すと、ページごとの内容の区別がつかなくなってしまいます。それぞれのページ内容に合わせて、適切なタイトルや文章に書き分けましょう。
キーワードを詰め込みすぎない
SEOを意識して検索キーワードを盛り込みすぎるのも、ユーザーにとって分かりにくくなるため避けましょう。不自然にキーワードを何度も繰り返すのではなく、あくまでユーザー目線で読みやすい自然な文章にしましょう。
ページ内容と異なる情報を書かない
クリックしてもらうためだけにページに書かれていない情報をtitleやdescriptionに盛り込むことも、ユーザーに誤解を与えるため避けましょう。記事に関わる情報を元に、titleやdescriptionは作成しましょう。
まとめ
今回は、Webサイトのに欠かせない設定であるtitleとdescriptionについて、詳しく解説していきました。
- titleはWebサイトのタイトルを伝えるために設定する
- descriptionはWebサイトの内容を簡潔に説明するために設定する
- 文字数はtitleが30〜32文字程度、descriptionが90〜100文字程度が目安
- titleとdescriptionの設定では、ページごとの適切な内容を設定すること、キーワードを無理に詰め込まないこと、ページと異なる情報を書かないことが重要
titleとdescriptionは、Webページの内容を検索エンジンやユーザーに伝えるための基本的な情報です。SEOを意識する場合も、単純に文字数やキーワードだけを考えるのではなく、「このページには何が書かれているのかを、ユーザーに分かりやすく伝えられているか」を意識して設定することが大切です。
