スマホサイトが動かない｜原因・低電力モード・確認方法を解説

「スマホでWebサイトを見ると、スライダーや動画が動かない」
「パソコンでは表示されるのに、スマホだけ演出が始まらない」と困っていませんか？

Webサイトの動きには、自動スライド、動画の自動再生、スクロールに合わせた表示、フェードイン、
数字のカウントアップなどがあります。

これらが止まる原因は、サイトの不具合だけとは限りません。
スマホの省電力設定、アクセシビリティ設定、ブラウザーの仕様、通信状態なども関係します。

よこやま良平

3,000以上のサイト・システム制作に携わってきたよこやま良平です。スマホでWebサイトの動きが止まった時に、初心者でも試せる確認方法を順番に解説します。

結論から言うと、設定やブラウザーを一つずつ変えながら確認すると、原因を絞り込みやすくなります。
低電力モードだけを原因と決めつけず、「何が表示され、どの動きだけが止まっているか」から整理しましょう。

【無料プレゼント】
WordPress緊急チェック50

「自分のサイトは今、安全なのか？」
自信を持って答えられますか？

こんなお悩みはありませんか？

• ある朝、サイトを開いたら真っ白画面になっていた
• 管理画面にログインできなくなって手が止まった
• 身に覚えのない記事やページが勝手に増えていた
• プラグインを更新したらサイト全体が崩れてしまった
• 以前バックアップを取ったか自分でも覚えていない

累計1,000件以上のWordPressトラブル対応の経験から、「壊れる前に備える」ためのチェックリストを1冊にまとめました。
ログイン・本体・バックアップ・サーバー・運用の5分野を、50項目で「危険度・確認方法・対処法」まで解説しています。

セキュリティプラグイン・WordPressの教科書も含めた3大特典を、
今なら無料で受け取れます。

今すぐ無料ダウンロードする →

※登録後すぐにメールで特典をお届けします

スマホでWebサイトの動きが止まる主な原因

スマホでWebサイトの動きが止まる時は、端末、ブラウザー、通信、サイトの実装という4つの方向から確認します。見た目が同じでも原因は異なるため、最初に候補を整理しておくことが大切です。

省電力やアクセシビリティの設定

スマホには、消費電力や画面の動きを抑えるための設定があります。
iPhoneの低電力モードではバックグラウンド処理や一部の視覚効果が制限され、
「視差効果を減らす」では画面上の一部の動きや効果が変わります。

こうした設定がオンでも、すべてのWebアニメーションが必ず止まるわけではありません。
ただし、別の端末と挙動が違う時に比較する価値がある項目です。

ブラウザーやアプリ内表示の違い

同じURLでも、SafariやChromeで直接開いた場合と、LINE・SNS・メールアプリの中で開いた場合では動作が異なることがあります。
アプリ内ブラウザーは、通常のブラウザーと機能や保存データの扱いが同じとは限りません。

まずはURLをコピーし、iPhoneならSafari、AndroidならChromeなど、普段使うブラウザーで直接開いて比較してください。

通信やキャッシュによる読み込み不足

画像、動画、JavaScriptの読み込みが終わっていないと、動きだけが始まらないことがあります。
通信が不安定な場所や、古いファイルがブラウザーに残っている場合は、表示が途中で止まったように見えることもあります。

ページの再読み込み、Wi-Fiとモバイル通信の切り替え、ブラウザーの再起動で変化があるかを確認しましょう。
写真や文字まで欠けているなら、アニメーションより先に読み込みの問題を疑います。

JavaScriptやCSSの不具合

設定を変えても複数のスマホで同じ症状が出る場合は、
サイト側のJavaScriptエラー、CSSの重なり、プラグイン同士の競合などが考えられます。
更新直後から発生したなら、直前に変更したテーマ、プラグイン、独自コードも確認対象です。

WordPressでは、表示を高速化するためのキャッシュ機能や、JavaScriptをまとめる最適化機能が影響する場合もあります。
管理画面で更新した内容がスマホだけ古いままなら、サイト側とブラウザー側のキャッシュを分けて確認してください。

WordPress修復・マルウェア駆除ク…

CSS修正でスマホ表示が崩れた時に見るべきポイント CSS修正後にスマホ表示だけ崩れて困っていませんか？固定幅、メディアクエリ、キャッシュ、テーマCSSの上書きなど、原因別の確認ポイントと安全な直し方を初心者向けに解説…

低電力モードがWebサイトへ与える影響

iPhoneの低電力モードは、バッテリー残量が少ない時に消費電力を抑える機能です。
Webサイトの動きが普段と違う時は確認候補になりますが、
低電力モードとJavaScriptの停止を同じ意味で考えないようにしてください。

