タイトルタグ

HTML の title タグ。検索結果やブラウザタブに表示されるページのタイトル。表示幅に応じて切り詰められるため、何を先頭に置くかが要になる。

タイトルタグ (title tag) は、HTML の <title> 要素で指定するページのタイトルです。検索結果のクリック可能な見出し、ブラウザのタブ、ブックマーク名、SNS でのシェア時のタイトルとして表示されます。検索結果で最初に読まれる部分であり、そのページを開くかどうかの判断がここでほぼ決まるため、SEO の実務では優先して整える要素です。

Google は <title> 要素の長さに制限はないとしており、検索結果のタイトルは必要に応じて端末の表示幅に合わせて切り詰めると説明しています。したがって「何文字までなら全部出る」という公式の閾値は存在しません。実務では日本語で 30 文字前後、英語で 50〜60 文字前後を作業上の目安に置くことが多いものの、これは表示を観察した経験値であり、同じタイトルでもデスクトップとスマートフォンでは切れる位置が変わります。切れるのは末尾からなので、重要な語やメッセージを先頭側に寄せ、後半は切れても意味が壊れない補足に充てるのが安全です。たとえば「文字数カウントの方法と注意点 - 初心者向け完全ガイド」であれば、末尾のサイト名や修飾句が落ちても主旨は伝わります。

書き方について Google が挙げている指針は、内容を説明していて簡潔であること、キーワードの詰め込み (キーワードスタッフィング) を避けること、複数ページで同じ文言を使い回さないこと、サイト名を入れる場合は本文と同じ言語・書記体系で書くことなどです。「ホーム」や「プロフィール」のような、何のページか分からない語だけのタイトルも避けるよう明示されています。サイト名をタイトルに含める場合は、末尾に「| サイト名」や「- サイト名」の形式で付加するのが実務で広く行われている書き方です。ここで注意したいのは、サイト名の分だけ本題に使える枠が減る点です。サイト名が長いサイトでは、切り詰めが起きる環境で本題の末尾から先に消えていくため、サイト名を入れるかどうかはページの種類ごとに判断する余地があります。

Google は設定されたタイトルタグをそのまま検索結果に表示するとは限りません。検索結果に出す見出し (タイトルリンク) の生成元として公式に挙げられているのは、<title> 要素の内容、ページ上で大きく見えている見出し、<h1> などの見出し要素、og:title、スタイルで目立たせた大きな文字、本文中の文、ページ内のアンカーテキスト、そのページを指すリンクの文言、構造化データなどです。つまり書き換えは例外的な事故ではなく、仕組みとして最初から想定されている挙動です。書き換えを避けたいなら、<title> と画面上の見出しの内容を食い違わせないこと、そして <title> だけに情報を持たせて本文側に手がかりを置かない状態を作らないことが効きます。

タイトルタグとメタディスクリプションは混同されがちですが、役割が異なります。タイトルタグは検索結果の見出しになる文言で、ページが何について書かれているかを検索エンジンと読者の両方に伝える役割を持ちます。メタディスクリプションは見出しの下に出る説明文で、Google はこれをランキングに用いないと公表しています。どちらもクリックするかどうかの判断に関わるため、見出しで主題を言い切り、説明文で補うという役割分担で組み立てるのが実務的です。Open Graph の og:title はタイトルタグとは別に設定でき、SNS でのシェア時に表示されるタイトルを変えられます。ただし og:title は検索結果のタイトルリンクの生成元にも挙げられているため、両者を大きく食い違う内容にしておくと、意図しない側が採用されることがあります。

文字数カウントの観点では、タイトルタグは文字数制限が最も意識される HTML 要素の一つです。日本語の全角文字と英語の半角文字では 1 文字の占める幅が異なるため、同じ文字数でも表示される長さが変わります。たとえば全角 30 文字のタイトルと、半角英数字 30 文字のタイトルでは、後者のほうが横幅は小さく収まります。全角と半角が混在するタイトルでは、文字数だけを見て収まり具合を判断することはできません。実務では文字数カウントツールで長さを把握しつつ、切れ位置は実際の検索結果や幅を合わせたプレビューで確かめる、という二段構えを取ります。数える対象は切り詰められる前の原文であり、切れた後の見た目を基準にすると、末尾に置いたサイト名や補足が落ちていることに気付けません。

この記事を共有