移动平台设计优先：爱恨交加

过去，对于网页项目，大部分网页设计者和他们的客户都先从桌面版入手，把移动版放在第二步实现。即使在响应式设计兴起之后，我们中的很多人仍然会从“全尺寸”的网站设计开始，然后再进行裁减。

不过目前在该行业中，将整个工作流程完全颠倒过来的趋势渐长，即先考虑移动版本，然后再将其扩展为一个更大的桌面版本。为什么你将会使用这种方式来处理项目？这种策略的利弊又如何？请继续读下去！

与Heart Inter VPS共同呈现这篇文章，它是我们关于“展望桌面设计”系列的一部分。

移动网页设计并非小众

如果你仍然认为移动网页设计和应用开发是小众市场，那么你需要改变一下你的思路了，移动并不是趋势，即使将来也不是，它就是当下。不相信？这里有一些自来Mobithinking的上个月的统计数据，有点惊人哦！

在美国，25%的移动网页用户只使用移动设备上网(他们很少使用桌面设备上网)

移动设备销售全线增长，并且新的手机中，超过85%以上具备上网功能

其中最强有力的事实就是以上的第二条，它足以说明很多用户很可能只会访问网站的移动版本。这是个很惊人的发现，不是吗？

相较以往，网页更像是我们随身携带的物品，而不只是出现在我们的桌边或者家里。这是一种全球趋势，在未来的数年间，这种现象会持续增长。你准备好了吗？你的专业技能集合中包含了所有重要平台上的网页开发了吗？还是只是停留在桌面领域？

为什么移动平台优先？

奇怪的是，到现在为止，还没有人从中学到新的东西。那些你所熟知的200多块美元的手机已经明明白白的告诉你，网页已经突破了电脑机箱的桎梏。

，移动网页访问虽然很流行，但这并不是说服我采用移动平台设计优先策略的原因。要知道25%的只通过移动设备访问网页的用户的反面是，还有75%的人并不是这样的！很显然，桌面访问仍然是一个很重要的渠道，还没到把它忘记或是搁置一旁的时候。所以为什么我们仍然要考虑移动平台设计优先的思路呢？

2010年，埃里克·施密特宣布谷歌从彼时开始将采用这一策略，它是网页设计移动平台优先兴起的主要原因之一。他甚至说“我认为，目前，我们全体的合作项目，使得移动平台能解决几乎所有的问题。”为什么设计思路会发生如此剧烈的变化？

优雅降级还是渐进增强

这两个词是几年前的流行词语，它们现在仍然能够帮助我们洞察网页设计移动平台优先的想法，并帮助我们了解其成为一个重要概念的原因。

曾经有一种需求，希望在尽可能多的浏览器和平台上支持一种设计功能，由此引出了“优雅降级”。设计者和开发者希望能够利用新技术，又不能把那些没有安装新技术的用户排除在外。总的想法是创建并提供尽可能佳的服务，要考虑到每种可能的降级，不管它有什么缺陷，网站都要确保正常工作。

对于移动平台网页设计，这就意味着，需要对一个完整的，标准的网页进行缩减，并逐步去掉内容和功能，因为视窗变得越来越小，系统变得越来越简单(比如不支持Flash，等等)

由此趋势又引发了一个强有力的新概念渐进增强。在这个版本的故事中，你在移动平台上使出浑身解数，占有最小的屏幕面积，占用最少的处理能力以及使用最少的第三方插件，为用户提供视觉与功能的完美体验。当有需求出现时，再逐渐“增强”网页。对于较大的平台，甚至可以无需顾忌诸多限制，彻底重新考虑。

为什么渐进增强胜出了？

乍一看，这两种方法都差不多。只要完成了，谁会在意你是从哪儿开始设计的呢？对吗？

不过，实际情况却有点复杂。当你从桌面平台开始设计时，通常会倾向于利用该平台所能提供的所有功能。你利用了很多很棒的技术，做出了很炫的产品，只是突然意识到，没有一个能用到移动平台上的。这会严重削弱移动产品，就感觉像是一个事后才想起来的东西，而不是一个经过雕琢并完成的产品。每个项目都会发生这种情况吗？也许不都是，通常这种情况比你想象的更加普遍。

如果我们审视一下渐进增强的工作流程，就会发现它会导向另一个结局。这里让我们从一个既非常简洁又令人印象深刻的项目说起。尽管面临诸多限制，你还是投入了全部的启动能量，并创造出一个外观和功能都很不错的产品。

更重要的是，你已经闯过了将内容削减至最重要元素的难关。等到需要把此设计移植到桌面平台的时候，你不再需要考虑要裁减掉哪些，怎么削减产品功能，你只需决定怎么使它变得更加健壮！

网页内容有选择的提供是最佳方案

以上的论据纯粹是从哲学的角度出发，来得出最终的结论——即如果你使用移动平台设计优先的方法，那最终会有一个更好的结局。如果你想要一些更显著的实质性的论据，只需看看你是如何提供网页内容的。

如果我们持优雅降级的观点，会基于用户使用的是最大化的平台这个假定，从而将所有的内容(包括文本，图片，视频，语音，等等)推送给用户，由此，移动版本的功能就是简单的忽略或者是删除页面上的诸多内容。问题来了，不管给定的平台需不需要，所有的内容都已经加载了。这些内容往往都多于给定平台所必须的内容，而通常随之而来的是超慢的网络下载速度。瞧，看出问题所在了吗？

如果持移动平台优先的观点，那么在那些较小的平台上，我们一开始只会加载绝对必须的内容。这样可以避免不必要的延时，体验到更快的速度。而附加的资源则严格按照按需的原则进行加载，即只加载那些目标平台能够很好的进行处理的资源。

响应式设计怎么样？

那“渐进增强”又如何与网页设计的另一主流趋势“响应式设计”保持一致？好消息是这两种策略并不是互相竞争的关系。事实上，你可以认为他俩是互补的。

响应式设计的理念是，基于设备类型和视窗大小来进行媒体查询。牢记这一点，你就可以从移动平台的角度来进行初始CSS的编码，然后随着设备视窗的增大，再使用媒体查询有选择的提供附加的样式。

典型的响应式设计是从大视窗开始，然后再逐步裁减。而以上的方法看起来刚好相反。不过基于上述观点，很显然，从小至大构建媒体查询的背后仍存在很多逻辑。

肥大正在走下坡路