【编者按】本文作者BradFrost,纽约数字互动广告公司R/GA的移动web战略家和设计师、前端开发工程师。作者主要对响应式网站和单独的移动网站进行了简单的比较,并总结了建设响应式网站的一些预算考虑!
首先,我想以一个真实的事例开始今天的主题。曾经有一个网站项目,在建设初期并没有把移动设备考虑在内,但是在随后的设计过程中,大约有80%的客户会问这样一个疑问:网站在iPad上面的显示效果会是怎样?面对整个问题,整个开发团队开始慌了手脚,于是整个项目的时间表需要重新制定,预算也跟着增加,而且最终做出来的效果也不尽如人意。
这个故事的寓意就是说,从项目一开始就要将各式各样的移动设备考虑在内,而且要意识到未来的不可预测性并且具有前瞻性,因为老一套的东西总是要被淘汰的,新事物总会不断涌现。
那么是选择设计响应式网站还是打造专门的移动网站?
其实这个话题几乎已经盖棺定论了,随着3G的普及,越来越多的人使用手机上网。移动设备正超过桌面设备,成为访问互联网的最常见终端,响应式网站设计已经成为大势所趋。但我还是想对两者进行简单的比较,建设响应式网站是不是比移动网站成本要来得低?起初,建设移动网站和响应式网站花费的成本可能差不多,但是因为移动网站存在N多不同的版本,后续的数据更新和设备维护需要大量的费用投入,而响应式网站则不存在这样的问题。另外,像GalaxyNote这样的板或者是大屏幕的手机仍然处于灰色地带,它们到底是显示移动版本的页面还是显示桌面版本的页面
,真的是让用户左右为难。
建设响应式网站需要考虑的预算因素
相比单独的移动网站,虽然响应式网站后续的维护成本会比较低,但这并不代表响应式设计就是完美无缺的。而且涉及到预算问题,每一分钱都很重要,所以作好有效的预算也是很有必要的,下面是建设响应式网站需要需要考虑的一些因素:
1.与时俱进,掌握最新动态
让每个人都掌握业内的最新动态,确保团队里的每一个人都了解响应式设计是什么。如果不了解当下的最新情况,花点时间去了解,看看当下的趋势是什么,然后一起讨论如何去开展工作。
2.足够的时间来应对突来起来的变化
这很可能是财政预算需要考虑的最重要因素。很多开发人员一定很熟悉典型的“瀑布模式”的开发过程,“瀑布模式”只按照标准的桌面浏览器进行设计,除此之外,几乎没有考虑任何其它的设计开发环境,随着问题的不断积累,不得不放慢脚步,来应付各种棘手的问题。这是它最大的缺点。跨平台同步进行的响应式设计的出现让那些呆板的线性过程在多屏幕时代显得一无是处。
当然,因为响应式设计是跨平台同步进行,相对“瀑布模式”的开发过程而言,密切合作对于一个成功的响应式设计项目来说是绝对必要的。而在整个开发过程中,要给团队足够的时间来分类整理那些不可避免的、棘手的设计问题。
3.更多的测试和QA时间
只按照标准的桌面浏览器进行网页设计的的时代已经一去不复返,随着工作量的加大,测试和QA时间也相应增加,所以在作预算的时候,时间问题也是需要考虑的因素。另外,整个网页将会支持哪些设备、将针对那些设备进行优化也是需要事先考虑好,因为“支持”和“优化”两者之间还是有区别的。如果要针对每种设备进行优化,这是不可行的。鉴于预算有限,包容性并且前瞻性的解决方案就显得尤为重要了。
4.购买测试设备
在设备上进行实际操作和测试是非常有必要的,这就意味着在测试设备方面又要投入一笔预算。
5.了解渠道策略
有许多项目规划者在进行响应式网站设计的时候喜欢将整个项目细分,先是开发桌面版,再接着是手机版,最后是平板电脑版,其实这已经脱离响应式设计的本质。真正的响应式设计从一开始就考虑到这些跨平台问题,从而进行更详细的前期框架构图,设计和测试。
ViaBradfrostweb
(Danice供雷锋网专稿,转载请注明!)
分享到:
相关推荐
本资源演示了如何使用媒体查询的方式开发移动设备优先的响应式布局网页。
Web网页设计制作-毕业设计期末大作业源码课程设计 Web网页设计制作-毕业设计期末大作业源码课程设计 Web网页设计制作-毕业设计期末大作业源码课程设计 Web网页设计制作-毕业设计期末大作业源码课程设计 Web网页设计...
700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款html5网页响应式模板700款...
随着PC端、平板、智能手机等终端的发展,设备环境(系统平台、屏幕尺寸、屏幕分辨率等)更加复杂,网页展示需要考虑到各个终端的具体差异。...本资料包含四个免费的响应式网页模板,希望对大家有帮助。
响应式网页设计:Bootstrap开发速成的配套资源,提供120多个Bootstrap功能范例网页文件,说明如何使用Bootstrap框架所提供的各种CSS与组件等内容,最终以3个完整实例(书籍宣传网页、产品推广网页、网站首页)制作出...
基本上都是本网页设计的所有知识点,很全面,基本上有所有响应式的知识在里面
网页设计资料
HTML5响应式网页设计.docx
html响应式网页设计代码范文-UI设计响应式网页设计与栅格化.pdf
响应式网页设计师个人主页单页网站html模板
《响应式网页开发实战》教学教案—第1章 响应式网页概述.pdf《响应式网页开发实战》教学教案—第1章 响应式网页概述.pdf《响应式网页开发实战》教学教案—第1章 响应式网页概述.pdf《响应式网页开发实战》教学教案—...
html5响应式设计师分享平台网页模板源码
【Web网页设计制作-毕业设计期末大作业源码】(FZY014)倾情奉献绿色响应式手机网站模板
网页设计资料
星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip星巴克响应式网页项目源码.zip...
响应式网页设计的经典书籍,英文原版,蓝皮书,pdf+epub格式
响应式网页模板及html5微网站模板,其中收集了部分微网站模板,供180套(百度云)
网页中的图形设计是在线内容用户体验的关键,尤其是现在的用户会使用多种设备访问网页,如智能手机、平板电脑、笔记本电脑、桌面电脑,甚至是智能电视。《响应式Web图形设计》以创建响应式Web的角度,介绍了基础的...
本书应用 HTML5 和 CSS3 提供的最新最有用的技术,扩展了响应式网页设计的方法论, 以便网站更简洁、更易于维护。本书还讲解了编写和发布代码、图片、文件的最佳实践。 只要你懂 HTML 和 CSS,你就能制作响应式网站
基于bootstrap框架,实现网页的响应式开发;banner轮播,tab选项卡切换