SERP Title Width

mcp-server-serp-title-width

中国語、日本語、韓国語のページタイトルが Google の検索結果に収まるかを、文字数ではなく描画後のピクセル幅で確認します。 AI エージェント向けの MCP サーバーと、ビルドおよび CI 向けの CLI として提供しています。

ドキュメントと背景情報：adsandcode.com/en/open-source/serp-title-width

問題

サイト監査ツールや SEO プラグインは通常、タイトルの長さを文字数で数え、約 60 文字を上限とします。この目安はラテン文字のテキストに由来します。 Google が検索結果のタイトルに使うフォントでは、CJK の漢字、かな、ハングルの音節は幅が 22px あり、平均的なラテン文字の約 2 倍です。60 文字では合計 1320px となり、デスクトップの検索結果カラムの幅 652px の約 2 倍です。文字数によるチェックでは、Google が半分に切り詰める CJK タイトルも合格してしまいます。

Google はタイトルリンクが必要に応じて切り詰められると述べているだけで、ドキュメントには文字数やピクセル数による長さの指定はありません。

「Google 検索結果では、必要に応じてタイトルリンクが切り詰められます」 (Google Search Central、「検索結果のタイトルリンクに影響を与える」)

そのため、幅を測定する必要があります。

モデル

2026-09-18に google.com で、インターフェースをzh-TW（台湾の繁体字中国語）に設定し、Windows 版 Chromeで測定しました。検索結果のタイトルの計算済みスタイルを読み取り、同じページの canvas でグリフの送り幅を測定しています。

項目	値
検索結果タイトルのフォント	Arial 22px、line-height 28px
デスクトップの検索結果カラム	652px。ビューポート幅が 1366px と 1920px の場合で同じ
デスクトップでの切り詰め	CSS ではなく Google のサーバーが処理（テキストを切り、... を追加）
モバイル	2 行、1 行あたり 343px
全角文字	22.0px（1em）。全角とは East Asian Width が W または F の文字を指します（UAX #11）：漢字、かな、ハングル、全角句読点、ほとんどの絵文字
印字可能な ASCII（U+0020-U+007E）	Arial 固有の送り幅。全 95 文字：たとえば W は 20.76px、O は 17.11px、A は 14.67px、数字は 12.24px、i は 4.89px、スペースは 6.11px
その他の半角文字	12.2px（推定値、未測定）
ゼロ幅文字	0px：U+200B-U+200D、U+2060、U+FEFF、異体字セレクター、絵文字の肌の色修飾子
絵文字シーケンス	各書記素クラスタを 1 文字として数えます。家族の絵文字、旗、結合アクセント付きの文字は、それぞれ 1 文字です

しきい値：

ティア	幅	結果	理由
safe	572px 以下（全角 26 文字）	合格	保守的な基準です。狭い画面や、<title> と Google が表示するタイトルの違いに備えて余裕を残します
long	572px 超	警告	保守的な基準を超えていますが、限界域には達していません
edge	630px 超	不合格	デスクトップで測定した 1 行の上限に近い幅です
cut	648px 超	不合格	デスクトップのカラム幅を超えるため、検索結果で切り詰められます

数字 1 文字の幅は全角 1 文字のおよそ 0.56 倍なので、「2026」は漢字 2.2 文字分のスペースを取ります。大文字は数字よりかなり幅が広く、すべて大文字の商品名を含めると、文字数カウントやラテン文字をすべて同じ幅として扱うモデルでは収まると判定されるタイトルでも、基準を超えることがあります。

ASCII の幅は、フォントファイル（Windows 版 Arial Version 7.01）のフォント単位を使い、scripts/measure-arial.py で測定しました。さらに、2048px での Pillow、fontTools で読み取ったフォントの送り幅テーブル、22px arial に設定した Chrome canvas の measureText() の 3 つの方法で照合しました。全 95 文字について、結果は 0.0001px 以内で一致しています。

再計測

Google がタイトルのフォントサイズを変更すると、上記の数値はすべて正しくなくなります。対象言語のインターフェースで google.com の検索結果ページを開き、ブラウザーのコンソールで次を実行してください。

