画像が重すぎないかを確かめる方法｜写真の多いサイトの無料チェック手順

きれいな写真をたくさん載せたホームページは、それだけでお店や会社の魅力が伝わります。ところが、その写真が「重い」状態のままだと、ページが表示されるまでに数秒かかり、見に来てくれた方が待ちきれずに離れてしまうことがあります。せっかくいい写真を用意したのに、見てもらう前に閉じられてしまうのは、とてももったいないことです。

写真が重いかどうかは、見た目では分かりません。カメラやスマホで撮った写真をそのまま載せると、1枚あたり数メガバイトという大きなデータのまま表示されていることも珍しくありません。これは誰のせいでもなく、気づく機会がなかっただけです。この記事では、専門知識がなくても無料でできる確認手順を、画面のどこを見るかまで具体的にご紹介します。所要時間はいちばん簡単なもので3分ほどです。

まず結論：画像が重いかどうかは「1枚500KB」と「表示3秒」で判断できる

写真をたくさん載せているホームページで「画像が重すぎないかを確かめる」とき、見るべき数字は2つだけです。細かい専門知識はいりません。この2つに当てはまるかどうかで、だいたいの判断がつきます。

判断の基準は2つ

• 画像1枚あたり500KB（0.5MB）を超えていたら重い寄り。ちょうどいい目安は1枚100〜300KBくらいです。
• ページが表示され切るまで3秒以上かかるなら、改善の余地あり。特にスマホの回線で見たときが大事です。

KB（キロバイト）やMB（メガバイト）は、データの量を表す単位です。1MB＝約1000KB。つまり「500KB」は0.5MB、「3MB」は3000KBということになります。数字が大きいほどデータの量が多く、読み込みに時間がかかります。

横幅のサイズもあわせて見る

もうひとつ、知っておくと役に立つのが横幅です。画像の横幅は、実際に画面に表示される大きさの2倍までが目安です。たとえばページ上で横600ピクセルで表示される写真なら、元のファイルは横1200ピクセルあれば十分きれいに見えます。それ以上大きくても、見た目はほとんど変わらないのに、データの量だけが増えていきます。

スマホで撮った写真は、そのままだと目安の10倍以上

ここがいちばん多い落とし穴です。最近のスマートフォンで撮った写真は、1枚あたり3〜5MB（3000〜5000KB）が普通。目安の100〜300KBと比べると、10倍以上の量があります。

撮った写真をそのままパソコンに移し、ホームページにそのまま載せる。流れとしてはごく自然ですし、写真の加工を意識する機会もなかなかありません。それで重くなっているとしたら、無理もない話です。むしろ、商品や施工例、料理やお店の様子をきちんと撮って載せているということですから、素材そのものは揃っているということでもあります。

重いと何が起きるのか

1. ページを開いても写真がなかなか出てこない
2. 見る人が待ちきれず、前の画面に戻ってしまう
3. どんなにいい内容を書いていても、読まれないまま終わる

つまり、問い合わせにつながる前の段階で離れられてしまう、ということです。せっかく検索から来てくれた方が、中身を見る前に帰ってしまうのはもったいない状態です。

なお、検索エンジン側も表示の速さを評価の要素のひとつとして見ているとされています。ただし、速くしたからといって検索順位が上がると約束できるものではありません。この記事はあくまで「せっかく来てくれた人に、きちんと見てもらえる状態にする」という話として読んでいただければと思います。表示の速さ全般については何秒なら遅いのかを数字で解説した記事もあわせてどうぞ。

次の章からは、この2つの基準を実際に確かめる手順を、無料の方法だけで順に説明します。いちばん早い方法なら3分ほどで終わります。

画像の重さを判断する基準

• 画像1枚の容量500KB超なら重い寄り。目安は100〜300KB
• 表示にかかる時間3秒以上かかるなら改善の余地あり
• 画像の横幅実際に画面表示される大きさの2倍までが目安

手順1：PageSpeed Insightsで3分でまとめて確認する

一番手軽なのが、Googleが無料で公開している「PageSpeed Insights（ページスピード インサイト）」というページです。何かをインストールする必要はなく、ブラウザだけで使えます。かかる時間は、測定の待ち時間を入れても3分ほどです。

操作の手順

