画像圧縮でデータを軽くする

HPを最初形にして公開したとき、めちゃくちゃ重かったので、やった対策としては、ホバーボックスやベクター画像を極力減らしたということと、上げられてる画像を全部圧縮してデータを軽くしたことでした。

いろいろやってみたんで、ちょっと情報共有したいと思います!

まずはPhoshopで「WEBおよびデバイス用に保存」で書き出す

僕が使ってるのはPhotohopCS5なので、こういう項目名なんですが、たぶんPhotoshopCCだと違う名前かも。しかし、同等の機能はあるはずです。とりあえず、この機能で書き出せば、PNGにしてもJPGにしても普通に別名保存で書き出すより軽くなるので、自分はもっぱらこの機能で書き出します。

PNGoo

https://pngquant.org/ (ダウンロードの項目内に「PNGoo」があります。)

PNG画像をアルファチャンネル付きの8bitPNGに変換します。

これは透明度の情報はそのままに、24bitのフルカラーを256色までのインデックスカラーにして容量を削減するというもので、さらに半分くらいのサイズになったりするので、かなりおススメ!

ただ、注意点としてはアルファチャンネル付きの8bitPNGをサポートしてないソフトで開くと、正常に表示できなかったり、表示できてもそのソフトで保存するとフルカラーのPNGと同じ扱いになって容量が増えちゃったりするので、圧縮後は画像編集ソフトなどで触らないほうがいいかもしれないです。

ちなみにUnityやRPGツクール(2000以外)なんかでも普通に読み込めるので、ゲーム制作で容量を節約したいときなんかにもおすすめです!

Voralent Antelope

http://www.voralent.com/ja/products/antelope/

JPG、PNG、GIFの圧縮に対応してます。PNGは「非可逆圧縮モード」で圧縮すると、前出のアルファチャンネル付きの8bitPNGで書き出されます。サイズも半分以下に!非可逆にしなければ、あんまり変わらないか、全然軽量化しなかったりします。JPGやGIFも非可逆圧縮すれば画質はほとんど劣化せずにかなりの圧縮ができます。これにはかなりお世話になりました。

あと、こんなソフトもあります。

PNGGauntlet

https://pnggauntlet.com/

これはあんまり僕には詳しいことは分からないんですが、なんかファイルに埋め込まれたコメントを削除したり、カラーパレットを最適化することで容量を削減するらしい…。それで、画質には全く影響をあたえないそうです。

圧縮率は前出のものより劣りますが、それでもすでに圧縮済みのものをこのソフトで最適化すると、さらに数十パーセントほど軽量化したりします。とことん絞り込みたい場合は、これもおすすめです。

ただ、書き出しはPNG以外は対応してませんのでご注意を。

そんなわけで、HPは当初はかなり重かったんですが、一通り作業を終えたら、かなり軽くなりました!もし同じような境遇の方がいましたら、画像回りを見直してみてはいかがでしょうか?

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中