歯科サイトのページ表示速度を改善する方法

歯科医院のホームページは、表示速度が遅いだけで患者を逃しています。Googleの調査によると、表示に3秒以上かかるページでは53%のユーザーが離脱します。さらに2021年以降、GoogleはCore Web Vitalsを検索順位の評価指標に組み込みました。つまり、表示速度の遅いサイトは検索順位でも不利になります。

本記事では、歯科医院サイトに特化したページ表示速度の改善方法を解説します。LCP・FID・CLSの改善手順から画像最適化、サーバー高速化まで紹介します。具体的な数値目標も掲載しています。PageSpeed Insightsのスコアが50未満の歯科医院サイトは、ぜひ参考にしてください。

ページ表示速度が歯科医院の集患に与える影響

表示速度と患者の離脱率の関係を理解する

ページ表示速度は、患者がサイトに留まるかどうかを左右する重要な要素です。Googleの公開データによると、表示速度が1秒から3秒に遅くなると直帰率は32%上昇します。さらに5秒になると90%が離脱するとされています。歯科医院のサイトでは、診療時間や予約ページにたどり着く前に患者が離れてしまうのです。

歯科医院を探す患者の約75%はスマートフォンで検索しています。モバイル回線は固定回線より速度が遅いため、表示速度の影響はさらに大きくなります。特に画像の多い歯科医院サイトでは、未最適化の写真が読み込みを遅延させるケースが頻発しています。院内写真や症例写真を多用するサイトほど、表示速度の改善効果が大きいといえます。

表示速度がSEO順位に直結する仕組みを知る

Googleは2021年6月にページエクスペリエンスアップデートを実施しました。このアップデートにより、Core Web Vitalsが検索順位の評価指標に正式に組み込まれています。Core Web Vitalsとは、ユーザー体験を数値化した3つの指標の総称です。

Core Web Vitalsの3指標は以下の通りです。

• LCP（Largest Contentful Paint）：最大コンテンツの描画時間
• FID（First Input Delay）：初回入力遅延時間
• CLS（Cumulative Layout Shift）：累積レイアウトシフト

これらの指標が「良好」と判定されたページは、検索順位で優遇される傾向があります。「地域名＋歯科」のように競合が拮抗するキーワードでは、Core Web Vitalsのスコア差が順位に影響します。歯科業界ではまだ対策が遅れているため、今改善すれば競合に差をつけられます。

Core Web Vitalsの3指標と目標値

LCP（最大コンテンツ描画時間）を2.5秒以内にする

LCPは、ページ内で最も大きなコンテンツが表示されるまでの時間を測定する指標です。歯科医院サイトでは、メインビジュアルの院内写真やヒーロー画像がLCPの対象になるケースが大半です。Googleの基準では、LCPが2.5秒以内なら「良好」と判定されます。

LCPの判定基準は以下の通りです。

• 2.5秒以内：良好（緑）
• 2.5秒〜4.0秒：改善が必要（黄）
• 4.0秒超：不良（赤）

歯科医院サイトでLCPが遅くなる主な原因は3つあります。第一に、未圧縮の大容量画像です。一眼レフで撮影した院内写真をそのままアップロードすると、1枚あたり3〜5MBになります。第二に、サーバーの応答速度の遅さです。安価な共用サーバーでは応答に1秒以上かかる場合があります。第三に、レンダリングをブロックするCSSやJavaScriptです。

FID（初回入力遅延）を100ミリ秒以内に抑える

FIDは、ユーザーが最初にページを操作してから、ブラウザが応答するまでの時間を測定する指標です。具体的には、ボタンのクリックやリンクのタップに対する反応速度を計測します。Googleの基準では100ミリ秒以内が「良好」とされています。

FIDの判定基準は以下の通りです。

• 100ミリ秒以内：良好（緑）
• 100〜300ミリ秒：改善が必要（黄）
• 300ミリ秒超：不良（赤）

歯科医院サイトでFIDが悪化する主な原因は、重いJavaScriptの実行です。予約システムやチャットボット、解析タグなどが同時に読み込まれます。その結果、ブラウザのメインスレッドがブロックされます。Google Tag Managerで5つ以上のタグを管理しているサイトでは、FIDが悪化しやすい傾向があります。なお、2024年3月以降、FIDはINP（Interaction to Next Paint）に置き換えられています。INPの「良好」基準は200ミリ秒以内です。

CLS（累積レイアウトシフト）を0.1以下に制御する

