响应式网页的优点

  可以自动识别屏幕宽度、并做出相应调整的网页设计被称作“响应式网页设计(Responsive Web Design)”。这种设计目前广受推广,已出现在越来越多的国内网站上,其中Google已经明确表明鼓励响应式网页设计。

  在浏览网页时,很多人会发现这样一个问题:手机上和电脑上无法显示同一个网页,许多网页设计会自动转到特定的链接上。而自适应式的设计使得无论在PC端还是移动端,网页的显示其实都是一个版本,会随着屏幕的大小网页而改变。

  使用自适应网页设计有5个好处:

  1, 随着移动设备越来越多,可以提升用户体验。

  2, 该设计没有网页版本区分,所以SEO的策略保持一致。

  3, 可以避免重复内容,专心维护这一个网页。

  4, 保持网页的原有链接。

  5, Google也建议优先采用响应式设计,因为无论是什么网页版本都是相同的HTML、相同的内容,Google最容易处理。

  响应式网页设计对SEO是友好的,这些相关技术还在不断演化中,还有许多尚待客服的地方。下面来说说它的缺陷:

  1, 对老版本IE支持不好,这是一个致命的问题,尤其是IE6,如果你的网站用户大多还采用老版本的IE的话(建议在统计工具里看一下),就不适合做响应式网页设计了。

  其实我一直想采用响应式网页设计,从新设计卢松松博客的网页,但看到统计里的老版本IE用户依然很多,只好放弃。

  2, 例如一些小游戏站、视频站,如果仅仅是网页采用了响应式设计,但里面的内容依然是只能在PC端打开的话,这时候就要认真考虑了。

  国外copyblogger的博客提到了一个很特别的案例,就是迪士尼公司的网页。他说在迪士尼网页中有许多给小朋友玩的网页游戏,有些游戏可以在桌上型电脑玩,但是如果使用移动设备就可以无法使用。因此这个情况下,就必须做出抉择,放弃使用Responsive Web Design,或是修改游戏。

  写在最后:

  从今年开始,响应式网页设计逐渐流行开来,虽然很热门,但是并没有太多网站采用这类的设计方式。

时间: 2024-09-12 12:45:34

响应式网页的优点的相关文章

响应式网页布局的实现方法原理

交互设计师,要满足各自不通分辨率和设备的页面布局展现方式.而视觉设计师,则要考虑到页面性能和移动端带宽问题,权衡下页面的酷炫效果和视觉色彩的运用.而前端和后台开发工程师,则要完成满足视觉需求和交互功能,更要考虑到页面加载性能和消耗带宽问题,更重要的是移动端安全性能方面!既然响应式网页设计牵涉到了这么多的方方面面,那我们又该如何去实现这种页面呢?对此我也特意收集了一些响应式网页的实现方法原理 首先我们应该遵循移动优先原则,交互和设计应以移动端为主,PC则作为移动端的一个扩展:一个页面需要兼容不同终

FROONT在线可视化响应式网页设计工具

  Froont是一个允许设计师在线设计响应式网页的工具,不需要程序员介入的设计编程工具,为设计师们提供了可视化的在线网页设计环境,绝对是响应式网页设计的利器.如果你还在为用PS画出网站在不同设备上的 demo 图,并和攻城师苦苦兼容各浏览器而懊恼的话,来试试Froont吧! 制作过程中,Froont会根据你的网页将呈现的设备:比如手机.平板.笔记本或者是宽屏电脑,自动调整页面布局,适应各个块之间的相对位置. 嗯,如果你有神马不懂的,可以看首屏那个视频,戳 Watch video 即可,了解后再

bootstrap响应式网页设计的9条基本原则!

bootstrap响应式网页设计是针对多屏幕问题的一个很好的解决方案,但从印刷的视角来看有点困难.没有固定的页面尺寸,没有毫米或英寸,没有任何的物理限制,无从下手. 为了desktop和mobile单独使用像素设计的方法也成为了过去,因为越来越多的设备都可以打开网站.因此,我们需要弄清楚bootstrap响应式网页设计的一些基本原则,接受流体网页,而不是与之相抗.为了让它保持简单,我们将着眼于布局(是的,响应式比它更复杂,如果你想了解更多,这是一个很好的开端.) 响应式 vs 自适应网页设计 它

