可点击元素之间的距离太近,内容比屏幕还宽

时间:2019-05-31 04:46:43

标签: javascript php css twitter-bootstrap

我的网站(www.petbutty.com/)在移动设备友好测试中失败,显示内容比屏幕宽,可点击元素之间的距离太近。 请帮我解决这些问题。

1 个答案:

答案 0 :(得分:0)

图像问题是您应提供已调整为不同视口的图像。您可以通过使用不止一个尺寸的每个图像并针对特定视口更改来做到这一点。这样可以为用户保存移动数据。现在,您正在向屏幕上的370-400px宽(非视网膜计数)提供一些超过1900px的图像。

这里是其中的example

您可以使用的名为srcset,您应该阅读该文章(或this)并将其应用,它的简短版本是您使用类似的内容

<img src="image_for_bowsers_that_dont_support_srcset.jp" srcset="dog-360w.jpg 360w, dog-800w.jpg 800w, dog-1200w 1200w" alt="doggy dog">

学习https://www.responsivebreakpoints.com/

时,您可以使用此在线工具来测试并生成图像

也没有在图像中放置文字,主要有两个原因

  • SEO,这意味着Google会将其呈现在页面上并将其读取并编入索引
  • 压缩图像越多,文本看起来就越“笨拙”



我要给您的其他建议是:

还有更多可以解决的问题,但这只是少数几个。