(() => { const h = document.querySelector('a h3'), s = getComputedStyle(h);
  const c = document.createElement('canvas').getContext('2d');
  c.font = s.fontSize + ' ' + s.fontFamily;
  return { font: s.fontSize + ' ' + s.fontFamily,
           col: h.closest('div[data-hveid],div').getBoundingClientRect().width,
           cjk: c.measureText('貓').width, digit: c.measureText('0').width }; })()

cjk が 22 でなくなっていたら、src/width.ts の EM としきい値を更新してください。 フォントが変更された場合は、python scripts/measure-arial.py path/to/font.ttf で ASCII テーブルを再生成してください。Pillow で直接 22px のサイズを計測しないでください。ヒンティングによって各幅が整数ピクセルに丸められ（W は 21 になります）が、ブラウザーではヒンティングなしの幅が使われます。

インストール

Node.js 18 以降が必要です。API キーもネットワークアクセスも不要です。

MCP サーバー

{
  "mcpServers": {
    "serp-title-width": { "command": "npx", "args": ["-y", "mcp-server-serp-title-width"] }
  }
}

CLI

npx -y -p mcp-server-serp-title-width serp-title-width ./public

または、npm install -g mcp-server-serp-title-width で一度インストールして、serp-title-width を実行してください。

CLI の使い方

serp-title-width <file|dir> ...           check <title> in .html/.htm files (directories are recursive)
serp-title-width --titles "t1" "t2" ...   check title strings
serp-title-width ... --json               machine-readable output
serp-title-width --selftest               run the ruler's positive and negative controls (use alone)

例：

$ serp-title-width --titles "家常料理食譜站｜滷肉飯做法・便當菜色・120道快速晚餐" \
    "旗艦手機開箱｜SAMSUNG GALAXY S26 ULTRA VS GOOGLE PIXEL" "京都三天兩夜行程"
Checked 3 title(s). Safe <= 572px / edge > 630px / cut > 648px (Arial 22px, measured 2026-09-18).
------------------------------------------------------------------------------
[FAIL] (input 2)
   旗艦手機開箱｜SAMSUNG GALAXY S26 ULTRA VS GOOGLE PIXEL
   688.3px / 31.3 full-width characters / cut
   [FAIL] Cut: 688px (31.3 full-width characters), 40px over the 648px line. Desktop results will truncate it.
   [warn] Keyword zone (text before the first ？：、，) is 688px, wider than the 343px first line on mobile, so the line breaks inside it.

[warn] (input 1)
   家常料理食譜站｜滷肉飯做法・便當菜色・120道快速晚餐
   564.7px / 25.7 full-width characters / safe
   [warn] Keyword zone (text before the first ？：、，) is 565px, wider than the 343px first line on mobile, so the line breaks inside it.

[ok] (input 3)
   京都三天兩夜行程
   176.0px / 8.0 full-width characters / safe

------------------------------------------------------------------------------
Passed 2 / must fix 1

2 つ目のタイトルは 47 文字で、一般的な 60 文字の上限を下回り、幅は 688px です。ファイルをスキャンすると、指摘事項のあるタイトルのみが、そのタイトルのパスとともに指定したフォルダーからの相対パスで表示されます。サイト全体を一度にチェックすると、ページ間の定型文による末尾部分を検出できます。

ディスクからの読み込み内容：

• ディレクトリは .html ファイルと .htm ファイルを再帰的に検索します。 node_modules と、. で始まるもの（.git など）はスキップされ、フォルダーへのシンボリックリンクはたどりません。
• ファイル名を明示して指定した場合は、拡張子にかかわらず読み込まれるため、serp-title-width page.php.txt も動作します。
• HTML ファイルが 20,000 件を超えると、スキャンは終了コード 2 で停止します。通常、これは指定したパスがサイトのビルド出力ではないことを意味します。
• ドキュメントの head 内にある <title> のみが対象です。コメント、<svg>、<math>、<script>、<style>、<template>、<noscript> 内のタイトル、および head の終了後にあるタイトルは無視されます。

