公開
2001-08-22

imgのheightとwidthは必須か?

img要素は、HTML文書の或部分に畫像を埋め込む爲の要素です。必須屬性は、畫像のありかを指示するsrc屬性と、代替テキストを示すalt屬性のみです。

屡々「マナー」として、height屬性とwidth屬性を必ず記述しなさい、と言はれます。

「WIDTH」と「HEIGHT」はなくても画像は表示されますが、もし書いておかないと、ブラウザはまず文字のレイアウトを決めてからその後で、画像の入る位置を再び計算することになり結果として表示するのが大変遅くなります

つまり画像を全て読みこんで大きさがわかるまで表示されないのです。でももしサイズが書いてあればその大きさ分を空けておくので、画像が読みこまれてからそこに表示するだけとなるので早くなるのです。

<IMG SRC="...">タグでイメージを表示する際には、WIDTH=n と HEIGHT=n 属性を必ず指定するようにしましょう。これを指定しないと、画像を読み込む度に画面が再描画されてしまうため、体感的な読み込み時間が長くなってしまいます。

これは、少し前まで私も信じてゐましたけれども、「迷信」です。

新しめのブラウザでは、畫像が來ない時點では適當にレイアウトして、後から調整する、と云ふ動作をします。古めのブラウザの爲には、記述しておいた方が良いかも知れませんが。

Another-HTML Lintの石野さんにいろいろと教へていただきました。


HTML 4.0(1)でimgのheight/widthが殘されたのは、「imgのサイズがCSSで指定されてゐるとHTML文書をうまく整形出來なくなる」と云ふNetscape Navigator 4.xのバグを考慮したものと思はれます。(野嵜の私見)

「ISO-HTML」では、思ひ切り良く、imgのheightとwidthは「切り捨て」られてゐます。