使用媒体查询构建响应式UI

时间:2012-11-11 21:45:27

标签: html5 css3 responsive-design media-queries

我在某处读过,当你构建一个网站并且也想使用媒体查询来使它成为响应时,一般惯例就是先构建移动界面,然后再为桌面浏览器构建UI。为什么首先要建立桌面用户界面?

1 个答案:

答案 0 :(得分:1)

您已经指出了移动和桌面界面方法中的一个重要问题。

  

我同意但发现您的桌面用户界面也会结束   一些小功能,因为您使用移动浏览器构建了您的网站   心神。我认为你首先构建桌面,然后构建一个移动   删除所有不必要功能的版本??

仅仅因为我使用移动设备并不意味着我不希望您的网络应用程序获得完整体验。事实上,这样做可能会让我完全保释你的网络应用程序。

随着越来越多的人通过移动设备访问网站(智能手机和桌子将属于此类别),您将开始发现某些用户将无法使用任何其他方式访问互联网。如果您可以在智能手机或平板电脑设备上执行所需操作,为什么还要购买笔记本电脑。

相反,您应该考虑渐进式增强功能来处理您的网络应用(或一般网站)。

  1. 向移动用户提供所有网络应用功能
  2. 通过检测设备功能(地理位置,触摸等)来增强功能
  3. 增强设计以适应屏幕视口。
  4. ?????
  5. 利润
  6. 通过向移动界面提供所有功能,您可以确保也可以通过桌面访问它,然后使用媒体查询,您可以确保用户能够最好地显示内容和界面,以便与网站/ webapp进行交互在他们目前使用的视口上。

    首先接近移动设备的一个主要好处是速度。您希望确保它尽可能轻便,因为移动设备通常在比笔记本电脑或台式机更少的带宽上运行。