《移动优先与响应式Web设计》一1.1 变了什么?

简介:

本节书摘来异步社区《移动优先与响应式Web设计》一书中的第1章,第1.1节,作者: 【美】Luke Wroblewski , Ethan Marcotte 译者: 司徒卓恆 责编: 赵轩,更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.1 变了什么?

移动优先与响应式Web设计
要解释移动平台为何突然爆发,我们就要回到2006年,上一堂美国历史课。若你想象不到当年是怎样的情境,就让我跟你重新介绍一下摩托罗拉的Z3—当年大热当红的RAZR的后继者(见图1.2)。

2006年,Z3在美国是一台高端的移动电话。功能包括短信、电邮、实时通信、200万像素镜头、音乐播放器、全彩屏幕和WAP 2.0/XHTML网页浏览器;能联机至AT&T的EDGE高速数据网络。用来上网,体验完全是—糟透了。


2

到底有多糟?由开启浏览器到完全加载网页(页面只有几个纯文本链接),需耗时两分钟。而现在网页刷新速度都以毫秒作度量单位,可以想象等待两分钟有多么痛苦。但令人痛苦的还不只是速度,还要连击手机键盘来选字,绝不轻松,就算使用T9等智能输入法也没有太大帮助。

但在不到一年的时间里,发生了一件事,从此改变了一切。2007年6月29日,史蒂夫·乔布斯召开发布会介绍首代iPhone。不论是果粉与否,都很难否认iPhone对移动网络的影响。当年只有这台手机能够流畅上网。看看AT&T 2006年至2009年的移动数据流量,就会清楚它有多受欢迎(见图1.3,当年,AT&T是iPhone的独家服务供货商)。


3

那个时期,AT&T的移动数据流量增长了4932%—难怪服务一直都不太稳定!用移动设备来浏览网页,是好是坏,颇为明显。

事实上,在2009年时,一台iPhone所用的数据相当于30台基本功能手机所使用的数据—难怪iPhone的数据月费计划是定额收费的。

移动平台的增长,不只是因为质量提升,也是因为价格的下调。现在就算负担不起计算机,也可以买便宜的移动设备,配以便宜的月费计划来上网。

网速更快,覆盖更广,使移动平台的发展如虎添翼。单在2010年,移动网速就提升了一倍。随着网速的增长,智能手机的数据流量也增长了1倍。这种趋势不会就此停下来。2010年至2015年,全球移动据流量将会增长26倍!

机会正蜂拥而至。

相关文章
|
移动开发 开发者 HTML5
构建响应式Web界面:Flexbox与Grid的实战应用
【10月更文挑战第22天】随着互联网的普及,用户对Web界面的要求越来越高,不仅需要美观,还要具备良好的响应性和兼容性。为了满足这些需求,Web开发者需要掌握一些高级的布局技术。Flexbox和Grid是现代Web布局的两大法宝,它们分别由CSS3和HTML5引入,能够帮助开发者构建出更加灵活和易于维护的响应式Web界面。本文将深入探讨Flexbox和Grid的实战应用,并通过具体实例来展示它们在构建响应式Web界面中的强大能力。
186 3
|
缓存 前端开发 JavaScript
前端技术探索:构建高效、响应式Web应用的秘诀
前端技术探索:构建高效、响应式Web应用的秘诀
285 0
|
前端开发 开发者 容器
构建响应式Web界面:Flexbox与Grid布局的深度解析
【10月更文挑战第11天】本文深入解析了CSS3中的Flexbox和Grid布局,探讨了它们的特点、应用场景及使用方法。Flexbox适用于一维布局,如导航栏;Grid布局则适用于二维布局,如复杂网格。通过示例代码和核心属性介绍,帮助开发者灵活构建响应式Web界面。
303 5
|
JavaScript 前端开发 网络架构
如何使用Vue.js构建响应式Web应用
【10月更文挑战第9天】如何使用Vue.js构建响应式Web应用
|
JavaScript 前端开发
如何使用Vue.js构建响应式Web应用程序
【10月更文挑战第9天】如何使用Vue.js构建响应式Web应用程序
|
前端开发 JavaScript 测试技术
构建响应式Web应用程序:React实战指南
【10月更文挑战第9天】构建响应式Web应用程序:React实战指南
|
前端开发 开发者 容器
【布局革命!】Flexbox与Grid双剑合璧:解锁Web设计新纪元,让响应式界面瞬间焕发光彩!
【9月更文挑战第1天】本文通过问答形式深入探讨了Flexbox和Grid布局的特点与应用场景。Flexbox专为单轴布局设计,适用于响应式导航栏和列表;Grid布局则适用于二维布局,可精确控制元素的位置和大小,适合构建复杂的内容区域和仪表板。文章还提供了示例代码,帮助读者更好地理解和应用这两种布局方式,以创建高效、美观的Web界面。
288 9
|
前端开发 安全 Java
技术进阶:使用Spring MVC构建适应未来的响应式Web应用
【9月更文挑战第2天】随着移动设备的普及,响应式设计至关重要。Spring MVC作为强大的Java Web框架,助力开发者创建适应多屏的应用。本文推荐使用Thymeleaf整合视图,通过简洁的HTML代码提高前端灵活性;采用`@ResponseBody`与`Callable`实现异步处理,优化应用响应速度;运用`@ControllerAdvice`统一异常管理,保持代码整洁;借助Jackson简化JSON处理;利用Spring Security增强安全性;并强调测试的重要性。遵循这些实践,将大幅提升开发效率和应用质量。
170 7
|
Web App开发 编解码 前端开发
构建响应式Web应用的最佳实践
构建响应式Web应用的最佳实践
208 0
|
前端开发 JavaScript 开发者
现代前端框架激烈交锋,高效响应式 Web 界面的归属扑朔迷离!
【9月更文挑战第6天】本文通过实际案例,比较了主流前端框架 Vue.js、React 和 Angular 的特点与优势。Vue.js 以简洁的语法和灵活的组件化架构著称,适合小型到中型项目;React 强调性能和可扩展性,适用于大型应用;Angular 凭借全面的功能和严格架构,适合企业级开发。开发者应根据项目需求和技术栈选择合适的框架。
122 0

热门文章

最新文章