目次
title要素のSEO対策
title要素は「検索結果の見出し」と「お気に入り（ブックマーク）のラベル」に使用されるテキストを指定します。SEO対策で最も重要な対策の1つです。テキストは検索で優先したいキーワードを先頭にからめた内容にします。サイトのタイトルではなく、ページごとのタイトルを指定する必要があり、すべてのページのtitle要素のテキストが違うことが重要です。
titleタグ内に入れる文字数は、PCとスマホとも全角で約30文字までが検索結果に表示されます。文字数をオーバーした場合、あふれた部分は「…」で表示されます。
meta descriptionとは
meta descriptionは、検索結果でのページの説明文が表示されます。指定は、headタグ内に<meta name="description" content="説明文">を記述します。
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>タイトル</title>
<meta name="description" content="説明文">
</head>
<body>
</body>
</html>
meta descriptionのSEO的な対策
meta descriptionを指定しない場合
meta descriptionを指定しない場合、検索サイトはページの先頭のテキストを使い説明文を生成します。そのため意図しない説明文になる可能性があります。必ず設定しておきましょう。
meta descriptionの頻度と内容
サイト全体の説明文ではなく、ページごとの説明文を入れていきます。検索サイトは、トップページ以外も検索結果として表示します。ページの内容が把握しやすい説明文にしましょう。
meta descriptionの文字数
PCとスマホで検索結果に表示される文字数が違います。文字数を超えた部分は、「…」で表示されます。下記は文字数の目安です。
- PCの場合…全角で約120文字
- スマホの場合…全角で約50文字
「meta keywords」はSEO対策で重要か
meta keywordsは、ページ内のキーワードを列挙する指定で、古いSEO対策で重要視されていました。現在、Google, Bingなど検索サイトは、meta keywordsを重要視しないと表明しています。使っても問題はないですが、入れることで順位の変動はないと思ってください。
Googleのmeta keywordsの扱いについて（英語）
Google does not use the keywords meta tag in web ranking
下記は「meta keyword」の指定方法です。meta descriptionと同様、headタグに記述します。各キーワードはカンマで区切ります。カンマの前後にスペースを入れてはいけません。
<meta name="keywords" content="キーワード,キーワード,キーワード">
ここまでのまとめ
初級では、PCサイトの制作が最低限、作成できる内容でまとめています。最後に、ここまでの内容の作業が行えるようにindex.html, reset.css, style.cssと各フォルダをまとめた基本フォーマットを下記からダウンロードできるようにしてあります。
基本フォーマット
まとめ
- meta descriptionは検索一覧に表示される説明文
- meta descriptionの内容は、ページごとの説明になるようにする
- 同じくtitile要素も、ページごとのタイトルになるようにする