A

　B

GIF　256色　ファイル容量18kb

GIF　64色　ファイル容量11kb

JPEG　80％圧縮　ファイル容量6kb

JPEG　60％圧縮　ファイル容量4.5kb

GIF　32色　ファイル容量2.8kb

JPEG　80％圧縮　ファイル容量3.4kb

　１、画像がデカくないですか？

　画像がデカイとは、単に見た目の大きさだけでは有りません。まず最初に基本と考えた「ページが軽い」について考えて見たいと思います。

　ページが軽いと言うことは、それだけ見る人をお待たせしないということです。インターネットでページが早く表示されるためには、色々な要因（回線の太さや混み具合など）がありますが、ここではホームページ作りという観点で進めます。

　まず、ページが重くなる要因を考えてみましょう。

１、文字（ブラウザーに表示されないタグなども）の量が多い
２、画像が多い（大きい）
３、音・ムービーなど（←これは別の機会に）

が主なものでしょう。

　文字そのものは画像に比べれば大した事はないのですが、それでもテーブルを多用したりすると処理が重くなりますので注意が必要です。
　また、画像とは単に写真だけではなくタイトル文字や飾りのアイコン、ボタン類、バックに敷く背景画像や GIF アニメなどもそうです。
　特に GIF アニメは画像の表示サイズの割にデーターが重いので気を付けましょう。

　これらから考えるとホームページは見栄えのするデザイン性などを重視すればするほとデーター量が増える傾向にあります。ページを飾りたい気持ちはよ〜く分かりますが、程々に。

画像貼り付けの注意点

　左上のおいしそうなサクランボの写真ですがＡとＢ、いったいどこが違うのでしょう？

　実は、Ａの画像ファイル容量は 24Kb、Ｂの画像ファイル容量は 61Kb あります。
　この違いは圧縮以前の問題でＢは大きな画像を HTML のページに貼り付ける段階で縮小しているんです。（単に表示を小さくしているだけでデーター量は変わりません）
　試しにＡ・Ｂの画像をマウスでドラッグまたは、ディスクに一旦保存して改めて画像ファイルのみをブラウザーで開いて見て下さい。Ｂの画像は大きいことが分かると思います。
　これでは不必要に大きいデーターを読み込まなくてはいけないので表示に余計な時間がかかります。

　デジカメで撮影した大きな写真をそのまま貼り付けている、これ結構見かけるんですよ！

　HTML エディタや HTML が書き出せるワープロソフトなどで、レイアウトを考えるために拡大したり縮小するのはいいのですが、写真の大きさが決まったら実寸で貼り込むように画像ファイルを作り直しましょう。
　基本的にはブラウザーで表示させたい大きさのピクセル数に、画像ファイルのピクセル数が同じになるように画像ソフトなどで縮小すればOKです。

●このページのように１ページ（１ファイル）に余り入れすぎない。（笑）
●写真がたくさん入る場合には小さい写真（サムネール）を使い、大きい写真は別ページで作りリンクする。（２ファイル作る）
●画像は許容範囲まで圧縮（または減色）する。