終了コード

コード	意味
0	すべてのタイトルが合格（警告は許容）
1	修正が必要なタイトルが少なくとも 1 つある
2	ルーラーの自己テストに失敗した、または入力が不正：不明なオプション、パスが見つからない、パスまたはサブフォルダーを読み取れない、HTML ファイルが 20,000 件を超える、<title> が見つからない、--selftest と他のオプションを併用した

自己テストは判定の前に毎回実行されます。ルーラーが既知の不適切なタイトルにフラグを付け、既知の適切なタイトルを合格させられることを確認できない場合、判定を出しません。

MCP ツール

ツール	入力	機能
measure_titles	titles: string[]	各タイトルを計測し、セット全体をまとめてチェックします
check_title_files	paths: string[]	ローカルのファイルまたはディレクトリから head 内の <title> を読み込み（再帰的に検索し、CLI と同じルールを適用）、同じチェックを実行します。読み取り専用です

各結果には、px、full_width_units（px / 22）、tier、fails、warns（各指摘事項は {rule, message}）に加えて、セットに対する boilerplate_tails と、pass または fix の verdict が含まれます。サーバーは起動時に自己テストを実行し、失敗した場合は起動を拒否します。

ルール

ルール	レベル	条件	理由
length_cut	fail	648pxより幅が広い	デスクトップのカラム幅を超えています
length_edge	fail	630pxより幅が広い	実測したデスクトップの1行表示上限に近づいています
length_long	warn	572pxより幅が広い	安全な長さとして保守的に設定した1行の幅を超えています
separators	572px以内ならwarn、572px超ならfail	、 ，の合計が2個を超える	Googleが長い繁体字中国語（台湾）のタイトルを切り詰めた、このモデルの根拠となるサンプルでは、切り詰められた位置がこれらの記号のいずれかでした。サンプル数が少ないため、目安として扱ってください。安全な長さ以内のタイトルは短縮されることがほとんどないため、その場合は警告のみです
question_marks	fail	全角の？が1個を超える	編集上のルールです。タイトル1つにつき疑問文は1つです。Googleのドキュメントに基づくものではありません
boilerplate_tail	fail	最後の、または，より後の語句（4文字以上）が、セット内の2つを超えるタイトルで同じ語句として末尾にある	Googleのタイトルリンクに関するドキュメントでは、定型的なタイトルを問題として挙げています。コロン以降のテキストは対象外です。同じドキュメントでは、ハイフン、コロン、パイプで区切ってサイト名を各タイトルの先頭または末尾に置くことが推奨されているため、すべてのページで…：Site Nameとするのが推奨パターンです
keyword_zone	warn	最初の？ ： 、 ，より前のテキストの幅が343pxを超える	モバイルでは、最初の行で主要なキーワードの途中に改行が入ります
empty	fail	タイトルが空、または空白のみ
stuffing	fail	同じ2～4個のCJK表意文字の連続が3回以上出現する	Googleのタイトルリンクに関するドキュメントでは、キーワードの詰め込みを避けるよう推奨しています。連続文字は貪欲に分割されるため、これはA｜A｜Aのような文字列そのものの繰り返しを検出しますが、バリエーションは検出しません

制限事項

