“一个网络”,两种口味:响应性对适应性
2013-05-16 00:00
239 查看
日期:2013-5-16 来源:GBin1.com
编者的话:这是Mobify的CEO,Igor Faletski发表的一篇博文,Mobify,电子商务优化平台,为智能手机和平板电脑提供了适应网站的工具。
你可能听人说过,“我们生活在后电脑时代”。这对网络开发者而言意味什么?它意味着你的网站,有30%到50%的流量来自于移动电子设备。它同时意味着,不久之后,桌面用户或者笔记本电脑用户将会成为网络的少数派。
面对这样用户模式构建的转变,我们又要如何应对呢?我们已经跨越了m-dot或是t-dot时代,步入了一个由响应和自适应设计技术统治的时期 - W3C将它称为“一个网络途径”。W3C最主要的建议是:“所谓的‘一个网络’是指,就合理性而言,网络应该为用户提供同样的信息以及服务,无论这个用户使用的是什么终端设备。”
对于开发者而言,使用“一个网络”不仅是让网站今时今日在智能手机或者平板电脑上畅行工作,更可以在今时今日,我们不能想象的,面向未来的终端上工作无误。
当前我们有三种最为普遍的,开发“一个网络”网站的方式:使用响应式设计;客户端适应性设计和服务器端适应性设计。
这三种开发设计模式,并没有谁最好或者谁最差之分,每一个都各有千秋,有优点,也有缺点,而聪明的开发者会在开发前,考虑到这三种方法的优缺点,从而选择一个最为合适的途径。
这种方式一个最为主要的优点是,对于所有的终端设备,设计者只需要使用一个模板,在CSS中定义不同屏幕大小如何显示内容就可以了。而且,这些设计者可以继续使用他们所熟悉的技术,例如CSS,HTML。另外,现在有更多的,友好响应的开源工具,例如Bootstrap或是Foundation,这些开源工具简化了搭建响应网站的过程。
另一方面,完整的响应式设计很少有快捷便利的方式。要做到响应,组织者往往需要承担一个完整的网站重建。
设 计和测试会非常的繁琐,因为要针对每一种可能设备的用户体验做出设计是非常困难的。我们看到响应式网站的布局看起来像是一块块拼图,并不是契合的一体。响 应式网站设计最好是应用在移动设备优先的开发上,即移动设备用例在开发中作为最优先考虑。渐进增强处理,在将设计延伸至平板电脑和桌面用例上。
性能也是响应式网站的一大棘手难题。在Mobify,我们最近完成的对于15个流行的电子商务网站的分析指出,在这些网站中,主页加载平均是87个资源和1.9MB的数据,一些响应网页竟然有15MB大小。
加 载的数据之所以这么大,是因为响应式网站需要覆盖所有的设备。你的用户只用一种设备,他却需要等待所有的界面元素和资源全部加载完全,才可以浏览使用。简 单地说,性能问题已经触及了你的底线。在智能手机上,用户等待一秒钟的时间,转换率会下降3.5%。只需要3秒,用户就会选择完全离开你的页面了。
......
via 极客社区
来源:“一个网络”,两种口味:响应性对适应性
编者的话:这是Mobify的CEO,Igor Faletski发表的一篇博文,Mobify,电子商务优化平台,为智能手机和平板电脑提供了适应网站的工具。
你可能听人说过,“我们生活在后电脑时代”。这对网络开发者而言意味什么?它意味着你的网站,有30%到50%的流量来自于移动电子设备。它同时意味着,不久之后,桌面用户或者笔记本电脑用户将会成为网络的少数派。
面对这样用户模式构建的转变,我们又要如何应对呢?我们已经跨越了m-dot或是t-dot时代,步入了一个由响应和自适应设计技术统治的时期 - W3C将它称为“一个网络途径”。W3C最主要的建议是:“所谓的‘一个网络’是指,就合理性而言,网络应该为用户提供同样的信息以及服务,无论这个用户使用的是什么终端设备。”
对于开发者而言,使用“一个网络”不仅是让网站今时今日在智能手机或者平板电脑上畅行工作,更可以在今时今日,我们不能想象的,面向未来的终端上工作无误。
当前我们有三种最为普遍的,开发“一个网络”网站的方式:使用响应式设计;客户端适应性设计和服务器端适应性设计。
这三种开发设计模式,并没有谁最好或者谁最差之分,每一个都各有千秋,有优点,也有缺点,而聪明的开发者会在开发前,考虑到这三种方法的优缺点,从而选择一个最为合适的途径。
响应式设计
响应式网络设计是最为大众的“一个网络”的设计方式。这种方式使用了CSS媒体查询,用于根据不同终端显示器的大小而改变网站的显示。从波士顿环球报,到迪斯尼,再到Indochino,响应式网站的数量正在迅速增加。这种方式一个最为主要的优点是,对于所有的终端设备,设计者只需要使用一个模板,在CSS中定义不同屏幕大小如何显示内容就可以了。而且,这些设计者可以继续使用他们所熟悉的技术,例如CSS,HTML。另外,现在有更多的,友好响应的开源工具,例如Bootstrap或是Foundation,这些开源工具简化了搭建响应网站的过程。
另一方面,完整的响应式设计很少有快捷便利的方式。要做到响应,组织者往往需要承担一个完整的网站重建。
设 计和测试会非常的繁琐,因为要针对每一种可能设备的用户体验做出设计是非常困难的。我们看到响应式网站的布局看起来像是一块块拼图,并不是契合的一体。响 应式网站设计最好是应用在移动设备优先的开发上,即移动设备用例在开发中作为最优先考虑。渐进增强处理,在将设计延伸至平板电脑和桌面用例上。
性能也是响应式网站的一大棘手难题。在Mobify,我们最近完成的对于15个流行的电子商务网站的分析指出,在这些网站中,主页加载平均是87个资源和1.9MB的数据,一些响应网页竟然有15MB大小。
加 载的数据之所以这么大,是因为响应式网站需要覆盖所有的设备。你的用户只用一种设备,他却需要等待所有的界面元素和资源全部加载完全,才可以浏览使用。简 单地说,性能问题已经触及了你的底线。在智能手机上,用户等待一秒钟的时间,转换率会下降3.5%。只需要3秒,用户就会选择完全离开你的页面了。
......
via 极客社区
来源:“一个网络”,两种口味:响应性对适应性
相关文章推荐
- “一个网络”,两种口味:响应性对适应性
- 大小端字节序存在的意义,为什么不用一个标准呢? 在网络编程和一些服务器中采用的是大端的字节序,而一般的主机采用的是小端的字节序,为什么要分成两种?不能合成一个吗?
- 输出一个数字上各位数字的两种方法
- 加入域的过程中,跳出一个找不到网络路径......
- Linux网络编程:一个简单的正向代理服务器的实现
- Android上实现一个简单的天气预报APP(三) 获取网络数据
- Network Emulator for Windows Toolkit一个模拟弱网络环境的软件
- 1.创建一个Rectangle类,添加width和height两个成员变量。 2.在Rectangle中添加两种方法分别计算矩形的周长和面积 3.编程利用Rectangle输出一个矩形的周
- 一个老站长说:我是如何通过网络赚来几百万?
- 用深度学习网络搭建一个聊天机器人(一)
- 黑客可用一个URL劫持Ubiquiti无线网络设备
- 计算机网络实验,JAVA实现一个简单GBN协议,模拟引入数据包的丢失,验证协议的有效性
- 卷积:如何成为一个很厉害的神经网络
- div中加入span右对齐后出现换行显示两种解决思路(同行显示,一个居中,一个靠右)
- 开发一个基于React Native的简易demo--读取网络数据并展示
- 网络编程与多线程的应用--基于socket udp编写一个简单聊天程序
- 深入UNIX编程:一个简单聊天室的两种实现 (fcntl 和 select)
- 发布一个高性能的Reactor模式的C++网络库:evpp
- 一个网络判断的工具类
- 在google申请了一个讨论高性能网络编程的邮件列表,欢迎订阅