CLSは、ページの読み込み中に要素が予期せず移動する現象を数値化した指標です。例えば、テキストを読んでいる最中に広告画像が読み込まれ、テキスト全体が下にずれる現象がレイアウトシフトです。Googleの基準ではCLSが0.1以下なら「良好」と判定されます。

CLSの判定基準は以下の通りです。

• 0.1以下：良好（緑）
• 0.1〜0.25：改善が必要（黄）
• 0.25超：不良（赤）

歯科医院サイトでCLSが悪化する原因は主に2つあります。1つ目は、画像や動画にwidth属性とheight属性が指定されていないケースです。ブラウザが画像サイズを事前に把握できないため、画像読み込み時に他の要素が押し出されます。2つ目は、Webフォントの読み込みによるテキストのちらつきです。カスタムフォントが適用される瞬間にテキストサイズが変わり、レイアウトが崩れます。

PageSpeed Insightsを使った現状診断の手順

PageSpeed Insightsの基本的な使い方を覚える

PageSpeed Insightsは、Googleが無料で提供するページ速度分析ツールです。URLを入力するだけで、Core Web Vitalsのスコアと具体的な改善提案が表示されます。歯科医院のサイト運営者は、まずこのツールで現状を把握しましょう。

使い方の手順は以下の通りです。

1. ブラウザで「PageSpeed Insights」と検索してアクセスする
2. 分析したいページのURLを入力する
3. 「分析」ボタンをクリックする
4. 結果が表示されるまで10〜30秒待つ
5. モバイルとパソコンの両方のスコアを確認する

スコアは0〜100点で表示されます。90点以上が「良好」、50〜89点が「改善が必要」、49点以下が「不良」です。歯科医院サイトの平均スコアはモバイルで30〜50点程度とされています。まずはモバイルで70点以上を目標にしましょう。

診断結果の読み方と優先すべき改善項目を把握する

PageSpeed Insightsの結果画面には、多くの情報が表示されます。全てを一度に改善する必要はありません。優先順位をつけて効率的に取り組むことが重要です。

結果画面で確認すべき項目は以下の順です。

• 「パフォーマンス」スコア：総合評価の数値を確認する
• 「Core Web Vitals の評価」：LCP・FID・CLSの個別スコアを確認する
• 「改善できる項目」：具体的な改善提案が影響度順に並ぶ
• 「診断」：技術的な詳細情報が表示される

「改善できる項目」に表示される提案は、上から順に効果が大きいものが並んでいます。歯科医院サイトでよく表示される指摘は主に3つあります。「次世代フォーマットでの画像配信」「未使用JavaScriptの削減」「レンダリング妨害リソースの除外」です。この3つだけで20〜40ポイントの改善が期待できます。

画像最適化によるLCP改善の具体策

画像フォーマットをWebPに変換して容量を削減する

画像最適化は、歯科医院サイトの表示速度改善で最も効果が大きい施策です。一般的な歯科医院サイトでは、ページ容量の60〜80%を画像が占めています。画像を最適化するだけでLCPが1〜3秒改善するケースも珍しくありません。

まず取り組むべきはフォーマットの変換です。従来のJPEG形式をWebP形式に変換すると、画質を維持したまま容量を25〜35%削減できます。WebPはGoogleが開発した次世代画像フォーマットで、主要なブラウザの95%以上が対応しています。

変換の方法は以下の通りです。

• WordPressの場合：「EWWW Image Optimizer」プラグインを導入する
• 手動変換の場合：Squoosh（squoosh.app）で変換する
• 一括変換の場合：制作会社にWebP対応を依頼する

院内写真1枚（JPEG・3MB）をWebPに変換すると、約900KB〜1.2MBまで圧縮できます。トップページに5枚の画像がある場合、合計で10MB以上の削減効果があります。

画像のサイズ指定と遅延読み込みを実装する

フォーマット変換に加えて、画像の表示サイズの最適化と遅延読み込み（Lazy Load）の実装も重要です。この2つの施策でLCPとCLSの両方を同時に改善できます。

画像サイズの最適化では、実際の表示サイズに合わせた画像を配信します。例えば、横幅600pxで表示される画像に横幅3000pxの画像を使用すると、約80%が無駄なデータです。WordPress 5.4以降では、srcset属性によりブラウザが最適なサイズを自動選択します。手動で対応する場合は、表示サイズの2倍の解像度を目安にしてください。

