视差效果,原来是一个天文学术语,当我们不雅观察星空时,离我们远的星星移动速率较慢,离我们近的星星移动速率则较快。当我们坐在车上向车窗外 看时,也会有这样的觉得,远处的群山彷佛没有在动,而近处的稻田却在飞速掠过。许多游戏中都利用视差效果来增加场景的立体感。说的大略点便是网页内的元素在滚动屏幕时发生的位置的变革,然而各个不同的元素位置变革的速率不同,导致网页内的元素有层次错落的错觉,这和我们人体的眼球效果很像。我看到多家产品商用视差滚动效果来展示产品,从不同的空间角度和用户体验,起到了非常不错的效果。
来看看几个视差造成的错觉。
视差滚动(Parallax Scrolling)是指让多层背景以不同的速率移动,形成立体的运动效果,带来非常出色的视觉体验。作为2013年网页设计的热点趋势,越来越多的网站运用了这项技能。

再来看几个利用视差滚动的精良demo网站(建议利用chrome或者火狐浏览器打开):
http://www.netlash-bseen.be/ (滚动鼠标滚轮)
http://www.sullivannyc.com/ (点击右侧黄色导航块来切换)
http://www.culturalsolutions.co.uk/ (滚动鼠标滚轮)
以下进入译文:
视差滚动效果是2013年最热门的网页设计趋势之一。但是,我预言2014年我们将会看到它逐步消逝,由于这个效果在实现过程中存在太多问题了。如果你在网站中曾经创建或利用过视差滚动,你就会创造个中的一些端倪。下面,我列举出我认为视差滚动存在的负面成分,这些成分会反过来会让网页设计倒退到其他的设计形式上。如果你认为我错了,欢迎你对这篇文章提出任何评论或反馈。
1、不利于SEO?
在标题里我用了疑问句,是由于我还没有对视差滚动对SEO造成的影响做深入研究。但是,我们将会失落去一个站长对正规站点常用设置的优化选项:
在url中没有关键词:采取视差滚动,你的得到的仅仅是一个url。你将不再有其他共同起浸染的页面url。
没有多个H1标签:在一个范例的视差滚动网站中,你仅能得到一个起浸染的H1标签。
更少的内部链接:把所有内容都放在一个页面,会降落你能掌握的内部链接数量。不管你信不信,内部链接会将锚文本导向它们指向的干系页面。
速率慢:速率能在一定程度上影响Google排名算法。如果你在一页中有太多内容,加载过程会降落页面速率,同时降落了页面排名的能力。
2、很难跟踪与剖析
传统站点许可通过不同的上岸页跟踪访问用户的行为。在视差滚动(站点),想知道单一页面的哪个区段为你的访问者供应了最大代价,这是个难事儿。对付视差滚动站点,也很难履行任何一种形式的A/B测试。
不进行适当的跟踪剖析,一个网站站长就不能通过改进页面或内容来提升网站流量和转化率。
3、增加了加载韶光
视差滚动须要一些jquery脚本的打算。你拥有越多的内容,脚本须要越长的韶光来打算(页面上)每个元素的移动位置。对付网络环境不佳的用户,视差滚动网站看起来就像是在爬行(那么慢)。这可不是个好的用户体验,以是我们该当仔细考虑什么时候,以及若何最好地利用视差滚动。
4、在移动设备上无效果
随着移动浏览器变得越来越盛行,我们无法忍受一个网站设计在移动设备上无法利用。不幸的是,当你利用视差滚动时,这种事情发生了。目前也有能让视差滚动网站事情在移动设备上的代码,不过那不是免费的。我们可能会在未来办理这个问题,但是现在,它仍旧是个能够降落网站可用性指标的东西,尤其是我们在移动设备上利用时。
5、缺少导航,浏览时会感到很烦人
有些时候,我须要滚动到页面的最底端来找到我须要的信息,这很烦人。一些聪明的设计师利用了锚点链接,但“飞过”所有不须要的内容,终极到达我想要阅读或理解的地方,仍旧让人以为很烦。所有这些问题都归结为在视差滚动网站缺少良好的导航设计。大部分网站只用了向下箭头作为唯一的导航方法,坦白来说,那并不好用。你第一次用可能会以为不错,但重复利用这样的网站后,你一定会希望有一种更快的方法来进行导航。
以是,你对视差滚动的意见是什么呢?缺陷比优点多?还是恰好相反,优点比缺陷多?
==========译后感===========
作为一种更优的呈现办法,视差滚动效果的网站给人一种线人一新的觉得,能够在第一韶光给网站访问者供应靓丽的视觉体验,会在一定程度上提升品牌识别度,让人印象深刻,这是它的优点,也是我们值得学习的地方。
但从另一个角度看,确实如文中作者所述,该类网站也有诸多劣势。我也确实看到海内一些网站,最初因此视差滚动办法实现,后来又转变成常规站点。综合起优缺陷,个人建议在以了局景,网站可以考虑采取视差滚动办法:
1、初创网站。如果其目的在于宣扬品牌、产品,且无太多文本内容呈现时,可在初期上线视差滚动网站,让人先对其产生兴趣,留下印象。之后随着访客增多,内容完善后,再改回常规网站形式。
2、主题宣扬站点。对付须要在某个韶光段发布的活动宣扬页面,须要尽可能为用户产生视觉上的冲击,可上线视差滚动站点。例如阿里、腾讯很多专题网站。
3、分外行业站点。这类站点的特色也在于“宣扬为主、突出视觉冲击力、内容有限”。如一些设计公司网站、游戏公司网站。
小编微旗子暗记:chizhenwei