BeFor Web

为网而生 - 关注互联网及移动端产品的用户体验设计

眼下是较为宁静的周日下午(但这篇没打算周日发)，滚石和Led Zeppelin一张一张的放着。别说我老了，10多年前同样是在听这些，特别是在没有多余的精力可以发泄或是没有特别负面的情绪需要抑制的时候。老东西总是最有沉淀感和安全感的，毫无疑问。

正坐在沙发正中间，左右一边一只喵，都盘成个团安静的睡着；从10.1假期把推推从医院接回家开始，每天基本没有晚于6点起床了，加之这一两个月学车的频率也变高了，周末也便是同样的起床时间。搞得这样的下午恍恍惚惚的像是每一个感官都要逐渐睡去的样子了。据说人在将睡未睡的时候，脑波是最利于记忆和创造什么什么的，真真么？倒是记得好多年前以设计博客模板为职业的时候，有几次在睡着之前好像突然看到些特别赞的页面，但接下来要么是没办法让自己醒来，要么是起来试图描画出来的时候又寻它不见了；挺奇妙的。

那么不多说了，和上周的15个响应式前端设计框架同属一个系列，时间较新，用的到的朋友可以看看有无所需。以下文字内容均来自原汇总帖。

你会发现，随着响应式Web设计的不断成熟，各类框架也变得越发健壮和可靠。也许是受到了Bootstrap、Foundation和Gumby的影响，如今很多新的框架都开始向一体化多功能的模式进化，它们提供了更多的功能，同时会包含可复用的组件和模块，例如图标、对话框、页码导航、面包屑、导航栏等等。

当然，不是所有的框架都塞入了大量的功能，有些只是简洁的提供了固定布局的基础。接下来是15个最新的响应式框架。

不年不节不周末的，临时加演一篇资源帖。响应式框架，偏前端的同学可能会有所欲求。

之前念叨过，但凡资源帖，多数是自己眼前用的着的东西，才会趁自己搜罗的机会汇总一下放到这边。话说回来，根本也没做过几篇的样子，印象里有iOS7免费设计资源汇总和iOS设备及界面模板免费资源汇总吧。这次拿来15个响应式前端框架；声明，我自己没用过，做这事起初只是为了我们自己有可能的项目收集有可能的素材和解决方案而已。如果您需要，可以挨个访问过去了解详情，也可以直接从Github获取，我最多算个牵线儿的，不做任何support方面的工作，还请理解了。

不多说了，直接上货吧。

几天的风风雨雨似乎在这个周日的上午逐渐褪去了，现在整个书房几乎要被阳光铺满了。如果阳光能发出声音，想必满屋子都会是轻盈精巧的小旋律了。

又是一篇我自己非常受用的文章，长是长了点，拿来把译文做掉，分享给大家。特别是后面关于市场推广的部分，我很喜欢；即使在环境如此恶劣的这片土地上，仍然希望至少能够通过自己的一点努力为大家的生存环境带来一丝正能量。进入正文叭。

多数应用产品会走向失败。残酷的现实甚至让很多不抱希望的设计师和开发者们开始认为，只有运气足够好，才能在App Store当中获得成功。

这种想法就像用来缓解失败痛苦的麻醉剂，其实蛮危险的。痛苦不是坏事，痛苦才有救，才能让人看到问题所在。如果我(英文原文作者)的应用失败了，我会首先在产品身上找原因，而不是毫无意义的埋怨那些我们控制能力以外的因素。大家所处的环境是相同的，为什么不想想看来自tap tap tap或Tapbots的家伙们为什么就能一再获得成功呢？

本文所归纳出的"移动应用成功准则"，内容涉及产品概念、设计、开发、市场推广这四个方面。必须承认，在现实当中，我们其实很难完美无暇的将这些准则落实到位，但有一点是肯定的：沿着正确的道路向正确的目标努力前行，你能获得成功的几率将增大很多；我们可以依靠的绝不只有运气。另外，虽然本文当中的相关内容及案例都是以iOS为例的，但其中的道理同样适用于其他平台。

这还没眨眼呢，春节假期就只剩下最后一天了，接受不能。整个七天几乎完全宅在家里，做书，做博客，偶尔玩玩现代战争3和Rage；话说后者推出之后被喷的是真够可以的了，但在我心里，John Carmack和id Software的产品依然是最具质感的。赶紧打住，这方面太容易扯远了。我们来看今次的译文。主题关键词：移动应用、货币化、安全性、HTML5、目标定位、个性化。

每一天，世界各地的消费者会使用笔记本、平板电脑、电子阅读器、智能电视和手机等设备下载数以百万计的应用。时下的开发者们大多处于着一种相似的状态：他们清楚在不同的情况下，究竟应该为不同的系统分别打造本地应用，还是开发跨平台性更强的基于HTML5的Web应用；他们也知道通过怎样的渠道去发布自己的产品；而当前最大的挑战，似乎就是怎样保持对不断变化的市场需求的跟进。