• 1つの環境での測定値です。 google.com、zh-TWインターフェース、Windows版Chrome、2026-09-18。他のインターフェース言語、ブラウザー、オペレーティングシステムでは、異なるフォントや幅が使われる場合があります。
• 日本語と韓国語は個別に測定していません。 かなとハングルには全角（East Asian Width W）の仮定を適用しています。これは通常の組版と一致しますが、このモデルではgoogle.co.jpもgoogle.co.krも測定していません。これらの言語での結果は推定値として扱ってください。
• カーニングはモデル化していません。 幅は文字ごとに加算されます。Chromeでは文字の組み合わせによって間隔も調整されるため、テキストはわずかに狭くなります。上記のすべて大文字の例はここでは688.3pxですが、Chromeのcanvasではデフォルトのカーニングを適用すると686.7pxです。結果は実際より長めになります。
• ASCII以外の半角文字は12.2pxとして推定しています。 実際のArialでの幅は異なります。éと–は12.24px、“は7.33px、‘は4.89px、Æと™は22pxです。
• 幅が曖昧な文字（East Asian Width A。たとえば① ※ …）は半角として数えます。代替フォントによっては、より広く表示される場合があります。
• Googleが別の内容を表示する場合があります。 タイトルリンクの生成には<title>以外にも、見出し、og:title、アンカーテキスト、サイト名を含むWebSite構造化データなど、複数のソースを使用します。また、定型的または不正確と判断したタイトルを置き換えたり、すでに表示されているサイト名と重複するサイト名を省略したりする場合があります。そのため、検索結果には<title>に含まれていないテキストが表示されることがあります。タイトルの検査に合格しても、実際に表示される内容が保証されるわけではありません。
• 絵文字は測定しません。 最初のコードポイントが全角であるか、絵文字表示セレクターU+FE0Fを含む場合、各絵文字書記素クラスタは全角文字1つとして数えます。それ以外の絵文字（Windowsでは2文字として表示される旗など）は、最初のコードポイントに基づいて数えます。
• HTMLの読み取りは簡易的です。 head内の<title>は、完全なHTMLパーサーではなくパターンを使って検出します。 & < > " '  と数値参照はデコードされます。それ以外の名前付き参照は、記述されたままの状態で測定されます。

ポートとパリティ

これは、公開されていない同じモデルの Python 実装を TypeScript に移植したものです。この移植では、意図的に次の4点を変更しています。

原因	変更
ascii-width	印字可能な ASCII 文字95文字すべてに、Arial 独自の幅を使用します。最初の参照実装には14個の値があり、W の値が誤っていました（20.76px ではなく18.33px）。その後、参照実装も同じテーブルを採用しました
zero-width	ゼロ幅文字は0として数え、書記素クラスタはそれぞれ1つとして数えます
colon-tail	： の後のフレーズは定型文の末尾として扱いません
separator-tier	区切り文字が2つを超える場合でも、安全な572pxの行幅内なら警告のみとします

出荷されるコードは参照実装の動作に切り替えられるため、scripts/parity.mjs --ref <title_check.py> では、次の2点を確認します。そのモードのコードが参照実装と完全に一致すること、および通常モードでのすべての差異に上記4つの原因のいずれかがあることです。現行の参照実装に対する結果は次のとおりです。

• 混合タイトル287件（繁体字中国語、日本語のかな、韓国語のハングル、ラテン文字、数字、全角句読点、絵文字、空白の境界ケース）：参照実装のモードでは、ピクセル幅、定型文の末尾、および失敗・警告ルールの順序付きリストが一致します。通常モードでは判定に27件の差異があり、すべて原因が特定されています。colon-tail が21件、separator-tier が4件、zero-width が3件です（1つのタイトルに複数の原因がある場合があります）。最初の参照実装との比較では、ascii-width によって、上記の全大文字の例を含む4件の判定も変わります。
• U+0020 から U+FFFF までのすべてのコードポイント（63,456個、サロゲートを除く）：参照実装のモードでは、両者が異なる Unicode データを使用している箇所でのみ幅が異なります。Python 3.10（Unicode 13.0）との比較では、1,613個のコードポイントに差異があります。そのうち1,392個は未割り当てです（3.12より前の CPython は、未割り当てコードポイントの East Asian Width を F と報告します）。143個は Unicode 13.0 以降に割り当てられ、78個は後の Unicode で N から W に変わりました（U+2630-U+2637、U+268A-U+268F、U+4DC0-U+4DFF）。Python 3.12（Unicode 15.0）との比較では85個に差異があります。その内訳は、同じ78個と、新たに割り当てられた7個です。このパッケージは、get-east-asian-width の新しいデータに準拠しています。通常モードでは、さらに21個に差異があり、すべてゼロ幅文字です。

ライセンス

MIT。

メンテナー

Ads & Code が構築・保守しています。