基礎編 4/13
| Homepageの仕組み | HTMLで出来ること | 注意すべきこと |
HTMLで出来ること
写真を配置する




写真を配置する

●JPEG画像とGIF画像
写真を掲載できます。コンピュータで写真を扱う場合はインターネットに限らず「ファイルフォーマット」を指定しますが、ホームページに使用できるのは「JPEG」形式か「GIF」形式の2種類です(PNGという比較的新しいフォーマットも出てきましたが、少しやっかいなので説明は省きます)。この2種類の違いは圧縮方法が違う、ということです。
インターネットは主に電話回線を通じてDATAを運んできますので重い(容量の大きい)画像などを使用すると、画面に表示されるまで長い時間がかかってしまいます。そこで出来るだけ早く表示させるために画像を圧縮して軽くし、見ている人をイライラさせないよう注意する必要があります。
「JPEG」も「GIF」も画像を軽くするフォーマットですが、その軽くする方法が違うので、掲載する画像に合わせて使い分けます。大雑把にいうと、写真などたくさんの色があるものはJPEG形式、マークやボタン、色数の少ない線画のイラストなど数種類の色しかない画像はGIF形式を選びます。写真をGIF、またはマークをJPEGで保存すると、かえって重くなることもありますので注意して下さい。


写真はJPEG形式で

マークやボタンはGIF形式で

●プログレッシブとインターレース
JPEGやGIF形式で軽くしているとはいえ、やはり画像は文字に比べ表示に時間がかかります。あまりにも表示されるまでに時間がかかるページは、見に来た人が全て表示される前にあきらめて他のページへ行ってしまう可能性があります。そこで一度にパッと表示されないまでも、徐々に画像を表示させて、見ている人のイライラ感を軽減する方法があります。JPEG形式の場合プログレッシブ処理、GIF形式の場合インターレース処理というのがそれです。
ただし処理を施していない画像に比べ、多少重くなりますし、初めから軽い画像の場合効果が現れる前に全て表示されてしまいます。これらの効果を使わなくてもイライラさせない画像サイズにすることが基本です。
またテーブル(後ほど説明します)で囲まれた中に配置する場合は、これらの効果は現れません。テーブルは中に置かれた全てのDATAを読み込み終わってから、表示を開始する性質があるためです。

●枠を付ける
画像に枠が付けられます。太さは自在ですが色は黒のみです。また画像をリンクボタンにした場合はリンク指定色になります。


3ピクセルの枠

画像にリンクを貼るとリンク色の枠になる

backindexnext