1. 検索窓に「PageSpeed Insights」と入力して検索し、Google公式のページ（developers.google.com内のページ）を開きます。
2. 画面の真ん中あたりに、URLを入れる白い入力欄があります。そこに、調べたいページのURLを貼り付けます。トップページだけでなく、写真をたくさん載せている施工事例やメニューのページなど、気になるページのURLを個別に入れるのがおすすめです。
3. 右側の「分析」ボタンを押します。結果が出るまで30秒ほどかかるので、そのまま待ちます。
4. 結果が出たら、画面上部にある「携帯電話」「デスクトップ」の切り替えタブを確認します。まずは「携帯電話」側を見てください。今はホームページを見に来る方の多くがスマートフォンからで、しかも通信環境が不安定な場所で見ていることもあるためです。パソコンでは軽く見えても、スマホでは重い、ということがよく起こります。
5. 一番上に0〜100の点数が表示されます。一般的な目安として、50未満は改善の余地が大きい、50〜89はもう少し、90以上は良好とされています。ただしこの点数は測るたびに多少ぶれますし、点数を上げること自体が目的ではありません。あくまで「どこに重さの原因があるか」を知るための入り口として見てください。
6. そのまま下にスクロールすると「改善できる項目」という欄が出てきます。ここに、画像に関する指摘が並んでいないかを探します。
7. 各項目の行をクリックすると開き、該当する画像のファイル名と、どれくらいデータ量を減らせるかの見込みが一覧で表示されます。削減量（KBやMiBで表示されます）が大きいものから手をつけると、同じ手間でも効果が分かりやすくなります。

画像に関して探すべき表示

• 「次世代フォーマットでの画像の配信」…新しい保存形式（WebPなど）にすると、見た目をあまり変えずにデータ量を減らせますよ、という指摘です。
• 「オフスクリーン画像の遅延読み込み」…画面をスクロールしないと見えない下のほうの写真まで、最初に全部読み込んでしまっている状態のことです。
• 「適切なサイズの画像」…表示している大きさより、はるかに大きい写真が使われている、という指摘です。横300ピクセルで表示しているところに、横4000ピクセルの写真をそのまま置いている、といったケースです。
• 「画像要素で width と height が明示的に指定されていません」…写真の縦横のサイズが先に伝えられていないため、読み込みの途中でレイアウトががたついてしまう、という指摘です。重さそのものとは別ですが、見ている方の使い心地に直結します。

この4つのうちどれが出ているかで、次に何をすればいいかがほぼ決まります。全部が出ていても慌てる必要はありません。削減量の大きい写真を数枚直すだけで、体感はだいぶ変わります。なお、画像以外の原因も気になる場合は、表示速度を測って重い原因を切り分ける手順もあわせて確認してみてください。

手順2：ブラウザの「検証」で画像1枚ずつの重さを見る

手順1のPageSpeed Insightsは「このページは重いか」を全体でざっくり教えてくれますが、「どの写真が原因なのか」までは分かりにくいことがあります。そこで次は、パソコンのGoogle Chrome（グーグルクローム）に最初から入っている機能を使って、画像1枚ずつのデータ量を見ていきます。所要時間は5〜10分ほど。インストールするものは何もありません。

Chromeでの確認手順

1. 重さを確かめたいページを、パソコンのChromeで開きます。トップページでも、写真を多く載せている施工事例やメニューのページでも構いません。
2. ページの何もないところで右クリックし、出てきたメニューから「検証」を選びます（Macでトラックパッドの場合は control キーを押しながらクリック）。
3. 画面の右側か下側に、英語の文字がぎっしり並んだパネルが開きます。驚かなくて大丈夫です。見る場所は2〜3か所だけです。
4. パネルの上部に並んだタブ（Elements、Console、Network…）の中から「Network」をクリックします。
5. その少し下に、All／Doc／CSS／JS／Font／Img…という絞り込みのボタンが並んでいます。「Img」をクリックすると、画像ファイルだけが一覧に出るようになります。
6. この状態で、キーボードのF5キー（Macは command+R）、またはブラウザの再読み込みボタンを押して、ページを読み直します。読み直した瞬間から記録が始まるので、この操作を忘れると一覧が空のままです。
7. 一覧に行がずらりと出てきます。左端の「Name」が画像のファイル名、右のほうにある「Size」がその画像のデータ量です。単位はKB（キロバイト）やMB（メガバイト）で表示されます。
8. 「Size」という見出しの文字をクリックすると、大きい順・小さい順に並び替えられます。大きい順にして上から見ていき、500KBを超えている画像のファイル名をメモしておきます。これが優先して軽くすべき写真です。
9. 一覧の一番下（または下部の帯）に「○ requests ／ ○ MB transferred」という表示があります。requestsは読み込んだファイルの数、transferredがそのページ全体で読み込んだデータの合計量です。

