seo-mobile

seo-mobile (M7b)

Google はモバイルファーストでインデックス登録します。ページのモバイル表示が、ランキング評価の基準となります。このモジュールでは、小さなビューポートでページが使用可能かを確認します。モバイルでの使いやすさを損なうレイアウトの問題は、CLS として表面化することがよくあります。references/cwv-thresholds.md と照合してください。

入力

ディスパッチエンベロープで指定された PageSnapshot を使用します。<run_dir>/pages/<slug>.json から parsed（ビューポートタグについては metas[]）を読み取り、render.used が none でない場合は parsed_rendered も読み取ります（レイアウト／ジオメトリのチェックに必要です）。逐語的な証拠を確認するには pages/<slug>.html を Grep します。サイトのアーティファクトは <run_dir>/site/{robots.json,sitemaps.json,discovery.json} にあります。audit.mjs がすでに出力した決定論的な検出結果は <run_dir>/findings.deterministic.json に記載されています。これらの ID を再出力せず、モデルが判定した検出結果のみを追加してください。スナップショットがない状態で URL／パスを直接指定して実行する場合は、まず node "${CLAUDE_PLUGIN_ROOT}/scripts/snapshot.mjs" <target> --out "${CLAUDE_PLUGIN_DATA}/runs" を実行し、表示されたスナップショットパスを使用してください。

監査

PageSnapshot を使用して作業します（render.used が none でない場合は parsed_rendered、それ以外は parsed）。

1. ビューポートメタ：width=device-width と initial-scale=1 を指定する <meta name="viewport"> が存在することを確認します。欠落、固定幅（width=1024）、またはズームを制限する値（user-scalable=no、maximum-scale=1）を検出してください。最後の項目はアクセシビリティも損ないます。
2. 横スクロールなし：ビューポートがデバイス幅より広くなる原因となる固定幅コンテナーや、大きな絶対幅を検出します（約 360 px の小さなビューポートでコンテンツがはみ出す場合）。
3. タップターゲットのサイズ：インタラクティブ要素（リンク、ボタン、フォームコントロール）は、十分なサイズと間隔を確保し、隣接するターゲットを誤ってタップしにくくする必要があります。
4. 読みやすい基本フォントサイズ：本文は読みやすい基本サイズで表示し、モバイルでピンチズームを強いるデスクトップ専用の小さなサイズは避けます。
5. コンテンツの同等性：モバイル DOM に、デスクトップと同じ主要コンテンツ、見出し、構造化データ、リンクが含まれている必要があります。モバイルファーストインデックスではモバイル表示の内容がランキング評価の対象となるため、モバイルでコンテンツが非表示または削除されていると、ランキングに悪影響を及ぼすおそれがあります。

修正

• AUTO（fixable: auto）：存在しない場合、<meta name="viewport" content="width=device-width, initial-scale=1"> を <head> に挿入します。決定論的で、既存内容を損なわず、検証可能です。fix の差分として出力されます。
• ADVISORY（fixable: advisory）：固定幅／はみ出しレイアウト、タップターゲットのサイズ、基本フォントサイズ、コンテンツ同等性の不足は、CSS、デザインシステム、JS に依存するため、破損のリスクが高くなります。このツールは問題を診断して優先順位を付けますが、レイアウトコードを自動編集することはありません。ブレークポイントの値やピクセルサイズを決して捏造しないでください。確認できた値を報告するか、ユーザー向けであることを明示した TODO を残してください。

検証

• dom_assert メソッド：スナップショットに対してアサートします（ビューポートメタの有無と内容、計算済み幅、ターゲットのジオメトリ）。
• 決定論的な部分（ビューポートメタの有無と内容）をオフラインで再現するには、node "${CLAUDE_PLUGIN_ROOT}/scripts/parse-html.mjs" --snapshot <pages/<slug>.json>（または --url <u>／--file <path>）を実行し、head_hygiene.viewport を確認します。タップターゲット／はみ出しのジオメトリは、レンダリング済みスナップショットを使って manual_review を行います。
• タップターゲットとオーバーフローのチェックには、レンダリング済みスナップショット（計算済みレイアウト）が必要です。raw_html_path しかなく、レイアウトを解決できない場合、ステータスは needs_api とし、誤って pass にしてはいけません。

所見

schema/finding.schema.json に従って所見を出力します。例：

• M7b.viewport.missing — viewport meta がありません（status fail、severity 3、fixable: auto、axis search、confidence established）。
• M7b.viewport.user_scalable_no — viewport でズームが無効になっています（status warn、severity 3、fixable: advisory、axis search、confidence established）。
• M7b.layout.horizontal_scroll — コンテンツが小さなビューポートからはみ出しています（status fail、severity 3、fixable: advisory、axis search、confidence directional）。
• M7b.taptarget.too_small — インタラクティブなターゲットが小さすぎる、または近すぎます（status warn、severity 3、fixable: advisory、axis search、confidence directional）。

各所見では、evidence.observed にページからの引用（meta タグの文字列、はみ出しているセレクター／幅、ターゲットの寸法）を記載します。verification.reproduce は前述の実行可能なコマンドです。expected_impact は範囲と信頼度を明記します（根拠のない % は記載しません）。

正直さ

• モバイルフレンドリーはユーザビリティの基本であり、ランキングを大きく押し上げる要因ではありません。高速で適切に構築されたデスクトップ専用サイトに viewport タグを追加しても、ランキングが 上がる わけではなく、ユーザビリティ上のリスクが取り除かれるだけです。修正は順位向上ではなく、リスクの除去として説明してください。
• Google は独立した「モバイルフレンドリーテスト」ツールとページ エクスペリエンス バッジを廃止しています。「勝ち取る」べき単一のモバイルフレンドリーランキング指標はありません。この誤解を広めないでください。
• viewport meta が存在しても、レイアウトが実際にレスポンシブであるとは限りません。タグだけでレスポンシブだと判断せず、レンダリングされたスナップショットで確認してください。