响应式网页设计:很全的响应式网页设计教程

文章描述:响应式网页设计考虑到多平台.多种屏幕尺寸的情况,能够优化多种设备的网络浏览体验. 响应式设计现在已经成为网页设计师学习的焦点.网页教学网发现群内有很多相关的讨论了,这说明我们平时接触该类案例越来越多.你会渐渐发现,我们身边越来越多的企业和客户关注到响应式网站,作为勤奋的设计师,我们怎么能不对它进行了解呢? 响应式网页设计考虑到多平台.多种屏幕尺寸的情况,能够优化多种设备的网络浏览体验.当你不知道用户使用什么设备,不知道用户的屏幕尺寸时,若想达到较优布局,可以采用响应式设计.在进行响应式

响应式网页设计:rem设置网页字体大小自适应

文章简介:响应式网页不仅仅是响应不同类型的设备,而且需要响应不同的用户需求.响应式的初衷是为了让信息更好的传递交流,让所有人无障碍的获取信息,同时这也是 Web 的初衷. 首先简单科普一下什么是响应式网页.响应式网页是指会根据输出设备的分辨率不同,而自动调整布局的网页.同时,在输出设备分辨率改变时,也能及时自动调整.说穿了,就是三个字:自适应. 响应式网页不仅仅是响应不同类型的设备,而且需要响应不同的用户需求.响应式的初衷是为了让信息更好的传递交流,让所有人无障碍的获取信息,同时这也是 Web

Web体验的设计师:响应式网页设计的陷阱

文章简介:虽然响应式Web设计仍处于发展初期,但已经有很多指导和最佳实践,当你创建可跨设备工作的设计时可以采用.对于那些希望为使用不同设备的用户提供顶尖Web体验的设计师来说,则需要更多的思考与努力. 设计师们无法回避移动设备的大势所趋,当然在网站设计上有大量新的概念来迎合移动设备.但是单独的网站,无法在移动设备层出不穷的大潮中站稳脚跟.无论是在个人电脑.笔记本.智能手机.平板电脑.大屏幕手机.智能电视.上网本以及其它有前景的设备,都需引人入胜的设计. 响应式布局是这种情况下唯一理智的方式. 尽

让你精通响应式网页设计的15条建议(1)

响应式网页设计已经变成新的web标准,许多公司已经接受了这个挑战,并且已经建立起了专门的网页设计方案(比如只针对移动端的开发)或者已经开始试图解决跨平台的响应式网页设计方案.本文会带大家来看看一些实用的建议,以帮助你的设计过程,并使之变得更加高效. 1.计划 与往常一样,计划总是要放在第一优先级的.一旦你在纸上开始解决你的设计难题,你就已经准备好建立你的站点了. 2.充分利用好原型软件 推荐使用Adobe Edge Reflow,它能让你使用媒体查询,在程序内设置断点并设计适配桌面电脑.平板电脑

响应式网页设计和移动互联网

文章简介:响应式网页设计被提出以来,争论就不断,其实核心问题只有两个个:太多的资源请求和有限的终端支持之间的矛盾.响应式的网页设计和移动终端在用户体验和视觉风格上的差异. 个话题最近很火爆,我也一直在关注,响应式网页设计和移动互联网密切相关,并因移动终端的丰富和普及而兴盛,并且是一个颇具争议的话题,我今天将和大家探讨下. 上周写了个简单的ppt在组内大概介绍了下,感兴趣的话可以先看下这个PPT. 移动互联网的现状和未来 在说到这个话题前,我们先看下网页设计和前端开发的现状: 全球有超过53亿手机

响应式网页设计:国外的很赞的响应式网页设计案例

文章简介:来欣赏一些国外的一些很赞的响应式网页设计,看看他们是如何实现对PC端浏览器和移动终端的全面支持的. 上一篇中我们了解了一下响应式网页设计是什么,现在趁热打铁,来欣赏一些国外的一些很赞的响应式网页设计,看看他们是如何实现对PC端浏览器和移动终端的全面支持的. 想要查看效果很简单,打开这些页面,然后缩放浏览器窗口就可以了--当然,要用chrome/safari/firefox/opera等浏览器,IE请绕道-- 当然,如果你有发现国内有好的类似设计 food sense Forefathe