低GIFは、スマートフォンの使用が増え、限られた帯域幅のユーザーがほぼ即時の読み込み時間を期待しているため、単純にカムバックしています。あなたのウェブイメージが小さくなればなるほど、あなたのイメージはより速く読み込まれ、訪問者はもっと幸せになれます。さらに、多くのウェブサイトでは広告バナーのサイズに制限があります。
GIF画像とウェブ
GIF画像は、すべての解決策に適合する1つのサイズと見なすことはできません。 GIF画像の最大色は256色です。慎重でないと、深刻な画像や色の劣化が予想されます。多くの点でGIFファイル形式は、ウェブの最初の頃に戻る古い形式です。 GIF形式の導入に先立ち、Web画像は白黒であり、RLE形式で圧縮されていました。 CompuserveがWebイメージングソリューションとしてこのフォーマットをリリースした1987年、彼らは初めてシーンに登場しました。その時、デスクトップ上に色が現れ、電話回線に接続されたモデムによってWebにアクセスしました。これにより、電話回線を介してウェブブラウザに短い順序で配信できるほど画像を小さく保った画像フォーマットが必要になりました。
GIF画像は、ロゴや線画などの限られたカラーパレットを持つ鮮明なグラフィックスに最適です。それらを写真に使用することはできますが、縮小されたカラーパレットは画像にアーティファクトを導入します。それでも、Glitch Artの動きとcinemagraphの登場は、GIF形式への新たな関心を呼び起こしています。
より良いWebサイトのパフォーマンスのためのGIFファイルサイズを減らす方法
これらのヒントは、GIFを可能な限り小さくするのに役立ちます。
-
画像の周りの余分なスペースを切り取ります。ファイルサイズを縮小する最も効果的な方法は、画像のピクセルサイズを小さくすることです。 Photoshopを使用している場合は、Trimコマンドがうまく機能します。
-
GIFイメージを準備するときは、出力のサイズを小さくすることができます。
-
画像の色数を減らしてください。
-
アニメーションGIFの場合は、イメージ内のフレーム数を減らしてください。
-
Photoshop CC 2017を使用する場合は、名前を付けてエクスポートメニュー項目を使用してGIFファイルを作成できます。選択 ファイル > 名前を付けてエクスポート… メニューが開いたら、ファイル形式としてGIFを選択し、イメージの物理的な寸法（幅と高さ）を減らします。
-
Adobe Photoshop Elements 14を使用している場合は、 ファイル > Web用に保存します。 これにより、Web用に保存ダイアログボックスが開きます。このダイアログボックスは、Adobe Photoshop CC 2017、 ファイル > 輸出する > ウェブ用に保存（レガシー）。開いたときに、ディザリングを適用したり、イメージの色や物理的なサイズを小さくすることができます。
-
ディザリングは避けてください。ディザリングを行うと、一部の画像が見栄えが良くなることがありますが、ファイルサイズが大きくなります。ソフトウェアで許可されている場合は、ディザリングのレベルを下げて余分なバイトを節約してください。
-
一部のソフトウェアには、GIFを保存するための「損失の多い」オプションがあります。このオプションを使用すると、ファイルサイズを大幅に削減できますが、画質も低下します。
-
インターレースは使用しないでください。通常、インターレースはファイルサイズを大きくします。
-
PhotoshopとPhotoshop Elementsの両方でダウンロード時間が表示されます。それには注意を払わない。それは56kモデムの使用に基づいています。ポップダウンメニューからケーブルモデムを選択すると、より有効な番号が表示されます。
ヒント
- 役に立たないアニメーションを避けてください。過度のアニメーションだけでなく、あなたのWebページのダウンロード時間を追加しますが、多くのユーザーはそれが気晴らしを見つける。
- ソリッドカラーと水平パターンの大きなブロックを含むGIF画像は、カラーグラデーション、ソフトシャドウ、および垂直パターンを持つ画像よりも圧縮されます。
- GIFのカラーを減らすときは、数字の色が2,4,8,16,32,64,128、または256のうち最小のものに設定されているときに、最良の圧縮率が得られます。
