タイトルタグの書き方｜メタディスクリプションでクリック率を上げるコツ
- タイトルタグは全角30文字前後、メタディスクリプションは筆者の現場では120文字（PC表示目安）としつつ、一般的には約140文字まで表示されます
- 両者を「ペア」として設計し、タイトルで約束、ディスクリプションで保証する関係を作ると現場の承認フローもスムーズになります
- 日本語タイトルは助詞を削ぎ落とす「文脈圧縮」で30文字内に収め、検索意図別のコピペ用テンプレートを使えば最初の一文字が書きやすくなります
- Googleに書き換えられにくいタイトルは、末尾が切れても意味が通じる「名詞で閉じる」構造にし、修正が必要な場合はコンバージョンに直結するページから優先します
- 生成AI検索では、主語と述語が完結したメタディスクリプションが引用されやすく、タイトルと重複させない情報設計がAIO対策になります
タイトルタグとメタディスクリプションのペア設計とは、タイトルで検索意図に応じた約束をし、ディスクリプションでその中身を保証する情報の棲み分けのことです。
結論から：タイトルタグとメタディスクリプションの最適なセット設計とは
タイトルタグとメタディスクリプションは、個別に考えるのではなく「ペア」として設計するのが現場の鉄則です。一見すると、タイトルはSEOのテクニカル要素、ディスクリプションはその補足に過ぎないように思えます。しかし実際には、ふたつを独立した価値提案として棲み分けないと、検索結果の中でユーザーに「選ばれる理由」を伝えきれません。
文字数の目安は、タイトルが全角30文字前後です。Googleはピクセル幅で表示を制御しているため「必ず何文字」とは言えず、MiERUの解説では28〜32文字、BODAIのガイドではPC表示を意識して全角約25〜30文字以内と、若干の解釈の違いがあります。筆者の現場では、PCでの表示崩れを避けるため全角30文字をラインとしつつ、承認フローではPC画面で最終チェックされるケースが多いため、スマホでは末尾が切れる前提で設計しています。ホワイトリンクの調査では、スマホでは35〜40文字程度表示されることもあるとされています。
メタディスクリプションについては、一般的に約140文字程度まで表示されるとされています。ただし筆者の現場では、PC表示での崩れを防ぎ、Googleの自動書き換えに備える余裕を持たせるため、120文字前後を目安に設定しています。140文字ぎりぎりに詰め込むと、Googleが書き換えた際に想定外の語句が追加され、文章の意味が損なわれるリスクがあるため、残りの20文字はスマホ表示の違いやGoogleによる書き換え時のバッファとして機能させています。
キーワードの配置には明確な優先順位があります。BODAIの記事が引用するMozの調査により、タイトルタグの前方にあるキーワードほど順位に大きな影響を及ぼす可能性があるとされています。具体的には、検索語句を先頭20文字の中に入れ、ブランド名やサイト名は末尾に置く構造が現場で最も安定しています。たとえば「タイトルタグの書き方｜ABABO DESIGN」という形です。これにより、検索意図への即応性と、ブランドによる安心感の両立が狙えます。
「タイトルで問いかけ、ディスクリプションで答える」設計図
タイトルとディスクリプションの理想的な関係は「約束と保証」です。タイトルがユーザーに「このページには何があるか」を約束し、ディスクリプションが「その中身をどのように整理しているか」を保証します。たとえば、タイトルが「タイトルタグの書き方｜30文字設計ガイド」なら、ディスクリプションは「日本語の助詞省略とコピペ用テンプレートで、現場ですぐ書ける型を紹介」といった具合です。タイトルで示せなかった具体性を、ディスクリプションが受け止めます。
ペア設計のワークフロー：現場で同時に設計する5ステップ
タイトルとディスクリプションを別々の工程で考えると、どうしても情報の重複や齟齬が生じます。筆者がクライアントワークで実践している「ペア設計」の手順を5つに分けると、以下のようになります。
- タイトルを仮書きする：30文字内に収め、末尾が名詞で閉じているか確認します
- ディスクリプションを仮書きする：120文字前後で、タイトルと重複する語句がないかチェックします
- 具体性を棲み分ける：タイトルに入らなかった「数字」「対象」「範囲」をディスクリプションに移します
- 関係性を確認する：両方を並べて「約束と保証」の構造になっているか読み直します
- 表示シミュレーションする：PCとスマホ両方の想定表示を頭の中で（または実際に検索して）最終チェックします
このステップを設けるだけで、タイトルが決まってから「あとからディスクリプションを考える」という後追いの作業が減り、クライアントへの提案書にも一貫性が出ます。
ペア設計の失敗例：重複させてしまうパターンと修正法
よくある失敗は、タイトルとディスクリプションに同じキーワードを並べてしまうことです。たとえば、タイトルが「ホームページ制作｜東京のWeb制作会社」で、ディスクリプションが「東京のWeb制作会社がホームページ制作をご案内します」では、情報の重複だけが目立ち、ユーザーの期待を超える理由が見えません。修正のコツは、ディスクリプションに「数字」「対象」「範囲」のいずれかを必ず入れることです。「上場企業・自治体など200社の制作実績。費用相場と納品フローを7分で解説」といった形にすれば、タイトルとは異なる次元の価値が提示できます。
タイトルタグの書き方：30文字に収める日本語リライト術とコピペ用テンプレート
日本語のタイトルを30文字に収める技術の核心は、「文脈圧縮」と呼んでいる助詞の省略にあります。「の」「を」「に」「について」などを削ぎ落とし、名詞を連続させることで、情報量を損なわずに文字数を圧縮できます。見た目は少し硬くなりますが、検索結果という限られた空間では、むしろ情報の密度が高まってユーザーに届きやすくなります。
日本語リライトBefore/After：助詞省略で30文字内に収める実例
たとえば「初心者のためのホームページの制作の費用の相場について解説します」という文は、助詞に文字数を取られて全角26文字にもなりますが、情報の詰まり方は散漫です。これを「初心者向け ホームページ制作費用｜相場と内訳ガイド」とすれば、全角21文字に収まり、かつ検索意図に応じた名詞が並列します。「向け」は助詞の代わりに機能し、「｜」の区切り記号でリズムを作ります。こうした「タイトルタグ × 日本語の助詞省略」の技法は、上位記事がほとんど触れていない領域ですが、現場では毎日のように使う実用的なスキルです。
別の例では「デザイナーが教えるロゴの作り方のコツを詳しく紹介」を「デザイナー直伝 ロゴ制作コツ｜プロの発想法5選」と圧縮します。「教える」を「直伝」に、「作り方」を「制作」に置き換えるだけで、動詞のヌルヌルした質感が消え、名詞の積み重ねによる説得力が生まれます。
検索意図別タイトルテンプレート（コピペ用）
最初の一文字が書けない、という悩みは誰にでもあります。筆者は現場で、検索意図ごとにコピペして使える「型」を用意することで、承認フローを短縮しています。以下は、実際に使っているテンプレートです。
情報型（Know：知りたい）
{主題}とは｜{効果}を{対象}向けに解説- 例：メタディスクリプションとは｜SEOとCTRの関係を初心者向けに解説
比較型（Compare：比べたい）
{A}と{B}の違い｜{判断軸}で徹底比較- 例：オリジナル制作とテンプレートの違い｜費用対効果で徹底比較
購買型（Purchase：買いたい・依頼したい）
{商品・サービス}｜{強み}で{価値} {価格帯}〜- 例：ホームページ制作｜成果重視で集客につなげる 30万円〜
この「タイトルタグ × コピペ用テンプレート」を持っておくと、クライアントへの提案時にも「型に当てはめてからブランド表現を調整する」という工程が明確になり、納品物のブレを防げます。
クライアントワークで承認を得るための3つの論理
SEO的に正しいタイトルは、クライアントから「少し冷たい」「ブランドらしくない」と指摘されることがあります。筆者の経験では、特にBtoBの制作案件や、オーナー自身が言葉にこだわる中小企業サイトで、この摩擦が生じやすい傾向にあります。たとえば、詩的な表現を求められる場面では、タイトルタグにそのまま詩的な言葉を入れると検索意図から外れてしまいます。
このような場面で筆者が使っている3つの論理は以下の通りです。
1. 入り口と中身を分離する 「検索に表示されるタイトルタグ」と「サイト内で表示されるH1タグ」を分ける設計を提案します。タイトルタグは未訪問者を引き込む入り口、H1は来訪者を迎える歓迎の言葉です。この役割分けを説明すれば、SEOとブランド表現の両立がしやすくなります。
2. 検索意図の可視化 「あなたのお客様は、今この言葉で検索しています」と、Googleキーワードプランナーやサジェストのスクリーンショットを見せるのです。データを前にすると、感情論に陥らず客観的な判断ができます。
3. 譲れないラインを宣言する 「詩的な表現で検索意図が消失する場合は、SEO的な入り口を優先させてください」と、前提条件として伝えます。ブランド表現はH1やリード文、画像で十分に補えます。
メタディスクリプションの書き方：検索意図別テンプレートと自己完結型文案
メタディスクリプションは、Googleの公式見解でも検索順位の直接的なランキング要因ではありません。しかし、検索結果内でユーザーの検索語が太字になり目立つため、CTR（クリック率）向上には極めて効果的です。また、最近では生成AI検索（ChatGPTやPerplexity、Google AI Overviewsなど）が情報源としてメタディスクリプションを引用するケースが増えており、AIO（AI検索最適化）の観点からも無視できません。
メタディスクリプションの表示文字数は、一般的に約140文字程度までとされています。ただし筆者の現場では、PC表示での見切れを防ぎ、Googleによる自動書き換えに備えるため、120文字前後を作成時の目安としています。140文字ぎりぎりに詰め込むと、Googleが書き換えた際に想定外の語句が追加され、文章の意味が損なわれるリスクがあるため、残りの20文字分はスマホ表示の違いやGoogleの書き換え時のバッファとして機能する、現場の安全マージンなのです。
検索意図別メタディスクリプションテンプレート
メタディスクリプションも、検索意図に応じた構造を持たせるのが重要です。以下は筆者が現場で使っている「メタディスクリプション × 検索意図別テンプレート」です。
情報型（Know）
- 構造：
結論→根拠→ページの範囲 - 例：ホームページ制作の相場は30万円〜が一般的です。構成や機能別に変動する料金の内訳を、実際の見積もり例とともに解説します。
比較型（Compare）
- 構造：
選択肢→判断軸→読了後の所得 - 例：オリジナル制作とテンプレート制作、どちらが自社に適しているかを3つの判断軸で比較。費用対効果の高い選択ができます。
購買型（Purchase）
- 構造：
価値→実績→行動促進 - 例：成果にコミットしたWebサイト制作。上場企業・地方自治体など200社以上の実績。まずは無料相談からお気軽にご連絡ください。
この型のポイントは、タイトルと情報を被らせないことです。タイトルが「ホームページ制作費用」のページなら、ディスクリプションは「相場」ではなく「内訳の解釈」や「比較の軸」を受け持ちます。
AI検索に引用される自己完結型文案の書き方
生成AIが情報を要約するとき、主語と述語が完結し、数字や事実を含む一文が引用されやすい傾向にあります。たとえば「本記事では、タイトルタグの全角30文字前後という制約の中で、日本語の助詞を省略する『文脈圧縮』の技法を紹介します」というディスクリプションは、AIが「タイトルタグの書き方とは何か」を答える際に、定義文としてそのまま使いやすい構造です。
逆に、一文が長すぎたり、修飾語が多すぎたりすると、AIは引用を避け、他のソースに置き換えてしまうことがあります。メタディスクリプションを書く際は「これが独立した一文として成り立つか」を自問するとよいでしょう。
Googleに書き換えられないタイトル設計：文末の「閉じ方」と修正優先度
Googleがタイトルを自動書き換える現象は、近年ますます一般的になっています。wepageの解説では、書き換えの要因として「文字数のオーバー」「同じキーワードの複数回使用」「他ページとの重複」「タイトルと内容の不一致」が挙げられています。
Google書き換えを防ぐ「文末の閉じ方」実例
書き換えを減らす最も効果的な日本語の技法は、文末を「名詞で閉じる」ことです。たとえば「〜の書き方」「〜ガイド」「〜とは」で終わるタイトルは、末尾が途中で切れても名詞として完了するため、Googleにとっても「このタイトルは成立している」と判断されやすくなります。
一方で「〜を解説」「〜を紹介」「〜について説明します」で終わるタイトルは、動詞の目的語が中途半端になったり、敬体の「します」が切れたりすると、文としての成立感が損なわれます。この「宙に浮いた動詞」は、Googleに対して「このタイトルは不完全だ」と信号を送り、ページ内の他のテキストやアンカーテキストを使った書き換えを誘発しやすいのです。
具体例で比較すると：
- ○「タイトルタグの書き方｜30文字設計ガイド」
- △「タイトルタグの書き方を現場目線で解説します」
後者は「解説します」が切れた瞬間に、何を解説するのかがぼやけてしまいます。
また、タイトルがページ内の主要な見出しと矛盾していると、Googleはその見出しを優先して表示することがあります。たとえば、タイトルが「本格イタリアン｜渋谷の隠れ家レストラン」で、ページ内の主要見出しが「メニュー」になっていると、Googleは「メニュー｜渋谷の隠れ家レストラン」に書き換えることがあります。このような構造的な不一致は、公開前の必須チェック項目とすべきです。
書き換え発生時の修正優先度と手順
万一、Googleにタイトルが書き換えられてしまった場合、全ページを一斉に修正する必要はありません。テックスイートのバクヤスが提唱するように、Search Consoleで「表示回数が多いのにCTRが低い」ページを特定し、そこから優先的に対応するのが現場の鉄則です。
さらに筆者は、コンバージョンに直結するランディングページ（お問い合わせページや主要サービスページ）を、検索頻度よりも先に修正対象としています。というのも、SEO的なトラフィックよりも、すでに来ているはずの顧客を逃す機会損失の方が、フリーランスや中小企業にとっては痛手だからです。
修正前に確認すべきチェックリストは以下の4点です。
- 全角30文字内に収まっているか
- 末尾が名詞で閉じているか
- 同一サイト内で同じタイトルが存在しないか
- ページの本文内容と整合しているか
この「タイトルタグ × Google書き換えされた時の修正優先度」という観点は、他の解説記事がほとんど触れない領域ですが、リソースが限られた現場では最も重要な判断基準になります。
デザインカンプと実検索結果のギャップを埋める確認手法
FigmaやAdobe XD上でタイトルを確認していると、フォントサイズや字詰まりの感覚が実際のSERP（検索エンジンの結果ページ）とは大きく異なることがあります。Googleの検索結果では、キーワードに一致する部分が太字になり、同じ文字数でも視覚的な長さが変わります。また、Googleの検索結果はArial系フォントで表示されるため、Noto Sans JPなどのデザインフォントで確認した場合と比べて、同じ文字数でも視覚的な長さが異なり、2文字分ほどのズレが生じることもあります。
確認すべきは、ツール上のプレビューではなく、実際の検索結果での目視です。Googleのリッチリザルトテストは構造的なエラーを確認するのに有効ですが、実際の表示長さやデバイスごとの違いを知るには、PCとスマホ両方で実際にキーワードを検索して確認するしかありません。筆者の現場では、Figma上ではNoto Sans JP 14px相当で仮確認した後、必ずステージング環境でページを公開し、実際のSERPでの表示をスクリーンショットで保全しています。
PCとスマホでは、同一のタイトルでも表示される文字数に差があります。前述の通り、スマホでは35〜40文字程度表示されることもありますが、同一ページ管理の場合はPC基準で設計するのが現実的です。スマホでは末尾が切れることを前提として、重要なキーワードやブランド名が前半に入るよう意識すれば、デバイス間のギャップを最小限に抑えられます。
まとめ：タイトル設計は「制約の中で伝える技術」である
30文字や120文字という制約は、デザイナーにとっての「余白」のようなものです。むしろ不要な修飾を削ぎ落とす「編集力」を磨く機会でもあります。情報を詰め込もうとすればするほど、ユーザーの目には留まらなくなります。限られた文字数の中で、どの単語を残し、どの助詞を削るかという選択こそが、プロの文章設計です。
タイトルとメタディスクリプションをセットで設計し、検索ユーザーと生成AIの両方に「選ばれる理由」を提示してください。そして完璧な文案を一発で作る必要はありません。Search Consoleで測定し、半年単位で微修正を続ける運用こそが、長期的なCTR向上を生みます。焦らなくて大丈夫です。明日から使える型は、検索意図別のテンプレート3つです。まずはペア設計の意識だけでも変えてみてください。
もしタイトル設計に時間を取れない場合は、ABABO DESIGNにご相談ください。印刷物からWebサイトまで一貫したブランド設計の中で、検索に強い文案を一緒に作ります。
よくある質問（FAQ）
Q: タイトルタグの文字数は、厳密に何文字までにすべきですか？ A: 全角30文字前後が現実的な目安です。Googleはピクセル幅で表示を制御するため「必ず何文字」とは言えませんが、PC表示で切れないよう30文字以内を意識し、スマホでは35〜40文字まで表示されることを前提に、重要なキーワードは前半20文字に入れるのがよいでしょう。
Q: メタディスクリプションにキーワードを入れないと、SEO的にマイナスになりますか？ A: メタディスクリプションは直接的なランキング要因ではありませんが、タイトルに入りきらなかった関連語や類義語を自然に含めることで、より多様な検索クエリに対応し、ユーザーの期待に沿ったページであることを伝えられます。検索結果内でキーワードが太字になる効果もあり、CTR向上に寄与します。
Q: Googleにタイトルが書き換えられたら、すぐに修正すべきですか？ A: 全ページを一斉に修正する必要はありません。まずSearch Consoleで「表示回数が多いのにクリック率が低い」ページを特定し、そこから優先的に見直してください。Search Consoleの「検索結果の改善」レポートから、平均順位が高くクリック率が平均を下回っているURLを絞り込むと、修正候補が見つかりやすいです。コンバージョンに直結するランディングページは、検索頻度よりも先に修正対象とするとよいでしょう。
Q: クライアントから「SEO的なタイトルは冷たい」と言われたとき、どう折り合いをつけますか？ A: 「検索に表示されるタイトルタグ」と「サイト内で表示される見出し（H1）」を分ける設計を提案します。タイトルタグは検索ユーザーのための入り口、H1は既にサイトに来た人のための歓迎の言葉として役割を分ければ、SEOとブランド表現の両立がしやすくなります。
デザイン・制作のご相談について
ABABO DESIGNは、フライヤー・パンフレット・ロゴなどの印刷物からWebサイトまでを一貫して手がけるデザイン事務所です。「何を伝えるか」を整理する段階からご相談いただけるので、内容が固まっていなくても大丈夫です。中小企業の広報・採用・ブランディングの実情に合わせて、無理のない進め方をご提案します。
出典・参考
*1 MiERU
*2 BODAI
*3 ホワイトリンク
*4 wepage
*5 テックスイート バクヤス
