【忘却録】画像のリサイズ・圧縮の基準は?

Web制作学習

Webサイトを制作した時のチェック項目「画像のリサイズや圧縮されてるか」について、だいたいこれくらいの基準がいいのか、分かったことを簡単にまとめます。

ハッサク
ハッサク

この記事を書いた人:ハッサク(@hassaku_888)と申します。

普段は学習記録をTwitterにあげていますが、量が多い場合はブログにもまとめています。

明確な正解はないが目安はある

コレと言った正解はないですが、一応Googleでページ全体(HTML, CSS, js, 画像, フォント等)の容量が1.6MB以下が推奨になっています。

画像の大きさにも寄るのですが、メンターさん個人としては、

  • メインビジュアルは数百MB以下
  • 通常の画像は1つ100KB以下

には抑えているとのことでした!

ハッサク
ハッサク

絶対に指定の容量に収めないといけないということでもなく、少し超えてもいいですし、他の画像枚数や許容できる画質を考慮して調整が必要だったら調整していくぐらいですね!

▼参考

【Google推奨】Webサイトのファイルサイズは1.6MB以下、画像を適切に圧縮しよう!
こんにちは!フリーランスWebディレクター兼エンジニアののせっちです。 Webサイトやブログの画像圧縮は適切に…
Webサイトに使用する画像の容量ってどれくらいが目安? Webサイト全体のデータ目安容量も含めて考えてみる
こんにちは!ケインコスゲ(@keinkosuge)です!スマホでWebサイトを閲覧されることが多くなって久しいですが、Webサイトにおいて重要な要素の1つとして「表示速度が軽い」というのが挙げられると思います。Webサイトの表示速度において

フォルダ内の画像枚数は関係ない

そのページを表示するのにユーザーがダウンロードする必要なデータ全ての合計を1.6MBに抑えましょうという指針。
つまり、ページ内で使われるHTML, CSS, img, フォントなどすべて合わせて1.6MB以内に。ということになります。

そのため、サーバーに格納されているフォルダの画像枚数とかは関係ないです!

ハッサク
ハッサク

そもそもサイトで使わない画像をフォルダに入れないと思うので、あまり関係ないとは思いますが・・・。

タイトルとURLをコピーしました