最適なパフォーマンスを得るために画像のサイズを指定するには、HTML `img` タグ属性または CSS を使用する必要がありますか?-CSSチュートリアル-php.cn

Should I Use HTML `img` Tag Attributes or CSS to Specify Image Dimensions for Optimal Performance?

HTML での画像表示の最適化: 高さと幅の属性を指定しますか?

HTML で画像を表示する場合タグを使用する場合は、その寸法を指定するための最も効率的なアプローチを検討することが重要です。 CSS のみに依存する場合は、内に属性を含めます。

オプション:

<img src="profilepic.jpg" height="64" width="64" />

ログイン後にコピー

<img src="profilepic.jpg" height="64" width="64">

ログイン後にコピー

<img src="profilepic.jpg">

ログイン後にコピー

推奨されるアプローチ:

Google ページ速度によると、 内で高さと幅を直接定義することをお勧めします。タグ。これにより、ブラウザは寸法を即座に判断できるようになり、画像のダウンロード時に不必要なリフローや再描画が防止されます。

検証に関する考慮事項:

<画像>タグはバリデーターによって有効な HTML とみなされません。有効性を維持するには、外部 CSS ファイルを利用するか、