jpgとpngとgif、googleに気に入られる画像・写真と圧縮の方法

インターネットエクスプローラー6(IE6)より新しいブラウザならpngで問題なし!

pngファイルの良いところは、塗りつぶしがとてもきれいな上、素晴らしい圧縮でファイルサイズを軽くしてくれることです。

一昔前はGIFファイルにすることが多かったWEBの世界ですが、最近はもうGIFファイルよりも綺麗な色彩で保存されます。GIFについてはライセンスの問題などが囁かれて一時使われなくなっていましたが、その後も特に問題なく使われていますね!

pngおよびgifの利点をあげるとすると、やはり「圧倒的なファイルの軽さ」「透過処理ができる」点かと思います。

背景が設定されているサイトでも、描写したもの以外の場所にその背景を残したままに映せます。

手間や汎用性を考えるとpngだが、写真はやっぱりjpgかな?

私が画像の処理に使用しているソフトウエアを紹介します。

難しいphotoshopはいらないけど、あると便利なElementsシリーズ

Adobe Photoshop Elements は、プロが使うフォトショップを扱いやすくしたものです。

機能を制限しているという話を聞きますが、紙に印刷する用途の機能を制限しているだけで、WEB向けの機能はむしろ強化されている印象です。

10000円程度なのであって損は無いでしょう。

シンプルイズベストのソフト「ペイント」

いろいろなファイルに対応しています。このシンプルさが使いやすいですね!

jpgを読み込んで、pngやgifに圧縮する時も使えます!

jpgの圧縮ならフリーソフトの「caesium」

caesiumはフリーの画像コンプレッサーソフトです。

インストールしたら下にあるような画面が出るので、圧縮したい画像ファイルをドラッグして入れていき、品質を決定、出力先を設定して「圧縮開始!」を押すだけです。

見事に圧縮してくれます。もちろん画像を圧縮するということは粗くなりますが、最近のgoogle等の傾向として、モバイル向けの軽いサイトが求められています。

caesium

↑からダウンロードサイトにいけます。

JPEG 圧縮

最大20個までJPGまたはJPEGファイルを選択して、ドロップエリアにドラッグするとアップロード後、自動的に圧縮が始まります。

オンラインなのでソフトウエアのインストールなどが不必要でお手軽です。性能はまずまずです!

http://compressjpeg.com/ja/

画像を最適化することはユーザー思いの第一歩!

画像はページをロードするときに最も重い材料です。

文字と比較すると何十倍も大きいので、ちょっと画質下がりすぎたかな?と思うくらいのサイズで十分です。

ただし、ブランディングを意識するならば汚くてもいいところと、綺麗じゃないと困るところを分けていく必要があります。

私の場合は、綺麗な画像にしたいところはpngで、どうでもいいところはjpgをcaesiumで品質30くらいまで圧縮しています。

みなさんもお試しください!

おすすめの記事