低電力モードでは一部の処理や効果が制限される

Appleは、低電力モードを有効にすると、バックグラウンドでの動作を減らし、
一部の視覚効果をオフにすると説明しています。

対応するProMotionディスプレイでは、リフレッシュレートも最大60Hzに制限されます。

これらは端末全体の消費電力を抑えるための変更です。
特定のスライダーや動画を停止させる設定ではないため、解除して変化がなければ別の原因を順番に確認します。

低電力モードを一時的に解除して比較する

iPhoneで確認する場合は、低電力モードを一時的にオフにしてからページを再読み込みします。
確認が終わったら、普段の設定へ戻して問題ありません。

設定 → バッテリー → 低電力モード

機種やiOSによっては
設定 → バッテリー → 電力モード → 低電力モード

バッテリーアイコンが黄色になっていれば、低電力モードが有効になっている目印です。
設定画面の名称や並びは、機種やOSのバージョンで変わる場合があります。

視差効果を減らす設定は別に確認する

「視差効果を減らす」は、画面の動きに敏感な方がアニメーションや効果を抑えるためのアクセシビリティ設定です。
低電力モードとは別の機能なので、片方がオフでも、もう片方がオンになっていることがあります。

設定 → アクセシビリティ → 動作 → 視差効果を減らす

この設定は不具合ではなく、利用しやすさのために選ばれるものです。
サイト側では、動きを減らす設定を尊重しながら、静止状態でも内容を理解できる作りが求められます。

スマホでWebサイトが動かない時の確認手順

原因を切り分ける時は、複数の設定を一度に変更しないことが重要です。
一つ変更するたびに同じページを確認し、何を変えた時に動作が変わったかを残します。

最初から動かないのか途中で止まるのかを確認する

ページを開いた直後から動かないのか、一度動いてから止まるのかで確認する場所が変わります。
最初から動かない場合は、読み込み、端末設定、ブラウザー、自動再生の条件などを確認します。

タップやスワイプの後だけ止まる場合は、操作中に一時停止する機能や、再開条件が関係している可能性があります。
別の画面へ移動して戻った後だけ止まるなら、ページの復帰処理も確認対象です。

通常のブラウザーで開き直す

アプリ内で開いている場合は、共有メニューなどからSafariやChromeへ切り替えます。
それだけで動くようになれば、サイト全体ではなく、開き方による差を疑えます。

次にページを再読み込みし、別のタブでも試します。
古い状態が残っていそうな時はブラウザーをいったん終了してから開き直してください。

ブラウザーやOSが長期間更新されていない場合は、更新後にも確認します。
ただし、仕事や決済に使う端末では、
必要なデータのバックアップや利用中アプリの対応状況を確かめてから更新してください。

端末設定・通信・更新を一つずつ比べる

低電力モードを切り替えたら、その条件だけでページを確認します。続いて「視差効果を減らす」、
Wi-Fiとモバイル通信、ブラウザーやOSの更新状況を順番に確認します。

確認結果を短く記録する

再現しにくい不具合ほど、端末と症状の記録が役立ちます。専門用語が分からなくても、
次の項目があれば調査範囲を絞りやすくなります。

端末：iPhone／Android（分かれば機種名）
OS：分かる範囲で記入
ブラウザー：Safari／Chrome／アプリ内表示
症状：最初から／途中から／操作した後
手動操作：できる／できない
試したこと：再読み込み、低電力モード、別回線など
確認日時：年月日とおおよその時刻

画面録画ができる場合は、ページを開いてから止まるまでを短く記録すると、文章だけでは伝わりにくいタイミングも確認できます。

記録する時は、個人情報や管理画面の情報が映り込まないように注意しましょう。
公開ページのURLと症状が出る位置も残しておくと、同じ条件で確認しやすくなります。

動かないWeb機能を症状別に切り分ける

「Webサイトが動かない」という症状を、機能ごとに分けてみましょう。
画面全体の問題なのか、一つの機能だけの問題なのかが分かると、確認すべき設定やコードが見つかりやすくなります。

スライダーやカルーセルが動かない

画像スライダー、横スクロール、商品カルーセルが自動で動かない時は、矢印ボタンや指のスワイプで動かせるかを確認します。
手動で動くなら、画像表示よりも自動再生や一時停止の条件を中心に調べます。

手動でも動かず、画像も欠けているなら、読み込み、CSSの幅、他の要素との重なりなども確認が必要です。「表示されない」と「自動で動かない」を分けるのがポイントです。

動画や音声が自動再生されない

