Webサイトの制作では、主に、JPEG/GIF/PNGの3種類の画像フォーマットが使われます。いずれも主要なWebブラウザーで表示でき、画質を保ちつつファイルサイズを小さく抑えられる画像形式であることから、利用されるようになりました。3つの画像形式にはそれぞれ特徴があり、用途によって使い分けがされています。
JPEG形式の特徴と扱い方
JPEG形式はフルカラーに対応していて、色数を減らさずにファイル容量を圧縮できるので、写真を扱うのに適しています。
JPEGの圧縮方式は非可逆(一度圧縮したものはもとに戻らない)のため、事前に容量と画質のバランスを見ながら圧縮比を試したうえで作業するとよいでしょう。なお、画像の元素材が印刷物の版下データなどだった場合、Webブラウザーで表示できないCMYKモードになっていることがあります。その場合は、Photoshopなどの画像編集ソフトでRGBモードに変換する必要があります。
GIF形式の特徴と扱い方
GIF形式は、表示する色数を256色以下に減色して圧縮する方式で、データ容量を小さくできます。256色までの任意の色を割り当てられるので、同一色が連続する画像では圧縮率が高くなり、ボタンやナビゲーションなどのページのデザインパーツやイラストなどの表示に適しています。
1つのファイルに複数の画像を持ち、パラパラマンガのように表示するGIFアニメーションという仕様もあり、バナー広告の入稿フォーマットにもよく使われています。
PNG形式の特徴と扱い方
PNG形式は、Web用の画像フォーマットとして開発されたもので、現在ではほとんどのブラウザーがサポートしています。8bit(PNG-8)と24bit(PNG-24)を選択でき、8bitの場合はGIFと同様に256色でのグラフィックス表示に適した保存ができます。24bitでは、フルカラーの写真が保存できるほか、透過色を持たせられます。なお、PNGは可逆圧縮のため、JPEGよりデータ容量が重くなる傾向にあります。
原則的な使い分けは以上ですが、実際のサイト制作やコーディングの際には、全体の構成を考慮しつつ、どのフォーマットをどこに使うか、Webディレクターがルールを決める必要があります。制作を指示するときに迷わないよう、ディレクターはそれぞれのフォーマットの特性や違いをよく理解しておくことが重要です。
著者:クロスコ
クロスコは、映像技術とコミュニケーション支援のサービスドメインを持ち、Webサイト、動画・映像などを組み合わせたクロスメディアプロモー ションを、ワンストップで実現してきました。アナログ停波後のデジタルメディアの多様化、ソーシャルメディアのコミュニケーションにも先立って対応 し、あらゆるタイプのマルチデバイス、マルチスクリーンのコンテンツの制作・開発・サービス提供を行なっています。こうした先進のノウハウにより企業の皆様にこれから必用とされる新しいコミュニケーションの形を、戦略からご提案・提供してまいります。