我刚刚在诺基亚的响应式网站开发中阅读了yiibu的幻灯片,其中一个较大的点似乎是首先关注移动,然后是桌面和其他更大更快的平台。 (http://www.slideshare.net/yiibu/pragmatic-responsive-design)不仅仅是在规划阶段,而是从字面上开发您的响应式设计,即没有应用媒体查询的原创样式将是最小平台的设计,具有最低的功能。 (较旧的手机,取决于你的观众)这是我从天生所想做的事情(以及我所看到的,其他人通常做的事情)的后退。
理由是这种方法可以阻止带宽较低的移动设备上的人下载额外的脚本和大图像,只需要下载最小设备所需的脚本和图像,然后加载更多,等等,具体取决于设备的大小和预测能力,最终给最大的设备(笔记本电脑和台式电脑)带来最大负担。 ---这与我一直在做的相反,即为桌面设计,然后添加媒体查询以优化移动设备。
我的问题是,我是否需要首先设计移动设备,然后添加媒体查询以针对具有更多功能的大型设备进行优化,以避免下载不会在移动设备上使用的大型图像的负担?
.....或者我可以在调用专注于更大浏览器/设备的样式表之前使用sepparate样式表并调用移动样式表吗?
答案 0 :(得分:1)
你先打电话给谁的顺序应该不重要。媒体查询本身是一堆 if-else ,基于您放置的标准(设备,方向,宽度等)。因此,通过添加它们的第一个或最后一个并不意味着手机会考虑桌面浏览器的样式表(例如)。
你应该做的是,在所有设备都可读的基础样式表上,使所有设备的基本内容(例如排版,字体大小,元素的背景颜色,文本颜色)保持一致。 / p>
这会使文件的实际读数变小,因为根据屏幕的实际大小,将根据边距,填充和宽度制作特定的样式表。
最后但并非最不重要的是,至于你是否应该首先设计移动体验,这取决于你,你的工作方式和不是。我知道我没有。我先为桌面设计并按照我的方式工作。我更喜欢这个。