写真が重くて上がらない！画像の軽量化をハッシー先生に聞いてみた

画像の軽量化ってなぜ大事？

最近のスマホは、とてもきれいな写真が撮れます。そのぶん1枚のデータも大きく、ホームページに載せるには必要以上のサイズになっていることがよくあります。大きな写真がたくさん並ぶと、ページを開いたときの表示が遅くなり、見る人を待たせてしまいます。

ページを見る人の多くは、スマホで、外出先や移動中に見ています。表示に時間がかかると、内容を見る前に閉じられてしまうこともあります。写真が多い園や学校の行事報告、お店の商品紹介ほど、この差は大きくなります。写真がたくさん並ぶページほど、1枚ずつの重さが積み重なって効いてくるからです。

もうひとつ気をつけたいのが、写真に含まれる撮影場所などの情報です。子どもたちの写真を載せる場面も多いので、こうした情報はできるだけ残さずに公開したいところです。

さらに、写真のファイル名がばらばらだと、あとで差し替えたいときに目的の1枚が見つからず困ることになります。サイトの更新を担当する人が替わったときにも、整理された名前なら引き継ぎがスムーズです。軽くすることと、名前をそろえること。どちらも、長く続けていくための下ごしらえです。最初に整えておけば、毎回の更新もぐっと気楽になります。

ツールの使い方

1. 写真をまとめてドラッグ＆ドロップするか、「写真を選ぶ」から選びます。JPEG・PNG・WebPに対応していて、枚数の制限はありません。
2. 長辺の最大サイズ（1200・1600・2000px・元のまま）、形式（JPEG・WebP・元の形式）、画質を選びます。必要なら、先頭の名前・日付・連番でファイル名もまとめて変えられます。
3. 合計の容量がどれだけ軽くなったかを確かめて、「まとめてZIPで保存」で書き出します。

iPhoneのHEIC形式の写真は、ブラウザによって読み込めないことがあります。その場合は、iPhoneの「設定」→「カメラ」→「フォーマット」を「互換性優先」にして撮るか、写真アプリからJPEGで書き出すと読み込めます。

画面には書き出し前と後の合計容量が並ぶので、どれくらい軽くなったかが数字でひと目で分かります。思っていた以上に軽くなって、驚く方も多いところです。

ここがポイント

• ブログやサイトなら長辺1600pxで十分。迷ったらこのサイズにしておけば、まず困りません。もともと小さい写真は拡大されないので安心です。
• 形式は迷ったらJPEG。WebPにするとさらに軽くなります。画質は初期値の80%が目安で、下げるほど軽く、そのぶん粗くなります。なお、画質の設定はPNGには効きません。
• 位置情報などは自動で消える。撮影場所・機種・日時といったExif情報は、写真を描き直して保存するときに取り除かれます。写真の向きは正しいまま保たれます。
• ファイル名をそろえると、あとが楽。「IMG_1234」のままだと、あとで探すのも差し替えるのも大変です。たとえば「undokai_20261004_001.jpg」のように、半角英数字でそろえておくと整理しやすくなります。

まとめ

写真を載せる前のひと手間で、ページは見違えるほど軽くなります。見る人を待たせないこと、写っている人の情報を守ること。どちらも、ページを見に来てくれる人への思いやりだと僕は思っています。

操作は、写真を入れて保存するだけです。まずはいつもの写真を何枚か入れて、どれくらい軽くなるかを見てみてください。

写真は、そのページの雰囲気をいちばん伝えてくれる大切な素材です。だからこそ、きれいさを保ちながら、見る人に負担をかけない大きさに整えてあげたい。園の行事やお店の日々の様子を、気持ちよく見てもらえるページにしていきましょう。

画像の軽量化・ファイル名の一括整理を使ってみる

写真の多いサイトの表示速度が気になる、更新の手順を整えたいというときは、お問い合わせからご相談ください。