响应式设计不值得搞的5个原因

标签: 响应式 设计 值得 | 发表时间:2012-09-26 22:49 | 作者:
出处:http://news.cnblogs.com/

【编者注】:本文来自 的 Managewp blog 撰文,表达了其对时下风靡的响应式设计不一样的看法。

转向移动设计是比 PC 革命更大的革命——Kevin Lynch, CTO, Adobe

到 2014 年,会有更多的人用移动设备代替 PC 端访问互联网,所以打造易访问的移动端成了 Web 开发者最关注的问题之一。因此响应式设计应运而生,但从我个人的角度看,它并不值得大力追捧,为什么?

响应式设计不是万能的。我自己过去也是一个响应式设计的粉丝,发现很多 Web 应用不能很好的在移动屏幕上显示,Google 地图就是一个很好的例子。包含很多图片的网站也适合响应式设计,但以文本为主的网页和博客就不是了,甚至于我觉得对这种 Web 网站实施响应式设计只是浪费时间。

1. “响应式设计”达不到用户期望

Usability 101 规则的第一条就是“满足用户期望”。以博客为例子,它被广泛接受的设计方式是: 从上往下、内容和图片各放一边、提供边栏,这个已在数百万博客中被应用,因为它达到了用户的期望。

但若你访问经过响应式设计的移动网页,一般边栏会消失,或者会跳到最顶部或者最底部, 反正不是你期望的地方。以 Cats Who Code 为例,下面是桌面显示,有顶部的导航、边栏(包括最近 Post),小广告栏和搜索框。下面是 iPhone 的界面:

可看出导航和边栏消失了,继续往下拖的时候我终于找到了边栏,你可能会觉得这只是个个例, 但事实是这是一个典型的响应式设计,我们想看到的是以不牺牲桌面元素为前提的移动界面显示,显然这不是。

2. 花钱多耗时长

一般来说,响应式设计比非响应式设计要花更多的钱。如果有人 Damn 地争论响应式设计比建立一个额外的移动版面更便宜,我同意,但你知道比响应式设计更便宜的是什么吗?什么都不用!

此外你要想想这花了你多少时间,从响应式设计里面你得到了多少投资回报,获得了什么?

3. 非响应式设计表现也不赖

看我自己的博客在 Mac 上显示效果:

看它在我的 iPhone 上:

在 iPhone4 英寸的屏幕上,读起来感觉很好。如果文字太小了,那就双击放大吧,待会看完了又缩回来并不是什么难事。 而且好笑的是,现在的手机界面就是为了非响应式设计准备的, 且大部分手机表现得很好。如果你非要揪出一些意外的话,去看看那些网页的桌面版,设计也同样很差。

4. 对加载时间没好处

我们知道移动设备操作时是基于互联网子宽带的联网速度,所以网页要确保最少的负荷来减少加载时间,很多响应式设计并未真正减少加载时间,因为许多设计师只是隐藏了那些元素, 对优化加载毫无好处。而非响应式设计可以选择“延迟加载”,这是一个选择先加载最密集元素再到其他的技巧。

5. 响应式设计其实是种妥协

可以说响应式设计是设计师的主观决定,他们认为桌面显示界面不再适用移动界面,然后觉得一定要做出相应改变。而用户如果看到更不适的界面后会发问,为什么要弄个这么不一样又不是很好的显示方式?这触犯了 usability 101 第二条规则“不要让用户觉得他们无法控制局面”。

所以我的观点是:这只是一种妥协,是设计师的主观决定,用户并没有觉得多大的不适,特别是当响应式设计既要钱又要花时间的时候。

最后,我写这篇文章有两个原因,我觉得响应式设计在很多情形下是没必要的;在互联网上明显缺少对响应式设计的争论。我不否定响应式设计理论本身,但事实是我见过的许多情形下它真的没必要。很多人习惯在别人拥护时并认为那是天经地义的事,但你最好从一个开发者的角度来看看,这真的是你需要的吗?

PS: 什么是响应式设计? 页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成,包括弹性网格和布局、图片、CSS media query 的使用等。无论用户使用笔记本还是 iPad,页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等,以适应不同设备。

Via managewp

本文链接

相关 [响应式 设计 值得] 推荐:

响应式设计不值得搞的5个原因