面对这样的挑战，让头脑与目光保持一定的前瞻性是很重要的。要想使自己的产品在占有率及收入等方面取得持续性的成功，产品设计与开发的策略必须符合移动应用的未来发展趋势。

在过去的几年中，各地的应用开发者与发布商都看到了一个对科技产品消费市场产生了极大影响作用的行业发展趋势：消费者的自主权与决策权的与日俱增。消费者有权对一款应用发表正面或负面的评价，他们可以通过自己喜欢的渠道获取应用产品。Android用户可以在任何一个他们喜欢的应用发布平台中下载产品或浏览内容，这些平台包括Android市场、移动网络提供商自己的应用商店，或是getjar.com这样的地方；即使苹果设备的用户，也可以在App Store所提供的本地应用与各服务商提供的Web应用之间进行选择。

整个一周都在揪心的猫事中度过。从十月底到现在的这段日子里，倒是越发懂得珍惜每天中片刻的宁静时光。有时会怀疑家里是否有时空漩涡一类的东西，不然钟表怎么会走的那么快，一点儿也不愿停下等等我的样子。一切都会好起来。

独白终了，进入正题。最近两篇译文都有涉及框架和跨平台方面的话题：前一篇中，我们了解了一些用于移动应用开发的前端框架工具；今天这篇的立足点偏向设计开发流程的上游，它将向我们展示怎样使用Foundation框架快速创建跨平台的、可以在多种设备上进行测试的响应式页面原型。下面开始正文部分。

开门见山的说，作为网页设计和开发人员，我们面临着以下几个严峻的问题：

• 每天，人们用来上网的设备种类和数量都在不断上升。
• 为每种设备设计开发不同的界面是不可能的。
• 即使你专门为某些设备定制打造，这些设备也很有可能在不久的将来退出主流舞台。

真心欢乐。别怕，大家一起面对并解决问题。其实，不同类型的设备及屏幕的这个问题，很早以前就开始存在了，只是多年来我们一直忽视这个状况，一厢情愿的守着960像素的网格系统。

继两篇关于响应式Web设计的译文之后，再来搞一篇“网站移动化”方面的。琢磨着自己大概是无论穿着什么鞋都打算趟趟这摊浑水的样子了。

今次篇幅不长，在我看来，本文更像是当老板或产品决策者无论穿着什么鞋都打算趟趟这摊浑水时，作为项目执行者，尤其是用户体验设计团队，所能给到的建议和方法参考。正像前面那篇“步步为营的用户体验设计 - 团队、影响力、协作与策略” 一文中提到的：“其实，‘用户体验设计’并非用来获取答案，它应该为项目执行方式的选择提供建议，或是为更好的设计开发流程创建架构。”OK走着吧。

眼下，移动互联网正扮演着越来越重要的角色，无论开发者还是普通用户，几乎所有人都在谈论它。传统互联网用户所习惯的那些访问内容、使用服务的交互方式正在被智能手机、平板电脑等设备迅猛的改变。作为线上内容及服务的提供者，我们必须尽快进入这个新兴市场，学习新的游戏规则。

愿望是好的，“移动化”的方式却会时常让人找不着北。究竟应该怎么做？开发一款iPhone或Android应用吗？还是为网站专门搞一套或N套适用于不同移动设备的设计方案？最重要的莫过于首先对自己产品的内容及功能进行正确定位，对移动化需求的程度进行合理的评估；在此基础上，尝试最适合自己的移动化方式。目前，有一些比较常见的思路可以供我们参考选择：

十一长假已然过去了一大半。今天倒真是晴朗的不行，向窗外望去几乎可以看到阳光穿过凉爽的空气一缕缕洒落下来的样子。自从不再是学生，对每年的几次长假就无比珍惜，想方设法让每一天都尽量过的饱满一些；夜里闭上眼，满脑子就都是Drupal、博客、咖啡、使命召唤、南方公园...也许需要出门走一走了。

OK开始说正经的了。在之前一篇译文中，我们了解了响应式Web设计的概念、组成要素以及基本的实现思路。今天继续相关话题，我们将从前文介绍过的“弹性布局结构”这方面出发，通过一个具体的实例来深入学习。

如今的屏幕分辨率，小至320px(iPhone)，大到2560px甚至更高(大显示器)，变化范围极大。除了使用传统的台式机，用户会越来越多的通过手机、上网本、iPad一类的平板设备来浏览页面。这种情况下，固定宽度的设计方案将会显得越发不合理。页面需要有更好的适应性，其布局结构要做到根据不同的设备及屏幕分辨率进行响应调整。接下来，我们将了解一下怎样通过HTML5和CSS3 Media Queries(媒介查询)相关技术来实现跨设备跨浏览器的响应式Web设计方案。