合計の目安は2MB、写真の多いページでも3MBまで

ページ全体の合計（MB transferred）は、2MB以内なら一つの安心ラインです。写真を多く使う事例ページやギャラリーでも、3MBを超えたら減らす余地があると考えてよいでしょう。スマートフォンの電波が弱い場所では、この数字がそのまま待ち時間の差になって表れます。なお、これはあくまで判断の目安であり、この数字を下回れば検索順位や問い合わせが増えると約束できるものではありません。あくまで「読み手を待たせていないか」を確かめるための物差しです。

英語表示は、3つの単語だけ覚えれば足ります

パネルが全部英語なので身構えてしまいますが、この作業で見るのはNetwork（通信の記録）、Img（画像）、Size（重さ）の3つだけです。他の欄は読み飛ばして問題ありません。パネルを閉じたいときは、右上の×印をクリックすれば元のページに戻ります。表示を触っただけでホームページの中身が書き換わることはないので、安心して開いてみてください。

スマホしか手元にない場合

この「検証」はパソコンのブラウザの機能なので、スマートフォンだけでは同じ画面を出せません。その場合は無理に探さず、手順1のPageSpeed Insightsだけで十分です。あちらの結果にも「適切なサイズの画像」「次世代フォーマットでの画像の配信」といった項目の中に、重い画像のファイル名とおよその削減できる量が並びます。より広く表示の速さ全体を確かめたい場合は、ホームページの表示速度を測る方法と重い原因の切り分け手順もあわせてご覧ください。

Chromeの検証で調べる手順

1. 検証パネルを開くページ上で右クリックし「検証」を選ぶ
2. 画像表示に絞り込むNetworkタブを開き「Img」をクリックする
3. ページを再読み込みF5キー等で再読み込みして通信を記録する
4. サイズ順に並び替えSizeをクリックして500KB超の画像を探す

手順3：元の写真ファイルそのものを確かめる（ツール不要）

ここまでは、すでに公開されているページを外側から測る方法でした。手順3は逆に、アップロードする前（またはアップロードした元の）写真ファイルを、お手元のパソコンやスマホで直接確かめる方法です。インターネットにつながっていなくてもでき、慣れれば1枚あたり数秒、まとめて見ても3分ほどで終わります。

Windowsのパソコンで確かめる

1. 写真を入れているフォルダを「エクスプローラー」（画面下のフォルダの形のアイコン）で開きます。
2. ウィンドウ上部の「表示」をクリックし、「詳細」を選びます。ファイルが一覧になり、右側に「サイズ」という列が出ます。
3. この「サイズ」の数字が、その写真の重さです。単位が「KB」なら軽め、「MB」と出ていればかなり重い写真です。3MBや5MBといった表示が並んでいたら、そのまま載せるには大きすぎます。
4. 「サイズ」の列名をクリックすると大きい順に並び替わるので、重い写真から順に手を入れられます。
5. 横幅も見たいときは、写真を右クリック→「プロパティ」→「詳細」タブを開き、「イメージ」の欄にある「幅」「高さ」を確認します。単位はピクセルです。

Macのパソコンで確かめる

1. Finderで写真ファイルを1回クリックして選びます。
2. キーボードで command と I を同時に押します（「情報を見る」）。
3. 開いた小さなウィンドウの「サイズ」が重さ、「寸法」が横×縦のピクセル数です。
4. 複数まとめて見たいときは、Finderの表示を「リスト」にすると、サイズの列が一覧で並びます。

スマホで確かめる