スマホのブラウザーでは、意図しない音声再生を防ぐため、自動再生に条件があります。WebKitはiOS上の動画について、音声トラックがない動画やミュートされた動画などに自動再生を認める方針を案内しています。

音声付き動画が止まる場合は、故障ではなくブラウザーの仕様である可能性があります。
再生ボタンを用意し、タップ後に再生できるかを確認してください。背景動画は、止まっても内容が分かる代替画像を設定すると安心です。

WebKit

New Policies for iOS Since before your sun burned hot in space and before your race was born, Safari on iOS has required a user gesture to play media in a

スクロール演出やフェードインが出ない

画面をスクロールすると文章や画像が現れる演出は、表示位置の判定やJavaScriptに依存します。
演出前の状態で要素を透明にしていると、処理が動かない時に内容まで見えなくなることがあります。

ページ下部だけ空白になる、更新後から一部の見出しが消えたという場合は、アニメーション開始前のCSSと、JavaScriptエラーの有無を確認します。

カウントアップや追従表示だけ止まる

数字のカウントアップ、追従ボタン、画面下部の固定メニューなど、一部だけ動かない場合は、その機能を実行する条件や他の要素との重なりを確認します。タップできない時は、透明な要素が上に重なっていないかも重要です。

WordPress修復・マルウェア駆除ク…

CSS修正で表示崩れを直す方法｜WordPressでよくある原因と対処法 CSS修正でWordPressの表示崩れが起きて困っていませんか？追加CSS、キャッシュ、テーマ、スマホ表示の原因を切り分け、安全に直す手順を解説します。

スマホの環境差に強いWebサイト設計

端末設定やブラウザーの違いを完全になくすことはできません。そのため、アニメーションが動くことを前提にせず、止まっても情報や操作が失われない設計にすることが重要です。

手動操作と静止表示を用意する

スライダーには矢印やスワイプ操作、動画には再生ボタン、フェードイン要素には最終的な表示状態を用意します。動きがなくても内容を読めて、目的のボタンを押せることが基本です。

動きを減らす設定を尊重する

Webサイト側では、端末やブラウザーから伝えられる「動きを減らしたい」という設定に合わせて演出を弱めることができます。強い移動や点滅を避け、必要な情報は動き以外の方法でも伝えましょう。

複数環境で確認しエラーを記録する

パソコンだけでなく、iPhoneとAndroid、SafariとChrome、通常表示とアプリ内表示など、条件を分けて確認します。すべての機種を用意できなくても、OSや画面幅の異なる複数環境で試すと問題を見つけやすくなります。

サイトを更新した日付、使用中のテーマやプラグイン、発生したJavaScriptエラーも記録しておくと、再発時の比較に役立ちます。動作確認はトップページだけでなく、同じ機能を使う下層ページでも行いましょう。

スマホのWebサイト表示でよくある質問

スマホでWebサイトの動きが止まった時に迷いやすい点をまとめます。

低電力モードにするとWebサイトの動きは必ず止まりますか？

必ず止まるとは言えません。低電力モードでは一部の処理や視覚効果が制限されますが、実際の動作は端末、OS、ブラウザー、サイトの実装によって異なります。解除前後を比較し、変化がなければ別の原因も確認してください。

低電力モードを解除しても動かない時はどうしますか？

SafariやChromeで直接開き、ページの再読み込み、アクセシビリティ設定、通信の切り替え、別端末での表示を順番に試します。複数環境で同じ症状が出る場合は、JavaScriptやCSSも確認します。

動画だけ自動再生されないのは故障ですか？

故障とは限りません。スマホのブラウザーでは、音声付き動画などの自動再生が制限されることがあります。ミュート状態や再生ボタンの有無を確認し、タップ後に再生できるか試してください。

端末の設定で直ればサイト修正は不要ですか？

不要とは限りません。設定によって動きが止まる環境でも、文章や画像を見られるか、手動操作できるかを確認してください。情報が消える、操作できない場合は、サイト側にも改善の余地があります。

スマホでWebサイトが動かない時のまとめ

スマホでWebサイトの動きが止まっても、すぐに一つの原因へ決めつける必要はありません。端末設定、ブラウザー、通信、サイトの実装を分け、一つずつ比較すると解決へ近づけます。

「スマホだけ動かない」という情報に、端末・ブラウザー・発生タイミングを加えるだけでも、原因を切り分けやすくなります。

スマホの表示不具合が自分で解決できない時は

スマホだけWebサイトが動かない、動画が再生されない、表示が崩れるなど、原因を絞り込めない不具合でお困りならクイックレスキューへご相談ください。

端末差がある不具合も、症状と条件を整理しながら原因を切り分けます。まずは分かる範囲で状況をお知らせください。