wordpress主题建站,选择WEB主题公园中文原创企业网站模板!

WordPress技术博客 news
您现在的位置:首页 > WordPress技术博客 > wordpress网站增加触屏设备更好的访问方式

本周推荐网站模板

WordPress主题视频教程

最近更新的WordPress主题
最新更新过的网站模板

wordpress网站增加触屏设备更好的访问方式

发布时间:2013/10/20 WordPress技术博客 新闻资讯 1717 0

wordpress-Responsive-themepark

一直以来,我们都很倡导将wordpress做成响应式的网站,以自动适应各种触屏设备的访问,但是随着各种项目做的越多,我们越有疑问,响应式设计真的是最好的解决触屏设备和pc访问的方式吗?

我们在各种项目的执行中发现,基于pc的浏览器内核与基于触屏设备的浏览器内核对于我们常用的jquery兼容不是一般的差,我们在PC上漂亮的、酷炫的各种滑块,在触屏设备访问,现在看来就是一场灾难。

..首先,能够在触屏设备上运行的效果,尤其是我们喜欢的非常酷的效果,往往奇卡无比,完全没有流畅的app感觉,让网站的访问感受大打折扣。

..其次,PC设备的响应方式和触屏的相应方式完全不同,在PC上,我们很多效果都是使用鼠标经过(mouseenter 和mouseleave)、单击(click)的方式来响应各种效果的,而触屏设备使用的是触屏的手势,如tap(轻击)taphold(轻击不放)swipeleft(向左划动)、swiperight(向右划动)等手指的方式来执行的,这样的差别,让pc端的代码基本无法很正常的运行流畅的动画,很多时候,具有pc动画效果的按钮,我们需要在触屏上点击2次才会调传链接。

..最后,在触屏访问时,我们网站上很多的工具,如侧边栏的小工具等等,是不需要显示的,因为造成页面过长,由于触屏设备的尺寸比pc小很多,响应式设计中,那些宽度不够被挤下去的模块,都会增加网站的长度,这样对于访问者来说也是糟糕的存在,我们需要在触屏设备中出现的只是清晰的导航、便于阅读的正文,去除臃肿的部分。

不得不说,这样的访问方式对于用户来说,是多么糟糕!

这不得不让我们去思考,响应式的网站到底是否是解决触屏和PC端的最好方式?下面我们来分析一下如何解决这个问题。

 

折中:如果你坚持响应式,那么不同的设备加载不同的动作脚本

动作脚本和css

如果你坚持响应式设计,那么使用 Mobile_Detect(php设备判断插件),来判断一下设备的系统(判断安卓和ios等触屏系统,而其他则判断为PC即可)从而判断到底是触屏设备还是PC设备的访问,加载不同的脚本文件,css文件,让你的网站运行更加流畅。

不必要的臃肿内容

使用css将不必要的模块隐藏掉,从而达到清晰的界面,不过你要知道,即使他们一开始就被隐藏,但是还是会在网站开始加载时拖慢你的网站加载时间。

 

更好的性能:使用全新的触屏样式和html

使用响应式的方式,即使使用上面折中的方式,响应式本身的臃肿代码也是无法避免的,我们都知道wordpress的超强扩展性,这就给我们一条更好的方式,使用全新的触屏样式和html。

在PC端做好你的网站,在兼容宽屏的工作中,你可以使用最大宽度max-widtht,和最小宽度min-width进行兼容,而不去考虑小屏幕的手机使用css的媒体查询。

在建立新的触屏header、index、archive、category、page、single等并且加入设备判断,如果是触屏,则使用这些新的触屏文件,这样就能使你的网站能够以更好的性能在触屏上和pc上流畅的运行了!

这样是将整个主题加入了触屏的模版文件,效率更高,使用一个常用的判断即可完成。

更好的方式还可以直接建立一个wordpress子主题来兼容触屏设备,当触屏设备访问时,自动使用子主题,效果也是一样的。

这样做的好处

1.避免了臃肿的代码,如响应式的媒体查询、兼容各种神经病浏览器的css(ie6~ie8都是神经病)

2.避免了更多的php判断,如果使用响应式设备,那么你的load文件的判断就不忍直视了(非常多,这是肯定的)

3.让你的设备在触屏上加载触屏的脚本,流畅度可以与APP媲美。

 

总的来说,性能更快、效果更炫,流畅更高,对于用户的访问来说,不再是一场灾难,而是一次愉快的体验。

 

希望本文对开发者和用户有所帮助!

 

 

 

WordPress原创主题,高端网站模板建站,网站模板建站资源以及开发知识分享,尽在WEB主题公园

如未标明出处,所有文章均为WEB主题公园原创,如需转载,请附上原文地址,感谢您的支持和关注。

============关于WEB主题公园=============

WEB主题公园致力于开发适合中国人习惯的中文WordPress网站模板,并提供全程视频教程,让您能够轻松的使用网站模板建立好自己的网站!

分享WordPress开发,网站维护经验,分享更多有用的WordPress知识

WEB主题公园--做最好的中文原创WordPress主题,网站模版。