2018.10.06こんにちは。自分のサイトの画像の読み込みが遅くて「なんで?!」ってなったことはないでしょうか。ページの立ち上がりの重さの原因の一つは実は画像のデータ容量にあります。僕の経験談ですが、ある時から自分の運営しているサイトのうちの一つが一生懸命デザインしたのはいいのですが、ページ画面の立ち上がりが異常に遅いのを疑問に思っていました。回線を変えても、他の人のPCでみてもやはり読み込みが異常に遅い。自分がサイトで使っていた画像が全部超絶重いものばかりだったことが原因であることがわかりました。img=”https://takudlc.com/wp-content/uploads/2018/06/吹き出し用taku(焦り顔)_03.png”]がーん![/say]まさに素人ならではの盲点ですよね。サイトを綺麗に見せたい![/say]という思いからでした。その思いが「重すぎ」ました。高画質のjpeg画像や、大きな画像素材を使いまくっていました。photoshopなどで加工した写真などもpng加工して大量に生産していました。ちなみにpngはjpegよりもさらに容量が大きくなります。それらの重い画像がそれがサイトの全体的な読み込み速度を遅くし、さらには、サーバー自体の制限容量をかなり占拠してしまっていたことに気がつきました。実はサイト上に表示させる画像はそんなに大きいサイズの画像を使う必要は全くありません!なので、高画質の画像の大きさを単純に画質を保ちながら縮小すればいいのです。)をレンタルし、複数のサイトを運営しているのですが、ある時、サーバーからこんなエラーメッセージが頻繁に表示されるようになりました。何が原因なのかがしばらくわかりませんでした。ブログ記事が2日で23万PVとかの時もありましたし、そういった場合はアクセス集中によるサーバーの干渉とういことでまだ納得もいくのですが、ある時を境に、リアルタイムでのアクセスが400−500PVでもこのエラーが頻発するようになり、これが何か原因があると調べて見たところ、わかりました。重い画像が原因だったんです。一つのサイトの画像類が重すぎたことによりサーバープランの制限容量の上限に近づいており、それが原因で、同じサーバー内の別のサイトのアクセス状況にまで影響を及ぼしていたということなんです。[/say]サイトの読み込み時間を改善する方法ではここから本題になります。その読み込みが異常に遅いサイトのページをどのように改善していくのかということなのですが、それは単純な話、アップロードする画像の大きさを縮小(リサイズ)すればいいんです。縦横比を保ちながら単純に縮小(リサイズ)すればいいのです。サイトに表示させる画像サイズは、1Mあれば十分綺麗なものを表示することができます。高画質の大きな横幅5000pxの画像素材であれば2000px(全画面表示)もしくは、1200pxあれば十分です。リサイズすることで大幅に容量を小さくできます。縦横比は保つよう気をつけましょう。ネット上で僕が愛用していた、無料画像の素材サービスに関してはこちらを参照ください。こんにちはtakuです。僕自身大変お世話になっているのですが、どの素材もファイルサイズが大きくなることにあまり注意を払っていませんでした。実はpngなんかは8Mものもとかを普通にアップしたりしていました。jpegでも7MBとか4MBとか普通にありました。これはいくら何でもやりすぎです。サイトの立ち上がりが遅くなるのは当たり前です。サイトのサイズを変更するためにはでは使用する画像を適切なサイズに縮小するための方法をお伝えします。そのページ上に、リサイズしたい画像素材をアップロードします。「サイズを変更」箇所を選択するとこのように簡単に画像をリサイズすることができます。保存する際に、サイズ変更が可能ですし、ウェブ用に適した解像度で保存することが可能になります。僕はPhotoshopを愛用しているので、そちらで調整するようにしました。