ブラウザでホームページを開くと、タブの部分にページの名前が小さく表示されます。
普段はあまり意識しない場所ですが、ここが「ホーム」や事業名だけだと、何のページなのか見分けにくくなってしまいます。
ページタイトルの見直しは、専門的な知識がなくても、公開中のページをブラウザで開くところから始められます。内容に合った名前になっているか、ほかのページと区別できるかを確かめる手順をまとめました。
ページタイトルはページを見分けるための名前
いくつかのページをタブで開いたまま作業していると、どれがどのページだったか分からなくなることがあります。
タブに「ホーム」や事業名だけが並んでいると、目的のページへ戻るたびに一つずつ開いて確かめなければなりません。
このタブに表示される文字が、ページタイトルです。そのページの話題や目的を表す名前で、ホームページの内部(HTML)では「title要素」と呼ばれる場所に書かれています。
意味のあるページタイトルがあると、利用する人がページを見分けやすくなります。
画面を見ながら操作する方にとっても、音声の読み上げ機能を使う方にとっても、今どのページにいるかを知る手がかりになるからです。
この記事で見直すのは、タブなどに文字で表示されるページ名です。タブの横に出る小さなアイコン(ファビコン)やロゴ画像とは確認を分けておくと、何を見ればよいかがはっきりします。
最初に役割の違うページを三つ開く
ホームページ全体を一度に調べようとすると、ページの多さに手が止まりがちです。最初は三つのページに絞ると、無理なく始められます。
トップ・案内・問い合わせなどを選ぶ
選ぶのは、役割がそれぞれ異なるページです。
たとえばトップページ、サービスや講座の案内ページ、問い合わせページの三つ。教室やサロンのように来ていただく形の事業なら、アクセス案内のページを選ぶのもよいでしょう。
同じブラウザで三つを別々のタブに開き、表示された文字をそのままメモしてください。途中で切れている場合は、タブにマウスポインターを重ねると全体が表示されるかも見ておきます。
表示のされ方はブラウザや端末によって違うため、実際に確認できた範囲を書き留めておけば十分です。
この段階では、良い・悪いを判断しなくても大丈夫です。今どう表示されているかを知ることが先になります。
URLと画面内の見出しも一緒に記録する
ページタイトルの横には、そのページのURLと、画面の中でいちばん大きく表示されている見出しも書いておきましょう。並べておくと、名前と中身が結び付いているかを後から見比べられます。
記録する項目は、次の四つで足ります。
- 公開URL
- ブラウザのタブに表示されたページタイトル
- 画面内の主な見出し
- そのページで案内している内容
内容が伝わる言葉になっているか見る
記録ができたら、ページタイトルを一つずつ読んでみます。確かめたいのは、そのページの中身が伝わる言葉になっているかどうかです。
何のページか一言で言えるか
W3C WAIは、ページタイトルがそのページの話題や目的を表していることを大切な条件としています。タイトルだけを読んで、何のページか一言で言えるかを目安にすると分かりやすいです。
たとえば「講座」だけでは、講座の一覧なのか、特定の講座の詳しい案内なのかが分かりません。「講座一覧」「初心者向けバレエ講座」のように役割を書き分けると、ページを見分けやすくなります。
とはいえ、長い説明文を入れる必要はありません。
W3Cが紹介している技法(G88)では、主題が分かること、ほかの文脈から切り離して読んでも意味が通ること、短いことが確認のポイントとして挙げられています。
気をつけたいのは、短さと詳しさのどちらかに偏りすぎることです。短さを優先してどのページにも「ご案内」と付けると違いが消えてしまい、反対に特徴をすべて詰め込むと、タブでは後半が見えなくなります。
一つの考え方として、ページごとの言葉を先に置き、事業名やサイト名を後ろに添える形があります。区切り方や並べる順番は、ホームページ全体の方針に合わせてそろえておくと整って見えます。
中身にない言葉が入っていないか
タイトルに書かれていることが、実際のページに見当たらない場合もあります。「料金」とあるのに料金の情報がない、「予約」とあるのに問い合わせの案内しかない、といったずれです。
Googleも公式資料の中で、title要素にはページの内容を表す説明的で簡潔な文字を使うよう勧めています。検索されそうな言葉を何度も並べても、読む人がページを見分ける助けにはなりません。
内容を更新したページでは、以前のサービス名や古い年号がタイトルに残っていないかも見ておきたいところです。見つけてもその場では直さず、現在の情報と照らし合わせる項目としてメモしておきます。
ページ同士を区別できるか見比べる
一つひとつのタイトルを確かめたら、今度は開いている三つのタブを並べて見比べてみてください。
同じ名前が並んでいないか
すべてが事業名だけになっていないか、ページごとの名前が途中で切れていないかを見ます。トップページと問い合わせページが同じ名前なら、開いてみるまでどちらか分かりません。
「トップ」「お問い合わせ」のように、そのページの役割を表す言葉が見えているかがポイントです。
W3Cの技法でも、サイト内でそれぞれ異なるタイトルにすることが役立つとされています。Googleもページごとに内容を表す異なる文字を使い、同じ定型文の繰り返しは避けるよう案内しています。
同じ種類のページが複数ある場合も比べておきましょう。講座の詳細ページが三つあるなら、講座名など、それぞれに違う情報が入っているかを確認します。
すべてのページでまったく違う言い回しを考える必要はなく、見る人が目的のページを選べるだけの違いがあれば十分です。
事業名の繰り返しで見えにくくなっていないか
事業名やサイト名をページタイトルに入れること自体は、まったく問題ありません。W3Cの技法でも、どのサイトや組織のページかが分かる情報は役立つ場合があるとされています。
確かめたいのは、長い事業名が先頭に来ることで、ページごとの名前が見えなくなっていないかです。タブの幅が狭い画面では、先頭の数文字しか表示されないこともあります。
事業名を前に置くか後ろに置くかは、サイトの方針や制作環境によって変わります。
決まった正解を探すより、パソコンとスマートフォンの両方でページを見分けられるかを基準にすると選びやすいでしょう。
画面内の見出しとページタイトルを照らし合わせる
ページタイトルと、画面の中でいちばん大きく表示される見出しは、役割が少し違います。文字が完全に一致していなくても、話題や目的がつながっていれば問題ありません。
Googleは検索結果に表示するタイトルを作るとき、title要素だけでなく、画面上の主な題名や見出しなども参考にしています。
同じくらい目立つ大見出しがいくつもあると、どれが主な題名か分かりにくくなる場合があるとも説明しています。
ここで専門的な直し方まで判断する必要はありません。ページタイトル、主な見出し、本文の中心が同じ方向を向いているかを記録しておけば十分です。
見出しが二つとも同じ大きさに見えるときや、タイトルとの関係が分かりにくいときは、制作担当者に相談する項目にしておきましょう。
公開ページを一緒に見ながら、そのページで何をいちばん伝えたいかを共有すると、話し合いが進めやすくなります。
Googleの検索結果の表示とは分けて考える
ブラウザのタブで見たページタイトルと、Googleの検索結果に出る文字が違っていることがあります。
検索結果に表示されるタイトル(Googleでは「タイトルリンク」と呼んでいます)は、Googleが自動で決めています。
title要素は大切な情報源の一つですが、ほかにも画面上の主な題名や見出し、リンクの文字などが使われるため、ホームページ側で書いた文字がそのまま表示されるとは限りません。
ページタイトルを変えてから検索結果に反映されるまでにも、時間がかかります。Googleの公式資料では、ページを改めて読み込んで処理し直すまでに、数日から数週間かかる場合があるとされています。
確認するときは、次の二つを分けて記録しておくと混乱しません。
- ブラウザのタブに表示されている名前
- Googleの検索結果に表示されているタイトルリンク
検索結果だけが違っていても、設定に失敗したとは限りません。まずは公開ページの内容とページタイトルをそろえ、検索結果は時間を置いてから見直してみてください。
ページタイトルの見直しで目指すのは、訪れた方が各ページを見分け、中身を予想しやすくなることです。検索順位や検索結果での見え方は、ページタイトル以外のさまざまな要素にも左右されます。
変更案は一覧にして担当者へ渡す
気になるページタイトルが見つかっても、公開中のホームページをその場で変更する必要はありません。
先に一覧を作り、今の表示と変えたい理由を分けて書き出しておくと、担当者とも相談しやすくなります。
- 公開URL
- 現在のページタイトル
- 画面内の主な見出し
- ページの目的
- 気になった点
- 変更案
- 確認した日と端末
- 変更を担当する人
変更案は一つに絞らなくてもかまいません。短い案と事業名を入れた案を並べておけば、タブで見たときにどちらが区別しやすいかを相談できます。
設定する場所の名前や変更の手順は、使っているホームページ作成サービスによって違います。
「ページタイトル」「SEOタイトル」「ブラウザタイトル」など、似た名前の項目が使われていることもあります。
設定の場所や公開の操作、変更できる権限、変更後の確認方法は、サービスの公式ヘルプか制作担当者に確かめてから進めてください。管理画面を推測で操作すると、公開中の内容を意図せず変えてしまうことがあります。
変更したら、以前の表示、変更後の文字、変更した日を残しておきます。そのうえで最初に開いた三つのページをもう一度タブで開き、区別できるようになったかを確かめてみてください。
まとめ
ページタイトルは、各ページの話題や目的を表す名前です。ブラウザのタブなどでページを見分ける手がかりになるため、次の流れで一度見直してみましょう。
- 役割の違うページを三つ開き、今の表示を記録する
- 内容が伝わる言葉になっているか確かめる
- ほかのページと区別できるか見比べる
- 画面内の主な見出しとのつながりを見る
- 変更したい点は一覧にして担当者へ渡す
ページの名前だけでなく、中身を伝える写真も見直したい方は、小さな事業のホームページ写真はどう選ぶ?用途別の考え方もあわせてご覧ください。
ライフデザインアカデミーでは、プロフェッショナル講師による各種講座を開講しています。対面講座からオンライン講座まで、学習環境に合わせて受講できます。
→ 講座一覧とお申し込みはこちら
上記に掲載していない限定講座(非公開講座)も定期的に開講していますので、学びたいことのご相談はお問い合わせよりお気軽にご連絡ください。