iPhoneは写真アプリで画像を開き、画面を上にスワイプするか「i」のマークを押すと、下に「◯◯MB」「◯◯×◯◯」といった情報が出ます。Androidは写真を開いて「詳細」または「情報」を選ぶと、同じようにサイズと解像度が表示されます。最近のスマホで撮った写真は横4000ピクセル前後、重さは3〜5MBというのが当たり前で、ホームページに載せる用途ではほぼ確実に過剰です。

横幅の目安

使う場所	横幅の目安	重さの目安
画面いっぱいに広げる大きな写真	1600〜2000px	200〜500KB
記事やページの本文中の写真	1200px前後	100〜300KB
ロゴ・小さなカット・アイコン	600px以下	50KB以下

画面に小さく表示される写真でも、元のファイルが4000ピクセルのままなら、見る人はその大きなデータをまるごと受け取っています。表示上は小さく見えても読み込みの負担は変わらない、というのがここで一番お伝えしたい点です。

過去にアップした写真をまとめて見直す

WordPressをお使いなら、管理画面の左メニュー「メディア」→「ライブラリ」を開きます。右上の表示切り替えでリスト表示にしてファイル名をクリックすると、画面右側に「ファイルサイズ」と「寸法」が表示されます。ここを上から順に見ていくと、以前アップした写真のうちどれが重いのかを、ページを開かずに確認できます。アップロード日が古いものほど、サイズを気にせず入れていることが多いので、まずは古い順にざっと目を通すのがおすすめです。重い写真が見つかったら、画像に説明文（alt）を入れる作業とあわせて、差し替えのついでに整えておくと二度手間になりません。

重い画像を自分で軽くする：保存形式・サイズ・遅延読み込み

重い写真が見つかったら、次は軽くする作業です。ここで紹介する方法は、すべて無料の範囲でできます。難しい知識も必要ありません。ただし、作業の前にひとつだけお願いがあります。元の写真は必ず別のフォルダにコピーして残しておいてください。一度小さくした写真は元の画質には戻せないため、後から「やっぱり大きく使いたい」となったときに困ってしまいます。

1. まず「大きさ」を縮める

多くの場合、写真が重い最大の原因は、画面に表示される大きさよりずっと大きなサイズのまま載せていることです。先に縦横の大きさを縮めるだけで、容量は大きく下がります。

1. Windows：写真を右クリック→「プログラムから開く」→「ペイント」。上部の「サイズ変更」をクリックし、「縦横比を維持する」にチェックを入れたまま、横幅を1600ピクセル程度に。そのまま「名前を付けて保存」。
2. Mac：写真をダブルクリックして「プレビュー」で開き、メニューの「ツール」→「サイズを調整」。幅を1600ピクセルほどにして「OK」、command+Sで保存。
3. スマホ：写真アプリの編集機能で、切り抜き（トリミング）をすると自動的にサイズが小さくなります。不要な余白を切るだけでも効果があります。

目安として、ページの横幅いっぱいに使う写真なら1600〜2000ピクセル、記事の途中に挟む写真なら1200ピクセル、小さなサムネイルなら600ピクセルで十分です。

2. 無料の圧縮サイトに放り込む

大きさを縮めたら、次は「圧縮」です。これは見た目をほとんど変えずにファイルの容量だけを減らす作業で、ブラウザで使える無料のサイトがあります。代表的なのがSquoosh（スクーッシュ）とTinyPNG（タイニーピング）です。どちらも画面に写真をドラッグして置くだけで処理が終わります。

Squooshは右側に画質のスライダーがあり、数値を75〜85あたりに設定すると、見た目はほぼそのままで容量が半分以下になることが珍しくありません。画面の左右で加工前と加工後を見比べられるので、「これ以上下げると荒いな」という境目を自分の目で確かめられます。1枚あたり30秒ほどの作業です。

3. 保存形式を使い分ける

同じ写真でも、保存するときの形式によって容量が変わります。目的別に選ぶだけで無駄が減ります。

形式	どういうものか	向いている画像
JPEG（ジェイペグ）	色の多い写真を小さく保存できる形式。拡張子は.jpg	商品写真、店内写真、人物
PNG（ピング）	線や文字がくっきり残る形式。背景を透明にできる	ロゴ、図解、文字入りの画像
WebP（ウェッピー）	比較的新しい形式で、同じ見た目ならJPEGやPNGより軽くなることが多い	対応していれば写真・図の両方

