Google表示,最好将img的宽度和高度放在html中:“即使在下载图像之前,Web浏览器也可以开始呈现页面”

See Here

<img src="some-address.jpg" width="20px" height="20px">


但是,如果img在响应页面中怎么办?
我没有给出任何值,并且img可以很好地适应任何大小。但是,然后Google针对结构化数据的测试工具给出了一个错误:“ width字段的值是必需的”
https://search.google.com/structured-data/testing-tool

我试着给那个值:

<img src="http://www.w3.org/html/logo/downloads/HTML5_Badge.svg"
width="100%" height="auto">


这是示例:JSFiddle

它反应灵敏,具有价值。错误消失了。但是我已经读到Google需要数字值。

如何在响应页面中放置img的宽度和高度?
我想总是建议使用结构化数据。因此,我必须考虑Google测试工具所说的内容。我对吗?

最佳答案

最好通过css样式表来完成此操作,因为通常将图像的宽度和高度标签视为不良做法。



.imageclass{
  width: 100%;
  max-width: 150px; /* whatever size is the biggest that you want */
  height:auto;
}

<img src="http://www.w3.org/html/logo/downloads/HTML5_Badge.svg" class="imageclass" />

09-30 13:27
查看更多