ホームページの文字を直してもらったのに、開いてみると前のまま。
自分では直したはずなのに、スマホで見ると古い情報が出てくる。
こんにちは、三重県でホームページ制作をしているMYコンサルティングです。
この症状はほとんどが「キャッシュ」で説明できます。ただ、キャッシュを消しても直らないケースが一定あります。検索して出てくる記事の多くはキャッシュの消し方までしか書いていないので、そこで手詰まりになる方が多いようです。
この記事では、まず3分でできる切り分けを示したうえで、キャッシュ以外の原因を制作会社の視点で並べます。最後に、そもそもお客様にキャッシュを消させずに済ませる設定も公開します。
先に結論
・まずシークレットウィンドウで開く。これが最速の切り分けです
・そこで新しく見えるなら、原因は自分のブラウザ。古いままならその先に原因があります
・スマホだけ古いならLINEやInstagramのアプリ内ブラウザを疑ってください
・制作側の設定で、この問題はほぼ起きなくできます
この症状は、「ホームページが更新されない」とも「ホームページが更新できない」とも言われます。
前者は直したのに画面が変わらない状態、後者は編集そのものができない状態を指すことが多いのですが、実際に相談を受けるとどちらも同じ原因だったということが起こります。この記事では両方を扱います。
まず3分:シークレットウィンドウで切り分ける
いきなり結論から書きます。シークレットウィンドウ(プライベートブラウズ)で同じURLを開いてください。
これが最も速く、確実な切り分けです。シークレットウィンドウは保存されたキャッシュを使わずにページを取りに行くため、「自分のブラウザの問題」なのか「それ以外の問題」なのかが一発で分かります。
開き方
パソコン:Chrome / Edge は Ctrl+Shift+N(Macは ⌘+Shift+N)、Safari は「ファイル」→「新規プライベートウィンドウ」
スマホ:ブラウザのタブ切り替え画面に「シークレット」または「プライベート」の切り替えがあります
当社がお客様にご案内するときも、必ずこの方法をお伝えしています。「Ctrl+F5を押してください」という案内は、実は現場では通用しにくいからです。キーボードの組み合わせは環境によって違いますし、ノートパソコンではFキーの扱いが機種で変わります。シークレットウィンドウなら、画面を見ながら誰でも辿り着けます。
それでも見たい人向け:強制再読み込み
ブラウザに残ったキャッシュを無視して読み込み直す操作です。切り分けができたあと、自分のブラウザを最新にしたいときに使ってください。
Windows は Ctrl + F5、Mac は ⌘ + Shift + R(Safariだけ ⌘ + Option + R)。
スマホにこの操作はありません。シークレットで開くか、ブラウザ設定からキャッシュを削除します。
ブラウザ別の詳しいキー、キーが効かないときの確実な方法、スマホでの代わりはスーパーリロードのやり方の記事にまとめています。
キャッシュそのものの仕組みについては、キャッシュとは何かの記事で図解しています。
キャッシュ以外の原因8つ
ここからが本題です。シークレットウィンドウでも古いままだった場合、原因はブラウザより先にあります。
① スマホのアプリ内ブラウザ(いちばん多い)
LINEやInstagram、Facebookのアプリの中でリンクを開くと、アプリが持っている簡易ブラウザで表示されます。これがアプリ独自のキャッシュを持っていることがあります。
「パソコンでは新しいのに、スマホだけ古い」という相談は、ほとんどこれです。
SafariやChromeでURLを直接開き直せば最新が表示されます。アプリ内ブラウザはキャッシュの消し方が分かりにくいので、確認作業は必ず通常のブラウザで行ってください。
② サーバー側のキャッシュ機能
レンタルサーバーには表示を速くするためのキャッシュ機能が付いていることがあります。ConoHa WINGの「コンテンツキャッシュ」などが該当します。
これが有効だと、ファイルを新しくしてもサーバーが古い内容を返し続けます。管理画面からキャッシュをクリアするか、機能自体を切る必要があります。
当社は静的HTMLのサイトではこの機能を切っています。表示速度はもともと十分に速く、それよりも「更新が即座に反映されない」ほうが実務では困るからです。
③ CDN(Cloudflareなど)
CDNを挟んでいる場合、世界各地のサーバーにコピーが配られています。元のファイルを更新しても、コピーが古いままだと古い表示が出ます。CDNの管理画面から「Purge(パージ)」の操作が必要です。
当社の考え方:小さなお店のサイトにCDNは原則いりません
キャッシュの層が二重になり、「反映されない」ときの切り分けが一気に難しくなるからです。速度のメリットより、運用の手間とトラブルのほうが大きくなりがちです。
入れる場合は、HTMLだけはCDNのキャッシュを通さない設定にして、更新のたびにパージする運用を必ず決めておいてください。
④ WordPressのキャッシュプラグイン
WP Super CacheやLiteSpeed Cacheなどを入れている場合、プラグインが生成した古いページが表示され続けることがあります。プラグインの管理画面から「キャッシュを削除」を実行してください。
⑤ アップロード先が違う
ここから先は、自分で更新している方や制作側のミスです。
よくあるのは、テスト用のフォルダに上げてしまった、1階層違うディレクトリに置いたというケース。ファイルは確かに新しいのに、公開されている場所とは別の場所に置かれています。
⑥ ファイル名の大文字と小文字
サーバーは大文字と小文字を区別します。Logo.png と logo.png は別のファイルです。
自分のパソコン(特にWindowsやMac)では区別されないため、手元では正常に見えていて、サーバーに上げた途端に古い画像のまま、ということが起こります。
⑦ アップロードが途中で失敗している
これは当社が実際に踏んだ失敗なので、はっきり書いておきます。
転送が途中で切れて、中身が空のファイルが上書きされていたことがありました。FTPソフトの画面上は「成功」と出ていて、ファイルも存在している。ところがサイズが0バイトで、中身がない。
アップロード後は、ファイルサイズが正しいかどうかまで確認する習慣をつけてください。当社はこの一件以降、アップロードの方法自体を変え、転送後に必ずサイズを検証するようにしています。
⑧ サーバーやドメインの切り替え直後
サーバーを引っ越した直後や、ドメインの設定を変えた直後は、見る人によって新旧どちらのサーバーを見るかが分かれます。世界中のDNS情報が入れ替わるまで、数時間から長ければ2日ほどかかります。
この場合は待つしかありません。切り替えの前後に「反映されない」が起きたら、まずこれを疑ってください。
【制作側】お客様に消させない設定
ここからは作る側の話です。そもそもキャッシュで困らせないのが本来あるべき形だと考えています。
考え方:HTMLは残さない、CSSと画像は長く残してバージョンで管理する
更新のたびに変わるのはHTML(文章)です。ここをキャッシュさせなければ、文字の修正はすぐ反映されます。
一方でCSSや画像は容量が大きく、毎回読み込ませると表示が遅くなります。こちらは長期間キャッシュさせたうえで、ファイル名の後ろにバージョンを付けて、更新したときだけ新しく読み込ませます。
<link rel="stylesheet" href="style.css?v=20260818">
この ?v= の数字を更新のたびに変えれば、ブラウザは別のファイルとして扱い、確実に新しいCSSを読み込みます。お客様側の操作は何も要りません。
サーバー側の設定(.htaccess)
Apache系のサーバーであれば、.htaccess に次のように書きます。当社が全案件で使っている標準設定から、キャッシュに関わる部分を抜き出したものです。
# HTML: キャッシュさせない(更新を即反映)
# CSS/JS/画像: 1年キャッシュ(?v= で更新制御)
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/html "access plus 0 seconds"
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
</IfModule>
これだけで、文章の修正は即座に反映され、表示速度も保てます。
当社ではこの設定に加えて、CSSやJSを更新したときに ?v= を一括で書き換える仕組みを用意し、公開後にヘッダーを確認するところまでを手順に入れています。
公開後の確認まで手順にする
設定しただけでは不十分で、実際にそう動いているかの確認が要ります。当社の場合は、公開のたびに次を行っています。
サーバーが新しいファイルを返しているかをヘッダーで確認し、シークレットウィンドウで実機を見る。この2つです。ここまでやって初めて「更新が終わった」と考えています。
制作会社に連絡するとき伝えること
自分で解決できないときは、遠慮なく制作会社に連絡してください。そのとき、次の情報があると原因の特定が一気に速くなります。
伝えると早いこと
・どのページの、どの部分が、いつ時点の表示のままか
・シークレットウィンドウで見ても古いか(これが決定的な情報です)
・パソコンとスマホの両方で起きているか、片方だけか
・スマホの場合、LINEなどのアプリから開いたか、ブラウザから開いたか
・可能ならスクリーンショット
逆に、これらを聞かずに「キャッシュを消してください」だけで済ませようとする制作会社であれば、少し距離を置いて考えたほうがいいかもしれません。閲覧者にキャッシュ削除をお願いしなければ回らない状態は、本来は制作側の設定で解決すべき問題だからです。
よくある質問
スーパーリロードをしても反映されません。どうすればいいですか?
まずシークレットウィンドウ(プライベートブラウズ)で開いてみてください。それで新しい表示になるなら、原因はご自身のブラウザに残ったキャッシュです。シークレットでも古いままなら、ブラウザより先の場所——サーバー側のキャッシュ、CDN、あるいはそもそもファイルが正しくアップロードされていない可能性を疑います。
スマホだけ古い表示のままです。なぜですか?
LINEやInstagramのアプリの中で開いた場合、アプリ内ブラウザが独自にキャッシュを持っていることがあります。SafariやChromeで直接そのURLを開き直すと最新が表示されることが多いです。アプリ内ブラウザはキャッシュの消し方が分かりにくいので、確認は必ず通常のブラウザで行ってください。
見る人によって表示が違うのはどうしてですか?
それぞれの手元に残っているキャッシュの状態が違うためです。一度も見たことがない人には最新が表示され、以前に見た人には古い表示が残る、ということが起こります。全員に確実に最新を見せたいなら、閲覧者側の操作に頼るのではなく、制作側でキャッシュの制御を設定しておく必要があります。
キャッシュを削除すると、保存したパスワードや履歴も消えますか?
ブラウザの削除画面で「キャッシュされた画像とファイル」だけを選べば、パスワードやログイン状態は残ります。ただし「Cookie」も一緒に消すとログアウトされるサイトが出てきます。不安な場合は削除せず、シークレットウィンドウで確認する方法をおすすめします。
更新を頼んだ制作会社に何を伝えればいいですか?
「どのページの、どの部分が、いつ時点の表示のままか」を伝えてください。あわせて、シークレットウィンドウで見ても古いかどうか、パソコンとスマホの両方で起きているか、この2点があると原因の切り分けが一気に進みます。可能ならスクリーンショットも添えてください。
そもそも毎回キャッシュで困らない方法はありますか?
あります。制作側の設定でほぼ防げます。HTMLはキャッシュさせず、CSSや画像は長期間キャッシュさせたうえでファイル名の後ろにバージョンを付ける、という方法です。この設定をしておけば、更新のたびにお客様へキャッシュ削除をお願いする必要がなくなります。当社は全案件で標準にしています。
まとめ
更新したのに反映されないときは、まずシークレットウィンドウ。
そこで新しく見えるなら自分のブラウザ、古いままならその先——アプリ内ブラウザ、サーバー側のキャッシュ、CDN、あるいはアップロードそのものの失敗を順に疑ってください。
そして本来は、閲覧者に操作をお願いしなくても済むように、制作側が設定しておくべき問題です。HTMLはキャッシュさせず、CSSと画像はバージョンで管理する。これだけで大半は起きなくなります。
当社では、この設定を全案件の標準にしています。
「更新をお願いしても、いつも反映されるまで時間がかかる」「毎回キャッシュを消してくださいと言われる」という状態でお困りでしたら、設定を見直すだけで解決する可能性があります。お気軽にご相談ください。料金プランはこちらです。
関連記事として、キャッシュとは何か、リニューアルの進め方もあわせてどうぞ。