Section 14 : 画像 − <IMG> の属性

　現在の WWW の強力な表現力を実現している画像を扱う <IMG> の属性を見てみよう。画像は一般にサイズが大きいので，回線速度の低いところへの転送も考慮する必要がある。ほかにも考えるべきことはあるが，いかに多くの人が快適にアクセスできる HTML を書けるかという問題も，そろそろ意識しよう。
　<IMG> の属性は，画像に関してのさまざまな拡張がなされてきたこともあって，ひじょうに多い。このうち HTML 3.2 の規格で定義されていて，よく用いられるものを紹介しよう。

　上にあげた属性のうち，長さを指定するものについてその表すところを右図に示しておいた。ALIGN="right" であるときを想定している。

　通常，WWW にのせる GIF，JPEG 形式の画像は決まった大きさを持っている。ファイルに収められた画像の大きさと指定された大きさが異なる場合，指定された大きさに合わせて引き伸ばされたり，縮められたりする。ご存じのように，GIF，JPEG は絵を「点の集まり」として表現するため，引き伸ばすと粗く見えてしまう。
　WIDTH，HEIGHT を指定しない場合は画像はファイルに収められた大きさで表示される。だから，そのままの大きさで表示させる場合は指定しないでよいかというと，そうでもない。むしろ，絵の大きさは積極的に指定したほうがよい。なぜなら，画像の大きさが指定してある場合，画像が読めなくてもブラウザは「絵が入る領域」を確保して処理を進めることができる。当然，表示までの総合的な時間は後者のほうが短くてすむ。あなたが読み手だった場合，どちらが快適だろうか。
　また，ALT も必ず入れるようにしたい。先ほどのような状況で，読み手は確保された領域にどんな画像が入るのかを前もって知ることができるからだ。

　画像に <A HREF="...">〜</A> を指定すると，規定値では画像が縁取られる。これがいやな場合は，BORDER=0 を指定する。

出力は，

これは，大きさと BORDER を指定した文章中のイメージです。 左への回り込み（フローティング），左右方向に余白をとってあります。このように，前もって画像の大きさを指定しておくと相手に「やさしい」HTML になります。 BORDER と <A HREF="...">〜</A> の関係は，，， のようになります。

解決！ センター化学 I ◆ Z 会出版