媒体查询如何提高移动用户的网站性能答案

【问题标题】：how do media queries increase site performance for mobile users媒体查询如何提高移动用户的网站性能
【发布时间】：2012-11-02 00:01:10
【问题描述】：

我了解到，使用媒体查询为移动设备更改网站是一件好事，因为它的开销较小，而且手机的下载速度也较慢。但这有什么帮助呢？除了隐藏我不想在移动设备上看到的元素之外，我可以做任何事情吗？它仍然需要下载隐藏的元素。那么有什么收获呢？我很困惑。

【问题讨论】：

【解决方案1】：

响应式/自适应网站设计的整个理念与其说是使您的网页大小或它的资产更小...不如说是让在移动设备上查看您网站的人们可以访问和阅读内容。我永远不会因为有人在移动设备上而说隐藏元素，我会说相应地进行设计和开发，以便内容在移动设备和/或平板电脑设备上更具表现力。

根据您的收益声明；您从设计和开发一个不仅适合桌面用户，还适合移动和平板电脑用户的网站中获得的收益。更多的人不太可能离开，而更容易留下来查看您的内容。

您可以在下面阅读有关响应式网站设计的更多信息：

您还可以阅读以下有关响应式网站设计的好处的更多信息：

快速说明：媒体查询与响应式/自适应网站设计密切相关。

希望这有帮助！

【讨论】：

非常感谢您提供这些链接。到目前为止，我只浏览了它们（但请注意，其中只有一个具有移动响应网站，即使在上面，无论是 iPhone 还是台式机，仍然提供相同的图像）。但我一定会给他们一个彻底的阅读。我同意迎合移动浏览器的需求很重要，因为我经常在手机上看到一个网站并在两个方向上都看到很长的滚动条时感到很沮丧。我只是想确定用户继续制作移动网站是否更简单、更好。它不一定有
decreased functionality，我只是想知道它是否更容易制作，并且可以为手机提供更快的加载时间。再次感谢！

【解决方案2】：

通过媒体查询和 CSS，您不只是“隐藏”内容。根据您的设置方式，您不只是隐藏内容 - 它不会被加载。

您还可以使用媒体查询来选择图像分辨率，具体取决于视口。您可以将低分辨率图像发送到移动设备，并将高分辨率图像发送到 Retina 显示器。

【讨论】：