论文部分内容阅读
调查机构Company Data Trees曾发现,国外的手机网站优化比例不超过20%,而在中国还远远达不到这个比例。国内多数手机网站的优化主要是针对搜索引擎,因为搜索就像这个网站的导航,只要有搜索排名,就有点击率和浏览量。而国内的移动端,百度依旧占据着搜索的龙头位置,说的更明显一些,手机网站优化是面向百度搜索引擎来开展的,这种做法的直接后果就是带来了两种极端,一种是移动端网站极其简陋,另一种是移动端网站极其复杂。
中国的手机用户数已达10亿,超过2/5的移动用户每个月都会从手机终端访问网页。这就意味着进入移动互联时代后,移动端手机网站的优化工作尤为重要。网站不只是一个信息入口,更是一种营销方式,而目前大多数的网站受技术和成本的限制,并没有做好移动端的优化。
移动化网页设计难在哪儿
经常在移动设备上访问互联网的用户都有这样的感受:许多网站根本就没有针对移动设备优化,用户体验不友好,阅读体验也无法与传统的Web版本相提并论;而且在不同移动设备上的体验也是大相径庭。究其根源,移动设备的屏幕比较小,例如手机的宽度通常在600像素以下;而PC的屏幕宽度都在1000像素以上,要求同样的内容在大小迥异的屏幕上呈现出满意的效果并不容易。
移动互联网和传统互联网的区别不仅仅是设计标准和设计规范的变化,而应该从整个物理环境的变化来重新全面的认识。首先,移动互联网的使用场景更复杂。用户在使用桌面客户端或者访问传统页面的时候,都是坐在电脑前使用键鼠操作,这个使用场景一直是简单而固定的。但在浏览移动网页的时候,用户不仅是在室内,也可能在行走中、在交通工具上、在电梯中、无聊等待时或者边走路边用。如此复杂的场景,需要产品设计者考虑的要素也自然非常的复杂,用户如何才能顺畅的进行移动操作?
其次,用户在使用电脑时大部分的时间都是固定的。也就是我们经常说的:“在电脑前就是一整天。”但是移动端就大不相同了,用户所处的环境不同,使用手机时会随时随地受到周围情况影响,从而中断或暂停中的操作,相对传统网页浏览,移动端的使用时间更加碎片化。
移动端的网页浏览有一个更直观的变化就是屏幕尺寸缩小。用户使用电脑的屏幕尺寸基本上是20英寸左右,而手机尺寸最大也就是5-6英寸,平板电脑最大尺寸才是11英寸左右。电脑的大屏幕显示使传统网页有充足的区域来展现信息,因此界面的利用率很高;或者鼠标上下滚动一两下就可以看完通篇信息。而手机就不同了,要想把等同传统网页的信息都显示出来是完全不可能的,而且使用移动产品的根本目的就是追求效率,所以在网页上加入各种信息,让用户不断上下滑动屏幕浏览网页的方式是不可取的。
另外,传统网站上可以加入很多广告框,但是在移动端上还无法完善这一设计。因为本身需要屏幕展现的必要信息就很少,还需要有一个合理的规划和抉择,而加入次要的信息不仅会破坏用户体验,还将影响网页有用信息的加载。
随着智能手机的发展,智能系统越来越多样化,这就带来了一个新的问题—各系统平台的设计规范和标准。比如,苹果为确保iOS上各类APP和网页的用户体验质量和一致性,为产品设计师们公布了一份名为HIG(Human Interface Guideline)的设计指导。而微软的Windows 8和Windows Phone也有自己的Metro风格,它们无疑也为设计者带来了或多或少的影响。
优秀的移动网页设计如何炼成
首先,无论是传统网站还是移动网站,都要考虑清楚消费群体的定位。虽然智能手机用户数量非常普及,但是中国的大部分手机用户使用的还是2G网络,一直高喊的3G、4G手机用户大约只占15%左右。所以在页面设计时,要考虑用户打开网页的时长。这意味着移动网页应尽量避免加入一些炫丽的动画效果或者动态图片等。同时还要确保删除或替换任何大背景的图片,特别是为整个网站设置了背景图片的时候。另外也要避免使用弹窗、Flash、Java等行为,这些行为都会占用大流量,且浪费时间。
移动网页在样式上还有一些必须做的更改,比如通过改变字体大小提高可读性。接下来,移动设备的点击一般是缺乏精确的,所以重要的按钮和链接一定要增加可点击区域。页面上的浮动元素可能会导致移动布局问题,可以考虑取消不必要的浮动。
此外,之前提到手机用户浏览网页的时间十分碎片化,不可能耐心点击或滑动很多页面。其次,移动网站比传统网站的页面下载速度慢,因此移动网页要尽可能做到简洁,把页面数量和大小控制到最简单。大多数手机屏幕是垂直的,这意味着会从多列布局变成单列。与此同时,通过减少外边距和内边距节省额外像素可创建更严格的布局。
论坛导航或者电商导购页面也要尽可能做到精简,这些网站的信息相对繁多,所以要从用户需求入手。从论坛来讲,用户通过移动设备进入论坛的主要目的是阅读有用信息。这种情况下,网站要尽可能提供最简单的步骤,那些冗余内容,将导航部分做得更易找、易见。在这一点,“数字尾巴”做得比较到位。相比传统电脑网页,移动端去除了图片和文字预览,只留下八个板块标题,让用户一目了然,这说明有时候越想表现丰富越适得其反。
但这不意味页面就得空空如也,只有几个文字导航即可。细节优化十分重要,不然移动端只是个“简陋版”而不是“简约版”。例如,专属的移动网站也要有和传统网站相同的LOGO与标签,在每个页面的关键字及描述要做到和传统网站保持一致,做好针对性的填写工作,这对搜索结果的展现以及优化工作也会大有帮助。确保在手机网站或者PC端网站各个页面上有相应的导航或者提示链接,让用户可以在手机版和PC版进行切换。
响应式网页成为趋势
到2015年,移动互联网的用户数量将会超过桌面用户。
除了智能手机外,使用平板电脑甚至是电视机上网的用户在持续增加。于是,怎样让网站尽量兼容各种设备,并确保良好的用户体验,这将是越来越重要的问题。“响应式网页设计”(Responsive Web Design)设计的概念应运而生。这个概念是让Web设计根据不同设备自动响应,自动识别屏幕宽度,自动对网页调整。响应式网页设计的到来使既兼容各种设备又能确保良好用户体验成为可能。
可以说响应式网页设计是为移动互联网而生的。
值得一提的是,通过响应式设计中网页里图片的尺寸可以被自动调整,页面的图片布局不会被破坏。虽然个别布局在更改后不算完美,但给了我们更整合的使用体验。无论用户转换设备的屏幕方向,还是从台式机屏幕切到移动设备上,浏览页面都会真正富有弹性。
(编辑:杨磊)
中国的手机用户数已达10亿,超过2/5的移动用户每个月都会从手机终端访问网页。这就意味着进入移动互联时代后,移动端手机网站的优化工作尤为重要。网站不只是一个信息入口,更是一种营销方式,而目前大多数的网站受技术和成本的限制,并没有做好移动端的优化。
移动化网页设计难在哪儿
经常在移动设备上访问互联网的用户都有这样的感受:许多网站根本就没有针对移动设备优化,用户体验不友好,阅读体验也无法与传统的Web版本相提并论;而且在不同移动设备上的体验也是大相径庭。究其根源,移动设备的屏幕比较小,例如手机的宽度通常在600像素以下;而PC的屏幕宽度都在1000像素以上,要求同样的内容在大小迥异的屏幕上呈现出满意的效果并不容易。
移动互联网和传统互联网的区别不仅仅是设计标准和设计规范的变化,而应该从整个物理环境的变化来重新全面的认识。首先,移动互联网的使用场景更复杂。用户在使用桌面客户端或者访问传统页面的时候,都是坐在电脑前使用键鼠操作,这个使用场景一直是简单而固定的。但在浏览移动网页的时候,用户不仅是在室内,也可能在行走中、在交通工具上、在电梯中、无聊等待时或者边走路边用。如此复杂的场景,需要产品设计者考虑的要素也自然非常的复杂,用户如何才能顺畅的进行移动操作?
其次,用户在使用电脑时大部分的时间都是固定的。也就是我们经常说的:“在电脑前就是一整天。”但是移动端就大不相同了,用户所处的环境不同,使用手机时会随时随地受到周围情况影响,从而中断或暂停中的操作,相对传统网页浏览,移动端的使用时间更加碎片化。
移动端的网页浏览有一个更直观的变化就是屏幕尺寸缩小。用户使用电脑的屏幕尺寸基本上是20英寸左右,而手机尺寸最大也就是5-6英寸,平板电脑最大尺寸才是11英寸左右。电脑的大屏幕显示使传统网页有充足的区域来展现信息,因此界面的利用率很高;或者鼠标上下滚动一两下就可以看完通篇信息。而手机就不同了,要想把等同传统网页的信息都显示出来是完全不可能的,而且使用移动产品的根本目的就是追求效率,所以在网页上加入各种信息,让用户不断上下滑动屏幕浏览网页的方式是不可取的。
另外,传统网站上可以加入很多广告框,但是在移动端上还无法完善这一设计。因为本身需要屏幕展现的必要信息就很少,还需要有一个合理的规划和抉择,而加入次要的信息不仅会破坏用户体验,还将影响网页有用信息的加载。
随着智能手机的发展,智能系统越来越多样化,这就带来了一个新的问题—各系统平台的设计规范和标准。比如,苹果为确保iOS上各类APP和网页的用户体验质量和一致性,为产品设计师们公布了一份名为HIG(Human Interface Guideline)的设计指导。而微软的Windows 8和Windows Phone也有自己的Metro风格,它们无疑也为设计者带来了或多或少的影响。
优秀的移动网页设计如何炼成
首先,无论是传统网站还是移动网站,都要考虑清楚消费群体的定位。虽然智能手机用户数量非常普及,但是中国的大部分手机用户使用的还是2G网络,一直高喊的3G、4G手机用户大约只占15%左右。所以在页面设计时,要考虑用户打开网页的时长。这意味着移动网页应尽量避免加入一些炫丽的动画效果或者动态图片等。同时还要确保删除或替换任何大背景的图片,特别是为整个网站设置了背景图片的时候。另外也要避免使用弹窗、Flash、Java等行为,这些行为都会占用大流量,且浪费时间。
移动网页在样式上还有一些必须做的更改,比如通过改变字体大小提高可读性。接下来,移动设备的点击一般是缺乏精确的,所以重要的按钮和链接一定要增加可点击区域。页面上的浮动元素可能会导致移动布局问题,可以考虑取消不必要的浮动。
此外,之前提到手机用户浏览网页的时间十分碎片化,不可能耐心点击或滑动很多页面。其次,移动网站比传统网站的页面下载速度慢,因此移动网页要尽可能做到简洁,把页面数量和大小控制到最简单。大多数手机屏幕是垂直的,这意味着会从多列布局变成单列。与此同时,通过减少外边距和内边距节省额外像素可创建更严格的布局。
论坛导航或者电商导购页面也要尽可能做到精简,这些网站的信息相对繁多,所以要从用户需求入手。从论坛来讲,用户通过移动设备进入论坛的主要目的是阅读有用信息。这种情况下,网站要尽可能提供最简单的步骤,那些冗余内容,将导航部分做得更易找、易见。在这一点,“数字尾巴”做得比较到位。相比传统电脑网页,移动端去除了图片和文字预览,只留下八个板块标题,让用户一目了然,这说明有时候越想表现丰富越适得其反。
但这不意味页面就得空空如也,只有几个文字导航即可。细节优化十分重要,不然移动端只是个“简陋版”而不是“简约版”。例如,专属的移动网站也要有和传统网站相同的LOGO与标签,在每个页面的关键字及描述要做到和传统网站保持一致,做好针对性的填写工作,这对搜索结果的展现以及优化工作也会大有帮助。确保在手机网站或者PC端网站各个页面上有相应的导航或者提示链接,让用户可以在手机版和PC版进行切换。
响应式网页成为趋势
到2015年,移动互联网的用户数量将会超过桌面用户。
除了智能手机外,使用平板电脑甚至是电视机上网的用户在持续增加。于是,怎样让网站尽量兼容各种设备,并确保良好的用户体验,这将是越来越重要的问题。“响应式网页设计”(Responsive Web Design)设计的概念应运而生。这个概念是让Web设计根据不同设备自动响应,自动识别屏幕宽度,自动对网页调整。响应式网页设计的到来使既兼容各种设备又能确保良好用户体验成为可能。
可以说响应式网页设计是为移动互联网而生的。
值得一提的是,通过响应式设计中网页里图片的尺寸可以被自动调整,页面的图片布局不会被破坏。虽然个别布局在更改后不算完美,但给了我们更整合的使用体验。无论用户转换设备的屏幕方向,还是从台式机屏幕切到移动设备上,浏览页面都会真正富有弹性。
(编辑:杨磊)