移动优先和响应式设计

Question

我正在阅读有关制作网站的这些新技术。然而，他们所做的一切（至少我发现的那些）都试图在他们相当短的文章中加入很多流行语，但没有人真正展示出很好的例子。

您如何支持响应式调整用户设备的网页？通过响应式设计，您可以使用媒体查询来添加不同的样式表。然而，在许多情况下，移动网页和完整网页之间的内容和标记数量非常不同。那么你如何支持两者？我猜你不使用样式表来隐藏带有display:none 的内容，因为它仍然需要加载整个页面的内容并且它对标记进行了限制。那么，您是使用服务器端技术为人们提供不同的页面还是什么？

Answer 1

取决于你的架构，你有几种方法：

• 如果没有很多多余的内容，确实可以使用 display:none
• 您可以使用 ajax 向服务器请求不同的内容
• 您可以在服务器上使用诸如标头检测之类的东西 - http://www.zytrax.com/tech/web/mobile_ids.html 来弄清楚

一般来说，对于简单的网站，您会使用第一种技术，虽然它可能不是最好的（向移动用户推送额外的内容），但它是最简单的。