モバイルチェッカー は何をしますか？
あなたの予約ページがスマートフォンでどの程度機能するかを、毎回同じ固定の評価基準で100点満点中で採点し、各修正で獲得できる点数順にランク付けされた修正リストを返します。インストールもコードも不要で、ページリンク、いくつかのスマホのスクリーンショット、そしてGoogleの無料ツールPageSpeed Insightsからの数値を提供するだけです。ページに広告やメールを送る前、リデザイン後、または予約電話が減り訪問者のほとんどがスマホユーザーになった場合に使用してください。ランディングページ、動画セールスレター（VSL）ページ、申込ページ、メインサイトのトップページなど、予約電話で終わるあらゆるページに適合します。カレンダーツールがホストするページは単独では採点されず、そのページにリンクしているページの予約経路としてチェックされます。
開始前
- このプロジェクトまたはチャット内にビジネスコンテキストファイルがあるか探してください。存在する場合は、まずそれを読み込み、以下の情報を抽出します：予約ページリンク、ページが販売するオファー、メインボタンに表示するテキスト、カレンダーまたは予約ツール、ページビルダー、ページを編集する人（あなたまたは開発者）、訪問者の流入元（広告、Instagram、LinkedIn、メール）、および既知のモバイル訪問者の割合。
- すでにリンクがあり、ウェブ検索またはウェブフェッチが有効な場合は、何かを尋ねる（ステップ3）前に自分でページを開いてください。そうすれば、ページソースが必要かどうかがわかります。
- まだ不足しているものだけを尋ねてください。すべての質問を1つのメッセージに入れ、それぞれに短い理由を付けてください。以下の項目以上を尋ねないでください：
- 公開ページリンク。 ページを読めるようにするため、そしてPageSpeedがエディタープレビューではなく実際のページをテストするために必要です。リンクがカレンダーツールがホストするページの場合、そこにユーザーを送るページを尋ねてください。ない場合は、ステップ6の「カレンダーツールがホストするページ」を参照してください。
- スクリーンショットに使用したスマホ機種。 画面幅によってテキストの折り返し方やボタンの実際の大きさが変わります。
- メインアクション。 ページに複数ある場合、どのボタンが「予約」に該当するか。
- スマホのスクリーンショット。 通常のスクリーンショット。1つの長尺キャプチャではありません。1つのメッセージで全部添付できない場合は、最初のメッセージでページを送り、残りを2通目のメッセージで送ってください。 a. 最初の画面： 読み込まれたままの状態、スクロールなし、ブラウザバー表示。1枚の画像。 b. ページ全体： 1画面ずつスクロールし、毎回通常のスクリーンショットを撮ります。各スクリーンショットの約5分の1が次のスクリーンショットの上部に重なるようにします。1メッセージあたり最大約12枚。ページがそれより長い場合は、残りを次のメッセージで送ってください。テキストを読むためだけのオプションとして：iPhone Safariの「フルページ」PDF、またはAndroidの「スクロールキャプチャ」。 c. 予約経路： メインボタンをタップし、最後の確認ボタンまでの各ステップをスクリーンショットします（最大約5枚）。そこで止めてください。実際の予約によって広告ピクセル（MetaとGoogleはリードまたは予約通話としてカウント）が発火し、CRMの連絡先とパイプラインステージが追加され、確認テキストやメール、チームへのアラート、セッターやAIエージェントの通話が開始されることを理解した上で、送信する場合のみ送信してください。キャンセルすると、無断キャンセルやキャンセルシーケンスが開始される可能性があります。送信する場合：2週間以上先のスロットを選び、TESTとマークされた名前またはメールアドレスを使用し、事前にチームに伝え、すぐにキャンセルしてください。 d. ポップアップ： ページが開くポップアップがあれば、それが開いている状態で撮影したもの。 e. アプリ内ブラウザ： InstagramのDMで自分自身にページリンクを送信し（またはプロフィールや広告から開き）、InstagramまたはFacebookのアプリ内ブラウザ内で予約経路をタップして進めてください。SafariやChromeと表示や動作が異なるステップがあればスクリーンショットを撮ってください。ほとんどのソーシャルトラフィックはここに着地し、予約ページが最も頻繁に壊れる場所です。
- PageSpeed数値、2枚のスクリーンショット。 「PageSpeed Insights」を検索し、公開リンクを貼り付け、モバイルを選択し、実行してください。上部の実際のユーザーデータではなく、「問題を診断」セクション（ラボデータ）をキャプチャしてください：パフォーマンススコア、LCP、CLS、TBT、アクセシビリティスコア、およびパフォーマンス、アクセシビリティ、ベストプラクティスの下にある不合格項目の名前とその「推定削減量」。
- ページソース、自分でページを読めなかった場合のみ。 コンピューターで：ページを開き、右クリックして「ページのソースを表示」を選び、保存し、.txtファイルとしてアップロードしてください。チャットに貼り付けないでください：ページビルダーのソースは1MBを超える可能性があります。まだリンクを持っていない場合は、この項目をオプションとしてリストしてください（「リンクからページを読めない場合、これで2回目のやり取りを省けます」）。
- 止まらないでください。持っている証拠で証明できる範囲で採点し、残りは「未チェック」とマークし、チェックに最も多くの点数を追加する1つの不足入力を挙げてください。PageSpeed数値がない場合、55ポイントが未チェックのままになるので、まずそれらを尋ねてください。
仕組み
手順を順番に実行してください。平易な言葉を使い、技術用語は最初に使用するときに一度だけ定義します。
ステップ 1. スマホサイズを設定する
評価基準は小型スマホ用に作られています：375 x 812 CSSピクセル。CSSピクセルとはウェブページが構築される単位です。スマホのスクリーンショットには、1 CSSピクセルあたり2～3.5の実ピクセルがあります。
| スマホ | CSS幅 |
|---|---|
| iPhone SE、12 mini、13 mini | 375 |
| iPhone 12以降、標準およびPro | 390～402 |
| iPhone Plus、Air、Pro Max | 420～440 |
| ほとんどのAndroidスマホ | 360～412 |
- スケール ＝ スクリーンショットの幅（ピクセル） ÷ CSS幅（通常、iPhoneでは3）。スクリーンショット内の任意の長さをスケールで割ると、CSSピクセルになります。
- 1画面 ＝ すべてのスマホで812 CSS px。3x iPhoneでは2436スクリーンショットピクセルです。実際のスクリーンショットはブラウザバーがスペースを取るため、表示されるページはそれよりも少なくなります。目視では、1スクリーンショットは約0.8～0.9画面です。E2、E5、およびすべての画面カウントには812を使用し、スコアがスマホや実行間で比較できるようにします。
- 位置： 重なり合うスクリーンショットを、繰り返される帯を一致させることで積み重ね、それぞれがページの最上部（アドレスバーのすぐ下）からCSS pxで表示する新しいページの高さを合計し、812で割って画面数を取得します。コードで測定しない限り、「推定」とラベル付けします。
- テキストカラム（C） ＝ 本文テキストの1行の幅（CSS px）。測定してください。できない場合は、スマホのCSS幅から40を引いた値を使用します。
- 横幅の広いスマホでは、テキストの折り返し行数が375 pxの基準スマホよりも少なくなります。 見出しや段落が横幅の広いスマホで行数制限ぎりぎりにある場合、1行オーバーとしてカウントします。
- コード実行が有効な場合、コード内でスクリーンショットを開いてピクセルサイズを測定してください。できない場合は、目視で判断し、行に「推定」とラベル付けします。
ステップ 2. 速度数値を読み取る（セクションA、B、C、および行D10）
PageSpeedモバイルラボの数値を使用します。平易な言葉で説明します：
- LCP（ Largest Contentful Paint）： 最初の画面で最も大きい要素（ヒーロー画像、ビデオポスター、見出し）の表示が完了する時点。
- CLS（Cumulative Layout Shift）： ページの読み込み中にどれだけページがジャンプするか。ボタンを親指の下から動かすようなジャンプは予約を失います。
- TBT（Total Blocking Time）： ページがタップに応答できずビジー状態になっている時間の長さ。これは、Googleのタップ応答の指標であるINPの代替として機能します。
PageSpeedは実行間で数ポイント変動します。数値がスコアリングラインの3ポイント（または0.3秒）以内にある場合は、証拠の列にその旨を記載し、再チェック時に3回実行し、中央の値を使用するよう依頼してください。ベストプラクティスの下にある「コンソールにブラウザエラーが記録されました」は、D10の不合格を意味します。常にライブページをテストし、エディタープレビューは決してテストしないでください。プレビューでは、実際のホストが合格する圧縮とキャッシュのチェックに失敗します。各不合格項目のPageSpeedの「推定削減量」を保持しておきます。これらがステップ7の速度作業の順序を決定します。
ステップ 3. ページソースを読む
ウェブフェッチまたはウェブ検索が有効な場合、ページリンクを開いてHTMLを読んでください。多くのページビルダーはJavaScriptでページを描画するため、フェッチでは主にスクリプトが返ってくることがあります。その場合は、アップロードされたソースがあればそれを使用します。ない場合は、スクリーンショットに頼り、HTMLのみの行を「未チェック」とマークします。ソースが約150KBを超え、コード実行が有効な場合、すべてを読む代わりに以下の項目を検索します。コード実行が無効でファイルが大きすぎてすべて読めない場合は、確認できるものをチェックし、残りを「未チェック」とマークします。
以下のものを探し、それぞれが対応する行をメモします：
- ビューポートタグ：
width=device-width（D1）とviewport-fit=cover（D6）。 - すべての
img：widthとheight、またはCSSのアスペクト比があるか（D5）。ヒーロー画像は実際のimgか、それともCSS背景か？誤ってloading="lazy"に設定されていないか？（速度作業） - すべての
iframe：loading="lazy"と、300 px以上の設定された高さ（D5、E6）。読み込み時に存在するYouTubeまたはVimeoのiframe、またはタップでプレーヤーを読み込むサムネイル（D7）。 autoplayありでmutedなしのvideoタグ（D7）。- CSS内：
safe-area-inset（D6）、prefers-reduced-motionと:focus-visible（D9）、本文テキスト、段落、ラベル、キャプションのfont-size（D4）。外部スタイルシートは取得できない場合があります。CSSが見えない場合は、それらの行を「未チェック」とマークします。 - 表示されているフォームフィールド：
input（hiddenではない）、select、textareaの数をカウント（E6）。 - 競合するリンク先（E3）：別のオファー、異なる製品やチェックアウト、ソーシャルプロフィールへのリンク、およびページにナビゲーションメニューがあるかどうか。
head内でasyncまたはdeferがないスクリプト。それらを2つのグループに分類します：チャットウィジェット、ヒートマップ、セッション録画ツール（これらは待機可能）と、広告ピクセル、コンバージョンタグ、アナリティクス（これらは到着時に読み込まれる）（速度作業）。
大きなファイルを検索するには、以下を探します：viewport、<img、<iframe、<video、<input、<select、<textarea、safe-area、prefers-reduced-motion、focus-visible、font-size、<a href、<nav、および<head>内の<scriptタグ。
ステップ 4. スクリーンショットを読む
まず、受け取ったものを確認します。3画面より高い単一のキャプチャ（フルページPDFやスクロールキャプチャ）を受け取った場合、それから位置情報を読み取らないでください。コード実行が有効な場合、それを画面の高さのタイルに切り分けて、それぞれを確認します。無効の場合は、重なり合うスクリーンショットを依頼し、その間、位置情報が必要な行（D3、D4、E2、E4、E5、E7）を「未チェック」とマークします。そこからテキストとボタンのラベルを読むことはできます。
ページを上から下までウォークスルーします：
- 最初の画面（E1）： ページ自体にあり、ヘッダー内やスティッキーバー内にない、最初の予約ボタンを見つけます。実際の最初のスクリーンショットで判断します。スクロールなしで完全に表示されている場合、合格です。ブラウザバーによって隠れているが、その下端がページ上部から812 CSS px以内にある場合も合格です。「お使いのスマホではブラウザバーに隠れています」という追加所見を追加します。
- 横スクロール（D2）： 右端でコンテンツが切れている、水平スクロールバーがある、またはページがズームアウトして見える。ユーザーに横にスワイプしてみるよう依頼します。
- タップターゲット（D3）： ページ自体のすべてのリンクとボタン（フッターリンクを含む）。ただし、埋め込まれたカレンダー内のボタンは除きます（ステップ5）。44 CSS pxは画面幅の約9分の1、24 pxは約16分の1です。フッター内のテキストリンクやインラインの「プライバシー」や「利用規約」リンクが通常の不合格ポイントです。
- テキストサイズ（D4）： CSSがフォントサイズを提供している場合はそれを使用します。それが正確です。スクリーンショットのみから、本文テキストの全幅の1行の文字数（文字、スペース、句読点）を数え、テキストカラムCと比較します：
- 約C/8文字以下：16 px以上、合格。
- 約C/7.3文字以上：16 px未満、不合格。
- 約C/6.2文字以上：12 px近くまたはそれ以下。
- 375スマホ（C約335）の場合：42以下は合格、46以上は不合格、54以上は12 px近く。43～45は画像からは判断が難しいため、D4のその半分を「未チェック」のままにし、CSSを依頼します。
- 小さな文字も確認します：ラベル、キャプション、ボタンのサブテキスト、日付。すべてのスクリーンショット結果に「推定」とラベル付けします。
- 見出し（E4）： メイン見出し（H1）と最長のセクション見出し（H2）の行数を数えます。
- 証拠（E5）： 最初のロゴ行、お客様の声、クライアントの成果、またはレビューが、ページ上部から何画面目の位置から始まるか。
- ボタン（E2、E3）： すべての予約ボタンを、その画面位置と正確なテキストとともにリストアップします。スティッキーバーに注意してください。ボタン間の最大のギャップ（最後のボタンからページ末尾までのギャップを含む）を測定します。
- 出口（E3）： メニュー、ソーシャルアイコン、他のオファー、製品、チェックアウトへのリンクに注意します。
- 段落（E7）： すべての段落のうち、6行を超える段落の数を数えます。
ステップ 5. 予約経路をウォークスルーする
タップスルースクリーンショットから、まずSafariまたはChromeで、次にアプリ内ブラウザで：
- カレンダーの時間が表示される前の画面上のフォームフィールドの数を数えます（E6）。ステップに分割されたフォームは、最も長いステップをカウントします。
- カレンダー内の小さなタップターゲット（時間枠、日付セル、月の矢印）は採点しません。ページ所有者はそれらをサイズ変更できないためです。それらを追加所見の下に、ツールレベルの修正とともにリストします：カレンダーツールのモバイルレイアウトをオンにするか、埋め込む代わりにホストされている予約ページにリンクします。
- ポップアップについて：画面幅に収まっているか、明確な閉じるボタンがあるか、背後にあるページは静止したままか。開いているポップアップの背後でスクロールしてみるようユーザーに依頼します（D8）。
- アプリ内ブラウザ：各ステップをSafariまたはChromeと比較します。よくある不具合：埋め込まれたカレンダーが空白で読み込まれる、ポップアップまたは新しいタブがブロックされる、Googleサインインが拒否される、リダイレクトがスタックする。不具合は「予約経路」の下の先頭に、例えば「Instagramアプリ内ブラウザで壊れています：カレンダーが空白」のように配置します。これはポイントを追加せず、どの行も変更しません。
- 評価基準に該当する行がなくても予約を妨げるその他の事項に注意します：キーボードが送信ボタンを隠す、間違ったタイムゾーンが表示される、ステップが読み込まれない。壊れた予約経路は、スコアの上、レポートの最上部に配置します。
- 確認画面（追加所見）：ユーザーがテスト予約を送信した場合、明確な確認が表示されたかどうかを記述します。送信されていない場合は「未送信」と記述します。
ステップ 6. 各行を採点する
以下の評価基準を正確に使用します。合計は100になります。各行のソースをラベル付けします：PS（PageSpeed）、HTML、Shot（スクリーンショット）、Test（タップスルー）、Est.（スクリーンショットから推定）、Not checked（未チェック）、またはN/A。
| 行 | チェック内容 | 最大点 | 採点方法 |
|---|---|---|---|
| A1 | PageSpeedモバイル パフォーマンススコア | 30 | 90以上＝30。50以下＝0。その間：30 x (スコア-50) / 40 |
| B1 | LCP 2.5秒以下 | 7 | 4.0秒以上＝0。その間：7 x (4.0 - LCP) / 1.5 |
| B2 | CLS 0.1以下 | 4 | 0.25以上＝0。その間：4 x (0.25 - CLS) / 0.15 |
| B3 | TBT 200ms以下 | 4 | 600ms以上＝0。その間：4 x (600 - TBT) / 400 |
| C1 | PageSpeedモバイル アクセシビリティスコア | 15 | 90以上＝15。50以下＝0。その間：15 x (スコア-50) / 40 |
| D1 | viewportにwidth=device-widthがある | 6 | ある＝6。ない＝0 |
| D2 | 横スクロールがない | 3 | スクリーンショットとHTMLから判断：ある＝0。ない＝3 |
| D3 | すべてのタップターゲットが44 CSS px以上 | 4 | すべて44以上＝4。24px未満のものがある＝0。その間：4 x (44未満のターゲット数、24px以上のもの) の中間。明確でない場合は目の子で推定 |
| D4 | 本文テキストが16 CSS px以上 | 6 | 16以上＝6。12以下＝0。その間：6 x (測定されたサイズ - 12) / 4。ラベルやキャプションが12未満の場合は1点減点 |
| D5 | 画像にアスペクト比がある | 3 | すべての画像(widthとheight、またはCSSアスペクト比)で3。一部欠けている＝2。多くの画像が欠けている＝0 |
| D6 | safe-area-insetがある | 2 | ある＝2。ない(またはCSSが見えない)場合は未チェックとしてマーク |
| D7 | 動画は自動再生しない、またはミュートされている | 3 | すべての動画が条件を満たす＝3。一部自動再生(ミュートなし)がある＝0。動画がない＝3 |
| D8 | ポップアップが画面に収まる | 2 | すべて収まる＝2。一部はみ出る＝0。ポップアップがない＝2 |
| D9 | prefers-reduced-motionと:focus-visibleがある | 2 | 両方ある＝2。片方のみ＝1。どちらもない＝0。CSSが見えない場合は未チェック |
| D10 | ブラウザエラーがコンソールにない | 3 | PSでエラーなし＝3。PSでエラーあり＝0。PS数値がない場合は未チェック |
| E1 | 最初の予約ボタンが最初の画面にある | 8 | ある＝8。ない(1画面下)＝4。2画面以上下＝0 |
| E2 | ボタンが1画面のタップ範囲内にある | 4 | E1から最も遠いボタン: 1画面以内＝4。1-2画面＝2。2画面以上＝0 |
| E3 | 競合するリンク先や出口がない | 4 | ない＝4。1つ＝2。2つ以上＝0 |
| E4 | H1は2行以下、H2は3行以下 | 4 | 両方合格＝4。一方不合格＝2。両方不合格＝0 |
| E5 | 証拠が最初の画面にある | 5 | ある(0画面)＝5。1画面以内＝3。2画面以上＝0。証拠がない＝0 |
| E6 | 予約経路の最初の画面のフォームフィールドが3つ以下 | 6 | 3以下＝6。4-5＝3。6以上＝0。フィールドがない(カレンダー埋め込みなど)はN/Aとしてマークし、最大点はこれらの行に再配分されない |
| E7 | 6行を超える段落がない | 3 | すべて6行以下＝3。1つ以上ある＝0。段落がない＝3 |
追加所見： これらの項目は点数はありませんが、レポートの下にリストします。
- カレンダー内の小さなタップターゲット（ツールレベルの修正）
- ブラウザバーで隠れているボタン（E1が「ブラウザバーで隠れている」として合格した場合）
- LCP画像がloading="lazy"に設定されている
- スクロールをブロックするサードパーティスクリプト
- アプリ内ブラウザでの不具合
- 確認画面の欠如
ステップ 7. 修正をランク付けする
すべての行を採点したら、スコアのすぐ下に優先順位付き修正リストを作成します。各修正を、それが修正した場合に獲得できる推定点数とともにリストアップします。最もポイントの高いものから順に並べます。同じポイントの場合は、実装の容易さで順序付けます（簡単なものが先）。
速度関連の修正については、PageSpeedの「推定削減量」を使用して順序を設定します。
各修正には、短い説明と推定獲得点数を含めます。例：
- 「LCPを3.2秒から2.5秒に改善：+1.5ポイント（B1）」
- 「タップターゲットを44px以上に拡大：+2ポイント（D3）」
修正が複数の行に影響する場合は、合計点数を括弧内に記載します。
注意事項
- プライバシー：実際の顧客のスクリーンショットや内部システムへのアクセスを求めないでください。テストデータを使用してください。
- 制限事項：このツールは予約ページのモバイルでの見た目と機能に焦点を当てており、コンバージョン率の最適化（CRO）戦略やA/Bテストの結果は評価しません。
- 免責事項：PageSpeedスコアは変動するため、参考値として扱ってください。重大な変更を行う前には常に複数回テストしてください。
- サポート：問題が発生した場合、または不明な点がある場合は、ためらわずに質問してください。