「Webページのタイトルはどこにありますか」という問いには、答えが三通りあります。画面のどこに表示されるのか。データとしてどこに書かれているのか。そして、自分の目でどこを見れば確かめられるのか。三つが混ざったまま調べると、検索結果に出ている文字列、ブラウザのタブに出ている文字列、ページ上部の大きな文字がそれぞれ違っていて、どれを採用すればよいのか判断できなくなります。
参考文献にWebページのタイトルを書き写す場面でも、自社サイトのタイトルを直そうとする場面でも、詰まる原因はほぼ共通しています。ページタイトルとサイト名とh1見出し、三つが画面上の近い位置に並んでいるため、境目が見えにくくなっているのです。
本記事では、表示される場所、記述されている場所、確認する手順の順に切り分けます。あわせて、検索結果に出ているタイトルが設定した文言と食い違う理由や、レポートに書き写すときの判断手順も扱います。
- ページタイトル・サイト名・h1見出しの見分け方
- Webページのタイトルが表示される五つの場所
- HTMLのどこに書かれ、CMSではどこで設定するのか
- 表示中のタイトルを省略なしで取り出す手順
- 検索結果のタイトルが設定した文言と食い違う理由
Webページのタイトルが「どこ」か分からなくなる理由
ひとつのページを開くと、タイトルらしき文字列が最低でも三箇所に現れます。ブラウザ上部のタブ、ページ最上部のロゴや社名、そして本文の一番大きな見出しです。三つはそれぞれ役割が違い、一致することもあれば、まったく別の文言になることもあります。
呼び方 | 実体 | 主に表示される場所 | ページごとに変わるか |
|---|---|---|---|
ページタイトル | HTMLのtitle要素 | 検索結果、ブラウザのタブ、ブックマーク | 変わる |
サイト名 | サイト全体の名称 | 検索結果の上部、ヘッダーのロゴ横 | 変わらない |
h1見出し | 本文最上部の大見出し | ページ本文の中 | 変わる |
判別に迷ったときの手掛かりは単純です。ページごとに変わるのがページタイトル、全ページで同じならサイト名という切り分けで、ほとんどの場面は片付きます。同じサイトの別のページを開き、文字列が入れ替わるかどうかを見比べてください。
見分けを難しくしている要因がもうひとつあります。サイト名はロゴ画像として置かれていることが多く、文字として選択できないケースが珍しくありません。画面上ははっきり見えているのにコピーできないため、代わりに本文の大きな見出しを写してしまい、ページタイトルとサイト名が入れ替わる取り違えが起こります。
さらに、ページタイトルの末尾にサイト名がくっついている構成も一般的です。タブに「送料と配送日数について｜◯◯ストア」と出ていた場合、これは二つの情報を区切り文字でつないだ一本の文字列であり、HTMLの上では全体がひとつのtitle要素です。サイト名の部分だけが別のデータとして保持されているわけではありません。
Web担当者検索結果に出ている青い文字を、そのままページのタイトルだと思っていました。あれは違うのですか。
Writers-hub編集部
多くの場合は一致しますが、必ずではありません。Googleは検索結果に出す見出しを、ページのtitle要素だけでなく、本文の見出しやほかのサイトからのリンク文字列を参照して組み立てることがあります。原本を確かめたいときは、あとで説明する手順でHTMLを直接見るのが確実です。
関連記事：SEO記事の書き方完全ガイド｜上位表示を実現する18のテクニックと対策
Webページのタイトルが表示される五つの場所
タイトルは一箇所に出て終わるものではありません。ページを識別するラベルとして、読者が入口に立つほぼすべての場面で使い回されています。どこに出るかを把握しておくと、どこを直せば何が変わるのかも見当が付きます。
検索結果のタイトルリンク
Google検索の一覧で、青字のリンクになっている行がタイトルリンクです。クリックするかどうかの判断材料として最も読まれる部分で、ここに出る文言が流入数を左右します。なお、タイトルリンクの上に小さく添えられている運営元の名前は、タイトルとは別枠のサイト名です。同じ行に見えていても、扱いは分かれています。
ブラウザのタブ
タブに並ぶ文字列も、title要素の内容が読み取られたものです。ただし ブラウザのタブは幅で省略されるため原本の確認には向かない 点は押さえておいてください。タブを何枚も開いていれば数文字で切れますし、マウスを乗せて出るツールチップの挙動もブラウザによって差があります。
ブックマークと閲覧履歴
ページをブックマークに追加すると、名前欄の初期値としてtitle要素の内容が入ります。履歴一覧に並ぶ文字列も同じです。あとから過去に見たページを探す作業は、実質的にタイトルを手掛かりにした検索になっています。
SNSでシェアしたとき
XやFacebookなどにURLを投稿すると、カード状のプレビューが表示されます。ここに出る見出しは、OGPと呼ばれる共有用のメタ情報が設定されていればそちらが優先され、なければtitle要素が使われるのが一般的です。SNS上の文言と検索結果の文言が違っていても、設定ミスとは限りません。
ほかのサイトからのリンク文字列
外部のサイトが記事を紹介するとき、リンクの文字になるのはページタイトルであることがほとんどです。引用しやすい形に整えたタイトルは、そのまま被リンクの文字列として広がっていきます。
タイトルは「検索結果に出る文言」ではなく「ページを識別するラベル」です。検索結果、タブ、ブックマーク、SNS、外部リンクと、読者がページに触れる入口のほぼすべてで使われます。直す価値がある部分だと言えるのは、影響範囲がここまで広いからです。
関連記事：SEOのタイトルに記号は使える？【】や｜の使い分けと避けたい例
タイトルの原本はHTMLのhead内にある
表示場所をいくら見て回っても、そこにあるのは複製です。タイトルの原本はHTMLのhead内にあるtitle要素であり、ほかの表示はすべてここから読み取られています。
<head>
<meta charset="utf-8">
<title>送料と配送日数について｜◯◯ストア</title>
</head>開始タグと終了タグに挟まれた部分が、そのページのタイトルです。head内はブラウザの画面に描画されない領域なので、ページをどれだけスクロールしても本文中には現れません。「探しても見つからない」と感じる原因の多くは、描画されない場所を画面上で探していることにあります。
CMSではどこに入力するのか
WordPressをはじめとするCMSを使っている場合、HTMLを直接書く機会はほとんどありません。投稿画面に入力した文言が、ページを書き出す段階でtitle要素に流し込まれる仕組みになっています。
WordPressには「タイトル」と名の付く入力欄が複数あります。投稿編集画面の上部にある記事タイトル、設定の一般にあるサイトのタイトル、そしてSEO系プラグインを導入している場合の独自タイトル欄です。プラグイン側に入力があるとそちらが優先されるため、記事タイトルを直したのに検索結果の文言が変わらないときは、プラグインの設定を先に疑ってください。
テーマ側で、記事タイトルの後ろにサイトのタイトルを自動連結する処理が入っている場合もあります。投稿画面には「送料と配送日数について」としか書いていないのに、タブには社名まで並んで出るのは、書き出しの段階で連結されているためです。入力欄に見えている文字列と、実際に出力されるtitle要素は一致しないことがあるという前提で確認したほうが、無駄な修正を避けられます。
関連記事：SEOのタイトル文字数は何字が目安か｜表示が切れる仕組みと決め方
表示中のタイトルを省略なしで取り出す手順
参考文献に書き写す場合も、自社ページを棚卸しする場合も、途中で切れた文字列では使えません。省略されない形で取り出す手順は次のとおりです。
確認したいURLを開きます。スマートフォンではソースを表示する操作が限られるため、可能ならパソコンで開いてください。
Windowsでは Ctrl キーと U キー、macOSでは Command キーと Option キーと U キーを同時に押します。右クリックのメニューから「ページのソースを表示」を選ぶ方法でも構いません。
ソースが開いたら、ページ内検索で title という文字列を探します。head内の比較的上のほうに、開始タグと終了タグで挟まれた一行が見つかります。
タグの内側だけを選択してコピーします。区切り文字より後ろにサイト名が入っている構成なら、用途に応じて前後を分けて扱ってください。
ソース表示に抵抗がある場合は、ブックマーク追加のダイアログを使う方法もあります。
Windowsでは Ctrl キーと D キー、macOSでは Command キーと D キーを押すと、ブックマーク追加のダイアログが開きます。名前欄に初期値としてタイトルの全文が入っているため、そこをコピーしてから追加を取り消せば、ブックマークを増やさずに文字列だけを手に入れられます。多くのブラウザで同じ操作が通ります。
取り出した文字列は、そのまま出典欄やページ一覧の管理表に貼り付けられます。三つの方法のうち、全文を確実に取れるのはソース表示とブックマークのダイアログで、タブから読み取る方法は確認の下見までにとどめるのが安全です。
検索結果のタイトルが設定した文言と違うことがある
原本を確認したあと検索結果と見比べると、文言がずれている場合があります。設定が反映されていないのではなく、Googleが表示用に別の文字列を選んでいることが原因です。
Google検索セントラルの資料では、タイトルリンクを生成する際にtitle要素のほか、ページ内の主要な見出し、目立つテキスト、ほかのサイトからのリンク文字列などを参照する場合があると説明されています。
つまり 検索結果の見出しは原本ではなく、Googleが選んだ表示用の文字列 です。参考文献としてページのタイトルを記載するなら、検索結果からコピーするより、ページを開いてtitle要素を確認するほうが正確になります。ここを取り違えると、引用元が実在するタイトルと一致せず、確認した人が同じページにたどり着けなくなります。
書き換えが起きやすいのは、タイトルが極端に長い場合、複数ページで同じ文言を使い回している場合、キーワードを詰め込んで本文の内容と噛み合っていない場合などです。反対に、ページの中身を素直に表した簡潔なタイトルは、そのまま採用されやすい傾向が見られます。書き換えられたということは、Googleがそのタイトルではページの内容を説明しきれていないと判断したサインだと受け止めておくと、直す方向を決めやすくなります。
なお検索結果では、タイトルリンクとは別の行にサイト名が表示されます。運営者側からサイト名を明示的に指定する方法も公開されています。
設定したタイトルは、検索結果でそのまま出ていますか
タイトルを直しても表示が変わらない、キーワードは入れているのにクリックされない。書き換えが続く状態は、タイトルの文言だけでなく、ページの内容と検索している人の目的がずれていることが原因になっている場合が少なくありません。Writers-hubでは、検索結果での見え方から実際の流入までを通して点検し、どのページから直すかの順番を整理する支援を行っています。
レポートや参考文献に書き写すときの判断
学校のレポートや社内資料の出典欄では、Webページのタイトルとサイトの名称を分けて書くよう求められることがあります。どちらがどちらか迷ったときは、次の順で確かめてください。
前章の手順で、省略のない文字列を取り出します。検索結果の青字をコピーするやり方は、書き換えの可能性があるため避けます。
縦棒や全角ダッシュ、中黒などで分かれている場合、前半がページタイトル、後半がサイト名という構成が多く見られます。
同じサイトの別ページで後半の文字列がそのまま残っていれば、それがサイト名です。前半だけが入れ替わるなら、前半がページタイトルにあたります。
トップページのタイトルや、フッターの著作権表記に載っている名称と照らし合わせ、表記のゆれがないかを確かめます。
区切り文字を使わず、ページタイトルだけをtitle要素に入れているサイトもあります。その場合はヘッダーのロゴ横の表記や運営者情報のページに載っている名称をサイト名として採用すると、表記の食い違いを避けやすくなります。判断に迷ったときほど、画面で見えているものより運営者が自分で名乗っている表記を優先するほうが確実です。
運営側がタイトルで読者を迷わせないための整え方
ここからはサイトを運営する立場の話に移ります。読者が「このページのタイトルはどれか」と迷う状態は、検索エンジン側の判断も同じように揺れていると考えて差し支えありません。最低限そろえたい条件を挙げます。
- 全ページに固有のタイトルを設定している
- サイト名の表記が全ページで統一されている（記号や英字表記のゆれがない）
- title要素とh1見出しで、主要な語が共通している
- タイトルの文言と、ページに書かれている内容が一致している
- 対策したい語をタイトルの前方に置いている
文字数については「30文字前後」という数字がよく挙がりますが、Googleが上限を公表しているわけではありません。30文字前後という目安は表示幅からの経験則であり、閲覧している端末や画面サイズによって表示できる量は変わります。前方に重要な語を置いておけば、後半が切れても意味が通る並びになります。
逆に、次のような状態は読者にも検索エンジンにも不親切です。
- 全ページのタイトルが会社名だけで、内容の区別が付かない
- 同じキーワードを一つのタイトル内で三回以上繰り返している
- タイトルに書かれた内容が本文に存在しない
- 記号や装飾が多く、肝心の語が後半に押しやられている
タイトルを変更した場合、検索結果に反映されるのは再クロールを経たあとです。更新頻度の高いサイトなら数日で入れ替わることもあれば、しばらく古い文言が残る場合もあります。変更直後に順位が動いたように見えても、影響を判断するのは数週間おいてからのほうが安全でしょう。
Webページのタイトルに関するよくある質問
完全に一致させる必要はありません。title要素は検索結果やタブというページの外側で読まれ、h1はページを開いた読者が読みます。主要な語は共通させたうえで、title側にはサイト名や補足の語を、h1側には読み進めやすい表現を置く形が扱いやすい構成です。
再クロールと再評価を経てから反映されるため、即時ではありません。更新頻度の高いサイトなら数日、そうでなければ数週間かかる場合もあります。Search Consoleからインデックス登録をリクエストすることで、確認を早められることがあります。
トップページやサービスページのように、社名で検索されることが想定される場面では有効です。一方、情報提供を目的とした記事ページでは、会社名を前に置くと本題の語が後方へ押しやられます。末尾に添えるか、記事によっては省く判断もあります。
構造化データでサイト名を指定する方法がGoogleから案内されています。ただし指定した内容が必ず採用されるとは限らず、サイト内での表記が統一されていることが前提になります。
表示幅の都合で省略されているだけなら、評価上の問題とは考えにくいところです。ただしクリックを判断する材料は欠けるため、前半だけを読んで内容が推測できる並びに直しておくと、読者にとって分かりやすくなります。
まとめ
Webページのタイトルがどこにあるかは、三つの層に分けて考えると迷いません。原本はHTMLのhead内にあるtitle要素。表示されるのは検索結果、ブラウザのタブ、ブックマーク、SNSのプレビュー、外部サイトのリンク文字列。確認するならソース表示か、ブックマーク追加のダイアログ。この順に見ていけば、サイト名やh1見出しとの取り違えも起きにくくなります。
覚えておきたいのは、検索結果に出ている文字列が原本とは限らない点です。Googleは表示用に別の文言を組み立てることがあり、参考文献に書き写す場合も、自社サイトを点検する場合も、原本を直接開く習慣が誤りを防ぎます。
運営する側にとって、タイトルは各ページで最初に読まれる文言です。全ページに固有の文言を置き、サイト名の表記をそろえ、本文の内容と食い違わせない。ここまで整っていれば、読者がどのページを開いているのか分からなくなる場面は減ります。合同会社Writers-hubでは、キーワード設計から記事制作、公開後の検索での見え方の点検までを一貫して支援しています。
どのページに、どの語でタイトルを付けるか決まっていますか
タイトルの文言を整える作業は、そのページで何を調べている人を迎えるのかが決まっていないと進みません。ページと検索キーワードの対応が曖昧なまま個別のタイトルだけを書き換えても、内容の似たページ同士で読者を取り合う状態は残ったままです。Writers-hubでは、既存ページの棚卸しからキーワードの割り当てまでを整理し、どのページから着手するかを決めるところを支援しています。