- - 博客园_新闻
【编者注】:本文来自 Tom Ewer 的 Managewp blog 撰文,表达了其对时下风靡的响应式设计不一样的看法. 转向移动设计是比 PC 革命更大的革命——Kevin Lynch, CTO, Adobe. 到 2014 年,会有更多的人用移动设备代替 PC 端访问互联网,所以打造易访问的移动端成了 Web 开发者最关注的问题之一.

响应式网页设计

- - 前端观察
这个话题最近很火爆,我也一直在关注,响应式网页设计和移动互联网密切相关,并因移动终端的丰富和普及而兴盛,并且是一个颇具争议的话题,我今天将和大家探讨下. 上周写了个简单的ppt在组内大概介绍了下,感兴趣的话可以 先看下这个PPT. 在说到这个话题前,我们先看下网页设计和前端开发的现状:. 全球有超过53亿手机用户(包括传统手机).

响应式Web设计

- - 葵中剑's Blog - SwordAir.com
响应式Web设计( Responsive Web Design – RWD)一般是指那些使用CSS3 Media Query特性制作站点,其可以适应不同视窗尺寸的布局. 虽然很早就已经有了类似RWD的概念,但直到最近一年里才开始变得特别流行,各种文章、例子、工具、模板,不断地从无到有,诸如:. 响应式Web设计50个例子和最佳实践.

响应式网页设计

- - IT技术博客大学习
响应式网页设计最初是由 Ethan Marcotte 提出的一个概念:为什么一定要为每个用户群各自打造一套设计和开发方案. Web设计应该做到根据不同设备环境自动响应及调整. 当然响应式Web设计不仅仅是关于屏幕分辨率自适应以及自动缩放的图片等等,它更像是一种对于设计的全新思维模式;我们应当向下兼容、移动优先.

响应式Web设计

- - 阿里巴巴(中国站)用户体验设计部博客
在设计中经常遇到这几个问题:. 1.想要网站兼容手机、平板电脑、pc,就得为不同的设备定制不同的版本. 2.想要网站的某些页面在宽屏显示器下一行显示更多的内容,又得为宽屏定制一个版本. 3.很多人并不是在全屏的情况下浏览我们的页面,如果让页面随着浏览器宽度改变而相应的调整会不会比较好. 有没有办法能有效解决这些问题呢.

漫谈响应式设计

- - 新浪UED
学究一些,首先大家先了解一下响应,然后再讲一下设计,响应就是我发出的请求能得到什么样子的回复,比如我说“你好”,你会很容易的给我回复“你好”,因为大家都是中国人,如果我说“hello”,我们这代人如果上过初中,他也会给我说“Hello”,但是如果我给对你说“Bonjour”,那可能只有高配的人才可能知道了.

淘宝响应式WebUI设计实践

- - Taobao UED Team
感谢贷岩的邀请,我在本期奶茶会上做了“响应式设计实践”的分享,是接着上一次的话题进一步讨论“如何实现”. 响应式Web设计(Responsive Web design)是当下比较流行的话题,什么是响应式设计. 简单讲,页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整.

Screenqueri.es:响应式设计测试工具

- - 我爱水煮鱼
当你创建一个响应式的布局的时候,在绝大部分流行的分辨率的设备上进行测试是非常重要的,这可以让你决定页面上的每块是否现实或者优化它们的显示方式. 今天给大家介绍的 Screenqueri.es 就是一个免费的基于 Web 的响应式设计的测试工具,它能够让你输入一个网址,然后选择移动或者平板设备,然后对你的网站在各个分辨率下进行测试.

非响应式设计的viewport

- - 前端观察
整理自: Viewport Meta Tag For Non-Responsive Design. 中文原文: 非响应式设计的viewport. 请尊重版权,转载请注明来源,多谢~~. 大家已经非常熟悉 响应式网页设计了吧,但是我们通常会忽略很多旧的没有采用响应式设计的网站,其实这类网站在移动终端的用户体验更为关键——因为它们没有对移动设备做任何优化.

响应式设计简易指南

- - Jing
我们想让我们的网站通过响应用户的行为、设备的屏幕大小和屏幕方向,从而在所有设备上都能用. 截止2013年,有成千上万种不同的设备在浏览网页,所以我们不可能设计出适应所有屏幕大小的网页. 相反,我们必须得采用一种更加流畅的方式去设计. 最近一个比较火的词叫移动优先. 它的意思是,先为移动端设计样式,然后再根据需求去优化更大屏幕的样式.