WebPは現在のブラウザのほとんどが対応していますが、使っているホームページの仕組みによっては受け付けない場合があります。アップロードでエラーが出るようなら、無理をせずJPEGとPNGの使い分けで十分です。

4. WordPressなら仕組みに任せる手もある

WordPressでホームページを作っている場合、画像を自動で圧縮したりWebPに変換したりする追加機能（プラグイン）があります。入れておけば、以後アップロードする写真は自動で軽くなるため、毎回手作業をする必要がなくなります。ただし追加機能は増やすほど動作が重くなることもあるので、入れる前に既存のものと役割が重なっていないか確認してください。

5. 遅延読み込みと、幅・高さの指定

「遅延読み込み」とは、下にスクロールして画面に入ってきたときに初めてその画像を読み込む仕組みです。最初の表示で読み込む量が減るため、写真の多いページほど効果があります。近年のWordPressでは最初から有効になっていることが多いので、まずは特別な設定をせずに様子を見て構いません。

もうひとつ、画像に幅と高さを指定しておくと、読み込み中に文章が上下にずれる「ガタつき」が減ります。読んでいる途中で文字が動くと、それだけで離脱につながります。これも多くの場合は仕組み側で自動指定されています。

やる順番は「大きいもの・見られるもの」から

• 手順1・2で見つかった、容量が特に大きい数枚から手をつける
• 次にトップページの写真（最初に見られるページのため）
• その次に、問い合わせまでの道筋にあるページ（料金、事例、お問い合わせ）

全ページを一度に直そうとすると途中で力尽きます。効果が大きいところから順に、少しずつで十分です。なお、軽くしたあとに実際どう変わったかは、表示速度を測って重い原因を切り分ける手順と合わせて確認すると分かりやすくなります。

軽くしたあとに見るべきこと：直す前と後を比べる

画像を軽くする作業は、やりっぱなしになりがちです。せっかく手間をかけたのに「速くなった気がする」で終わってしまうのは、もったいないことです。数字で前後を比べておくと、効果がはっきりしますし、次にどこを直せばいいかも見えてきます。ここでは比べ方の手順を整理します。

1. 作業する前に、今の数字をメモしておく

これが一番大事で、一番忘れられやすい工程です。画像を差し替えてしまってからでは、元の状態には戻せません。作業に入る前に、PageSpeed Insightsの点数（0〜100の数字）と、ブラウザの「検証」→Networkタブに出る合計の容量（画面下部に「◯ MB transferred」などと表示される部分）を控えておきます。所要時間は1ページあたり3分ほどです。

記録は、表計算ソフトでもメモ帳でも構いません。次のような項目を並べておけば十分です。

• 日付（例：2025年4月10日）
• ページのURL（トップページ／施工事例ページ、など区別がつく形で）
• PageSpeed Insightsの点数（スマホ・パソコンの両方）
• Networkタブの合計容量（◯MB）
• やったこと（例：事例写真12枚を幅1200pxに縮小、WebPに変換）

「やったこと」の欄があると、あとから見返したときに、どの作業が効いたのかを自分で判断できます。

2. 直したあと、同じ手順で測り直す

作業が終わったら、同じページを同じ手順で測ります。このとき注意したいのが、ブラウザのキャッシュ（一度見たページの中身を、端末が覚えておく仕組み）です。覚えている古い画像が表示されてしまい、直したはずなのに変化が見えない、ということが起こります。

1. Windowsなら「Ctrl」＋「Shift」＋「R」、Macなら「command」＋「shift」＋「R」を押して、強制的に読み込み直す（スーパーリロード）
2. それでも不安なら、Chromeの右上「︙」から「新しいシークレット ウィンドウ」を開き、そこでURLを入力して確認する
3. PageSpeed Insightsは毎回新しく読み込むため、キャッシュの影響は受けにくいものの、測るたびに数点ぶれることがある。1〜2点の上下は誤差と考え、10点以上の変化を目安にする

3. サイト全体はSearch Consoleで月1回ながめる

1ページずつの確認に加えて、サイト全体の傾向はSearch Consoleの左メニューにある「ウェブに関する主な指標」で見られます。「不良」「改善が必要」「良好」とページがまとまって分類されるので、どのかたまりに課題が残っているかが分かります。

