高さと幅を持たないimgタグを定義する

Question

w3c仕様では、幅と高さが暗示されており、必須ではありません。私はいつもあなたがそれをとにかく入れなければならないと言われてきました。私が正しく覚えていれば、ブラウザが画像のサイズを正しく検出できないという理由がありました。これは本当ですか？

Answer 1

これは、v4以前のバージョンのNetscapeの暗い日に遡ります。レンダリングエンジンは基本的なもので、ページを作成してサイズを計算するときにコンテンツを「リフロー」しませんでした。イメージサイズを指定しなかった場合は、イメージがダウンロードされて高さ/幅のために解析されると、ページ全体のレンダリングが一時停止される（またはフルページのリフレッシュが行われる）。これはユーザーの視点から見れば悪いように見えたので、常にサイズを指定するというルールでした。

今日、エンジンは優れており、不特定の画像サイズを正常に処理できます。リフローするコンテンツはやや高価な操作ですが、画像がポップインしたり、テキストが変化したりすると、ユーザーの視点から見えるようになります。

Answer 2

あなたがそれらを置かないと、ブラウザはデフォルトのサイズを入れて、イメージをダウンロードし、実際のサイズを見つけて、新しいサイズの周りにすべてを再フローさせなければならないからです。

再フローは高価な操作です。画面上のレンダリングは、そのようなイメージごとに更新する必要があります。

サイズを指定すると、ブラウザは正しいサイズのプレースホルダーを挿入し、イメージがダウンロードされると再フローする必要はありません。

Answer 3

私の経験では、幅と高さのタグを指定しないと、ブラウザはイメージを元のサイズでレンダリングします。

私はこの動作が最新のブラウザで一貫していることがわかりました。

私は常に、使用する帯域幅を減らし画質を確保するためにレンダリングしたいサイズで画像を供給しようとします。

Answer 4

ブラウザが正しく検出されないかどうかはわかりませんが、私はそれが起こったことは一度もありません。

しかし、あなたの質問に答えるためには、あなたがしようとしていること、そして可能性が高いことにより答えが異なると思います。

たとえば、追加する画像が所定の高さ/幅に適合する必要があるバナー広告の場合は、必ず高さと幅をハードコードします。

しかし、画像が時間とともに変化する可能性がある場合は、高さと幅をコーディングしないことをお勧めします。これは、古い画像と同じ正確な高さ/幅ではないにしても、今歪むでしょう。これは、画像が常に変化するダイナミックなウェブサイトに特に当てはまります。