设置图像尺寸的最佳做法是什么？CSS或属性？

Question

我读过很多书，您应该将CSS样式与内容分开，并且使用内联样式不是最佳做法，但这与<img>标记的大小相同吗？

是使用属性设置宽度和高度的最佳实践，还是最好将其放入CSS类中？

<img src="myimg.png" height="100" width="200" />

要么

.myimg{
    height:100px;
    width:200px;
}

<img src="myimg.png" class="myimg" />

还是没有“最佳”实践？如果是这样，在哪种情况下应该使用1或2？

Answer 1

我认为最好的做法之一是尽可能避免内联样式，并尽量通过 CSS 来做大多数属性。

但是，当您尝试验证 HTML 时，如果<img标签没有指定高度和宽度，它通常会失败，因此我会尽可能将这些包含在标记中。这对 SEO 也是一个好处，因为它们可以被正确识别以进行图像搜索。

另一个重要的 SEO 因素是尽量避免链接到全尺寸图像，然后使用 CSS 缩小它们。如果您有一个 3000x2000 的图像并且输出仅为 320x250，那么您确实应该创建一个 320x250 版本的图像，上传它，然后链接到该图像。这将极大地帮助您的网站的加载时间和性能。