n2p blog

キャンペーンやSNSの
"ためになる"情報を
執筆しています。

GIF形式の画像は、色数の少ないイラストに向いています

  • 256色まで扱える
  • 透明色を扱える
  • アニメーションできる

そんな特徴を持つGIF画像について、より詳しい解説をしてみます。

色数を減らして軽い画像に。最大256色まで利用可能。

GIF画像は、色数を減らして画像の容量を圧縮しています。
フルカラーの画像をGIF画像にする時は、減色された分、画像が劣化します。
劣化した部分は取り戻せないので、ご利用は計画的に。
必ず元画像を別途保存した状態で作業しましょう。

実際に色数を減らして比べてみましょう!


弊社のTシャツ事業で活躍の看板少女、ちふゆちゃん。フルカラーです。
この画像の容量は305KBです。

色数を減らしてみました

256
256色にしてみました。
画像の容量は95KB。約3分の1の容量になりました。
でも、グラデーションの部分に縞ができているのが見えますでしょうか?
128
128色にもできます。
画像の容量は73KBです。
お肌が荒れてしまう……。
2
そして2色にもできます!
画像の容量は13KBでした。
このような性質から、色数の少ないイラストを保存するのに向いています。
たとえばこんな画像ですね。
Z_cat7にゃ~
013459ぞうさん。

透明色を扱える

GIF画像、指定した一色を「透明色」として扱えます。
2-02
これは透明色を扱っている、透過画像です。
わかりやすいよう、
背景に市松模様をを敷き詰めた場所に、
背景スケスケちふゆちゃんを置いてみました。
この通り、透過されていますね!

2-02

アニメーションできる

GIF画像はアニメーション出来ます。
動画でやる程でもないがちょっと動かしたい!という時、便利に代用できます。
バナー広告や簡易アニメーションに使えます。
例えばこのサイト、ぴこぴこ動いている部分はGIFアニメです。
「邪悪なハンコ屋 しにものぐるい」
http://www.ito51.com/

PNG形式より軽いことが多いです

GIFと似たような用途で使われるのが、PNG形式です。
比べると、GIF形式にはこんなメリットがあります。

  • 同じ色数であれば、PNG形式より軽いことが多い
  • IE8以前やフィーチャーフォン(ガラケー)でも快適に扱える

まとめ。色数の少ないイラストを、昔の環境でも快適に!

GIF画像は、こんなシーンで使いましょう!

  • 256色以下のイラストを扱いたい時
  • IE8以前で透過色を扱いたい時
  • フィーチャーフォン(ガラケー)で画像を扱いたい時

この記事を書いた人

nonameproduce(n2p)

nonameproduce(n2p)公式アカウントです。Web、SNSを軸にしたデジタルプロモーションの制作会社です。17年間、500以上のデジタルプロモーションを手がけた知見を活かし、デジタルとクリエイティブで「伝わる」を作ることで、ユーザーに価値ある情報と体験を提供します。

  • Aha! レシートキャンペーン
  • BirdCallカスタムストーリークイズ診断
  • BirdCallカスタムストーリー