遅延読み込み（Lazy Load）は、画面外の画像の読み込みを後回しにする技術です。ファーストビュー以外の画像にloading=”lazy”属性を追加するだけで実装できます。ただし、ファーストビューのメインビジュアルにはLazy Loadを適用しないでください。LCPの対象画像にLazy Loadを設定すると、逆にLCPスコアが悪化します。

なお、CLS対策として、全ての画像タグにwidth属性とheight属性を必ず指定してください。これにより、画像読み込み前にブラウザが表示領域を確保し、レイアウトシフトを防止できます。

JavaScriptの最適化によるFID・INP改善

不要なスクリプトを特定して削除・統合する

JavaScriptの最適化は、FID（INP）の改善に直結します。歯科医院サイトでは、制作時に導入したまま使われていないスクリプトが残っていることが多いです。まずは不要なスクリプトの棚卸しから始めましょう。

歯科医院サイトでよく見られる不要スクリプトは以下の通りです。

• 使用していないSNSシェアボタンのスクリプト
• 削除済みの予約システムの残骸コード
• 重複して設置されたアクセス解析タグ
• テスト用に残されたデバッグスクリプト
• 使われていないWordPressプラグインのスクリプト

ChromeのDevTools（F12キー）でCoverageタブを開きましょう。使用されていないJavaScriptの割合を確認できます。未使用率が50%を超えるスクリプトは削除または統合の対象です。不要なWordPressプラグインを5つ削除するだけで、FIDが30〜50ミリ秒改善した事例もあります。

サードパーティスクリプトを非同期読み込みに変更する

外部サービスのスクリプトは削除できない場合が多いです。Google Tag Managerやチャットボットなどが該当します。その場合は、読み込み方法を変更してメインスレッドへの影響を軽減します。

具体的な対策は以下の3つです。

第一に、scriptタグにasync属性またはdefer属性を追加します。async属性はスクリプトを非同期で読み込み、ダウンロード完了後に実行します。defer属性はHTML解析完了後にスクリプトを実行します。予約ウィジェットやチャットボットにはdefer属性が適しています。

第二に、Google Tag Managerのトリガー設定を見直します。全タグを「ページビュー」で発火させるのではなく、「DOM Ready」や「ウィンドウの読み込み」に変更します。これによりメインスレッドの負荷が分散されます。

第三に、遅延読み込みライブラリの活用です。ユーザーがスクロールした時点でスクリプトを読み込む設計にすれば、初期表示への影響を最小限に抑えられます。

サーバー高速化とキャッシュ設定

サーバー応答速度（TTFB）を改善する方法

TTFB（Time to First Byte）は、ブラウザがサーバーにリクエストを送信してから最初の1バイトが返ってくるまでの時間です。TTFBが遅いと、その後の全ての処理が遅延します。Googleの推奨はTTFBが800ミリ秒以内です。

歯科医院サイトでTTFBが遅い主な原因と対策は以下の通りです。

安価な共用サーバーを使用している場合、他のサイトとサーバーリソースを共有するためレスポンスが不安定です。月額1,000〜3,000円の高速サーバー（エックスサーバー、ConoHa WING等）への移行を検討してください。移行だけでTTFBが500ミリ秒以上改善するケースがあります。

WordPressのデータベースが肥大化している場合、クエリの処理時間が長くなりTTFBが悪化します。「WP-Optimize」プラグインでデータベースを最適化しましょう。リビジョン削除・スパムコメント削除・テーブル最適化が可能です。月1回の定期実行がおすすめです。

PHPのバージョンが古い場合も、処理速度が低下します。PHP 7.4以下を使用している場合はPHP 8.0以上へのアップデートを推奨します。PHP 8.0はPHP 7.4と比較して約3倍の処理速度を実現しています。

ブラウザキャッシュとCDNを活用する

ブラウザキャッシュとCDN（Content Delivery Network）は、2回目以降のアクセスやユーザーの地理的位置に応じて表示速度を改善する技術です。どちらも歯科医院サイトに導入しやすい施策です。

ブラウザキャッシュは、画像やCSS・JavaScriptなどの静的ファイルをユーザーのブラウザに一時保存する仕組みです。2回目以降のアクセス時にサーバーへのリクエストが不要になるため、表示速度が大幅に向上します。WordPressでは「WP Super Cache」や「W3 Total Cache」プラグインで簡単に設定できます。キャッシュの有効期間は画像で30日間、CSSとJavaScriptで7日間が推奨値です。

