滋賀県のホームページ制作 有限会社エクルス

滋賀県のホームページ 企画 制作会社です。Webサイトのサポートならお任せ下さい。

http://www.ecrus.co.jp

トップページホームページ講座 > 画像処理について

画像処理について

ホームページへの訪問者は、そのホームページの設置場所にあるデータを電話回線や専用回線を利用して自分のパソコンに読み込んでブラウザなどに表示しています。近年、ブロードバンドの普及により通信速度は、大変高速になり大容量データの送受信もストレスなくできるようになりました。しかし、すべてのユーザが同じ環境になったわけではありません。いまでも低速なダイヤルアップ接続のユーザーも沢山おられます。通信には接続料金が必要なのはご承知の通りです。データ容量は通信速度によって受信時間にそのまま影響します。できるだけ早く画面上にすべての内容が表示された方がいいのは当然のことです。

「それじゃ、思いっきり小さなデータにすればいいでしょ!」

と、言われそうですがそんなに簡単なものじゃありません。特に問題になるのが容量が大きくなる画像データです。ホームページの発信者にしてみれば、できるだけ綺麗な画像を見せたいと思うのはあたりまえのことです。という訳で、両者の妥協点を模索する方法を紹介しましょう。

この章では、ホームページに画像を表示する場合の画像処理について説明します。現在、ブラウザ画面上で表示可能な画像形式は「GIF」と「JPEG」の2種類が中心です。コンピュータで利用可能な画像は形式によって色々な特徴を持っています。この「GIF」と「JPEG」形式の画像は、データ容量を圧縮して小さくできる特徴があります。

各形式の持つ独自の特徴を表にしました。

  GIF JPEG
読み方 「ジフ」または「ギフ」 ジェイペグ
拡張子 gif jpg
圧縮方法 減色(最高256色) 色の情報を圧縮
圧縮単位 色数 パーセント
アニメーション アニメーションGIF(動画GIF)
指定色透過 透過GIF
段階表示 インターレースGIF プログレッシブJPEG
■素材による圧縮率の違い

どちらの形式も素材の持つ特徴によって、得意・不得意があります。次のサンプルを参考にして下さい。

【写真の場合】

元データは、ビットマップ(BMP)で123k

写真GIF形式サンプル

 

GIF圧縮(256色) データ容量 33.4k

写真JPEG形式サンプル

 

JPEG圧縮(80%) データ容量 18k

写真などの色数が多く複雑な画像を処理する場合は「JPEG」圧縮の方が有利です。

【イラストの場合】

元データは、ビットマップ(BMP)で88.6k

イラストGIF形式サンプル

GIF圧縮(16色) データ容量 6.9k

イラストJPEG形式サンプル

JPEG圧縮(80%) データ容量 14k

イラストなど色変化が少ない画像を処理する場合は「GIF」圧縮の方が有利です。

■画像サイズ(縦横のサイズ)

画像の縦横サイズもデータ容量にそのまま影響します。決められたサイズがあるわけではないので伝えたい内容が画面上で把握できる程度のサイズを自分で見つけ出します。私的には、1つの画像容量が大きくても20k程度(最大30k)になるようにしています。

■画像の処理方法

画像形式を変更したり圧縮する場合、画像処理ソフトが必要になります。最近のホームページ作成ソフトには、独自の画像処理ソフトが付いているものが多いようです。ホームページ作成での画像処理だけを考えるならば高価なものは必要ありません。