ただしここの数字は、実際に訪れた人の端末から集めたデータをもとにしているため、直した内容が反映されるまで数週間かかります。翌日に見て変わっていなくても、何も問題はありません。月に1回ながめる程度で十分です。より広く速度の原因を切り分けたいときは、ホームページの表示速度を測る方法もあわせて確認してみてください。

4. 速度は「土台」。すぐに問い合わせが増えるとは限らない

正直にお伝えすると、画像を軽くしたからといって、問い合わせがその翌週に増えるとは限りません。速度の改善は、見てもらえる状態をつくるための土台です。開くのを待てずに離脱していた方が、最後まで読めるようになる。その先に、文章が伝わるか、問い合わせ先が分かりやすい場所にあるか、という話が続きます。

ですから、前後の比較で見るべきは「点数が上がったか」であって、「問い合わせが増えたか」ではありません。問い合わせの増減は、速度以外のたくさんの要素に左右されます。土台を整えたという事実を記録に残し、次は文章や導線へ、と順番に進めていくのが確実です。

まとめ：写真の重さは、無料で今日から確かめられる

写真をたくさん載せているホームページは、見た目の良さと引き換えに、表示までの時間が長くなりやすいものです。きれいな写真を選んで並べた結果なので、重くなってしまうのは無理もありません。ただ、重さは感覚ではなく数字で確かめられますし、確かめるためにお金をかける必要もありません。この記事でお伝えした内容を、もう一度短く整理しておきます。

判断の目安は2つだけ

• 写真1枚あたり500KB（0.5MB）を超えていないか。ページ全体で何枚も並ぶので、1枚が重いとそのまま積み上がります。
• ページが表示され終わるまでが3秒を超えていないか。待たされると、内容を見る前に離れてしまう方が増えます。

この2つに収まっていれば、写真が原因で見てもらえていない、という可能性はひとまず下げて考えて大丈夫です。

確かめる手順の振り返り

1. PageSpeed Insightsで全体を見る（約3分）。URLを入れて分析するだけで、「画像を効率的なフォーマットで配信する」「適切なサイズの画像」といった項目に、重い写真のファイル名と削減できる容量が並びます。
2. ブラウザの検証（デベロッパーツール）のNetworkタブで1枚ずつ見る（約5分）。Imgで絞り込み、Sizeの列を大きい順に並べれば、どの写真が何KBなのかがそのまま分かります。
3. 元の写真ファイルそのものを確かめる（約1分）。パソコンのフォルダでファイルを右クリックしてプロパティ（Macは情報を見る）を開き、サイズと画素数を見る。撮ったままの写真をそのまま載せていた、というのはとてもよくあることです。
4. 軽くする。表示する幅に合わせて縮小し、保存形式を見直し、圧縮をかける。下のほうの写真は遅延読み込み（画面に近づいてから読み込む設定）にする。
5. 直す前と後を比べる。同じPageSpeed Insightsでもう一度測り、秒数とKBがどう変わったかを記録しておく。

1ページ分からで十分です

サイト全体の写真を一度に直そうとすると、手が止まってしまいます。まずは、いちばん見てほしい1ページ――トップページでも、主力の商品やサービスのページでもかまいません――そこだけを軽くしてみる。それだけでも、訪れた方が内容にたどり着くまでの時間は変わります。写真の重さ以外にも気になることが出てきたら、表示速度を測って重い原因を切り分ける手順もあわせてご覧ください。

一方で、測ってはみたものの数字の意味が判断しづらい、どの写真から手をつけるべきか迷う、ということもあると思います。そうしたときは、シロツメWebの無料のホームページ診断をご利用ください。シロツメWebを運営するSHIROTSUME GRASS株式会社は、もともと法人向けの中古スマートフォン・パソコンの買い取りと販売が本業で、その集客を自分たちでSEO記事を書いて行い、結果が出たので他社にもお手伝いとして提供しています。お申し込みはホームページのURLとメールアドレスだけで、そのあと営業のご連絡を重ねることはありません。検索順位や問い合わせ数をお約束するものではありませんが、いま何が足を引っ張っているのか、どこから手をつけると良さそうかを、一緒に見させていただきます。

よく読まれている関連ガイド

• 何年か触っていないホームページを、作り直さずに動かし直す手順