CDNは、世界各地のサーバーにコンテンツを複製し、ユーザーに最も近いサーバーから配信する仕組みです。Cloudflare（無料プランあり）の導入が手軽です。管理画面でDNSを設定するだけで、画像やCSS・JavaScriptがCDN経由で配信されます。CDN導入により表示速度が20〜40%改善したという事例も報告されています。

WordPress環境での表示速度改善プラグイン活用法

画像最適化プラグインの選び方と設定方法

歯科医院サイトの約70%はWordPressで構築されています。WordPressにはページ速度を改善するプラグインが多数存在します。まずは画像最適化プラグインから導入しましょう。

おすすめの画像最適化プラグインは以下の2つです。

1つ目は「EWWW Image Optimizer」です。無料版でもWebPへの自動変換、画像の自動圧縮、Lazy Loadの実装が可能です。設定画面で「WebP変換」と「遅延読み込み」を有効にするだけで導入完了です。既存画像の一括最適化機能もあり、過去にアップロードした画像もまとめてWebP変換できます。

2つ目は「ShortPixel Image Optimizer」です。月100枚まで無料で利用できます。圧縮品質を「Lossy」「Glossy」「Lossless」の3段階から選べます。歯科医院の症例写真など画質が重要な画像には「Glossy」設定が最適です。画質の劣化を最小限に抑えつつ、容量を50〜70%削減できます。

キャッシュ・CSS/JS最適化プラグインの導入手順

画像最適化の次に導入すべきは、キャッシュとCSS/JavaScript最適化のプラグインです。これらのプラグインにより、ブラウザキャッシュの設定、CSSとJavaScriptの圧縮・統合が自動化されます。

推奨プラグインは「Autoptimize」と「WP Super Cache」の組み合わせです。

Autoptimizeの設定手順は以下の通りです。

1. プラグインをインストール・有効化する
2. 「設定」→「Autoptimize」を開く
3. 「JavaScript コードの最適化」にチェックを入れる
4. 「CSS コードの最適化」にチェックを入れる
5. 「HTMLコードの最適化」にチェックを入れる
6. 「変更を保存してキャッシュを削除」をクリックする

設定後は必ずサイトの表示を確認してください。デザインの崩れや機能の不具合が発生した場合は、「JavaScript コードの最適化」のチェックを外して再テストします。予約システムや問い合わせフォームが正常に動作するかも確認しましょう。

なお、キャッシュプラグインの導入時は医療広告ガイドラインにも注意が必要です。キャッシュにより古い情報が表示され続ける可能性があります。診療時間の変更や休診情報の更新後は必ずキャッシュをクリアしてください。患者に誤った情報を表示することは、医療広告ガイドラインの「虚偽広告の禁止」に抵触する可能性があります。

よくある質問

Q. PageSpeed Insightsのスコアは何点を目指すべきですか？

モバイルで70点以上、パソコンで90点以上を目標にしましょう。歯科医院サイトの平均はモバイル30〜50点のため、70点以上あれば競合より優位に立てます。100点満点を目指す必要はありません。70点以上を達成すれば、Core Web Vitalsは概ね「良好」判定を受けられます。

Q. 表示速度の改善は自分でもできますか？

WordPressであれば画像最適化プラグインの導入やキャッシュ設定は管理画面から可能です。EWWW Image OptimizerやAutoptimizeの導入だけでも20〜30ポイントの改善が期待できます。ただしサーバー移行やコード修正は専門知識が必要なため、制作会社への依頼を推奨します。

Q. 画像をWebPに変換すると画質は落ちますか？

WebPはJPEGと比較して25〜35%容量を削減できますが、目視でわかるほどの画質劣化はほぼありません。歯科医院の院内写真や症例写真も問題なく使用できます。圧縮率が気になる場合はShortPixelの「Glossy」設定を選べば、画質を維持しつつ容量を削減可能です。

Q. 表示速度の改善後、SEO効果はいつ頃現れますか？

改善内容がGoogleに認識されるまでに通常2〜4週間かかります。Core Web Vitalsは過去28日間の実ユーザーデータで評価されます。そのため、改善効果が反映されるには約1ヶ月が必要です。Google Search Consoleの「ウェブに関する主な指標」レポートで改善状況を確認できます。

Q. 医療広告ガイドラインと表示速度改善に関連はありますか？

はい、間接的に関連します。キャッシュ設定により古い診療時間や休診情報が表示され続けると、虚偽の情報を掲載していると判断される可能性があります。情報更新時にはキャッシュのクリアを徹底してください。また、表示速度改善のために治療内容の記載を削除すると、必要な情報の欠落につながるため避けてください。