网站制作
网页设计如何使用滚动视差来增强用户体验
2022-06-08来源:龙媒网络编辑部

大约自2016年开始,滚动视差(parallax scrolling)网页设计风潮席卷的网页设计市场,每个设计师都想让自己的网站添加上滚动视差,后来有一点点泛滥成灾,加上开发需要较多时间,又从市场上渐渐淡出。

也有一派说法表示「用户不喜欢滚动」,原因是研究表明,用户的注意力往往集中在首页之上,用户得看完一大段滚动特效才能进入网站,对一部分用户来说是一种困扰。因此今天iWare想要分享的是滚动视差绝非票房毒药,只要设计得宜,就可以为您的网站带来许多好处。

虽然大多数网站访问者都明白,如果他们滚动或是滑动萤幕,他们可以发现更多内容,但网站的各种元素可能会干扰他们的下一步。因此我们建议网站若需使用滚动视差特效,可以注意几个重点:

较短的首页Banner

当你的首页Banner占满萤幕,可能会让用户误解你的网页没有其他内容,所以你只需要缩短主图Banner的高度,下面的部分内容会变得可见。这使用户可以查看其他内容并吸引他们滚动以了解更多讯息。

滚动同时呈现内容

快速浏览网页是现代人的必备技能,快速扫描一个网站所需的注意力少得多,所以设备滚动特效时,不妨将你的内容摘要放入滚动视差特效中,例如图像或提示;适当调整内容迎合您的受众,这有助于用户扫描内容时注意到关键重点,并且在欣赏完网站之后,会继续的浏览其他的页面。

滚动提示

加入一个视觉元素,告诉用户滚动有内容时,大多会很乐意继续滑动下去。或着,如果有些老客户已经不需要重复观看时,请添加跳过特效的功能,许多现代电脑游戏都有跳过「过场动画」的设计,网页也可以如法炮制。

水平线分隔

通常滚动视差特效为了吸引用户目光,会占用很大的网页篇幅,但只需一个水平线,就可以交特效与内容做个区隔,当页面上的每一部分内容,都被水平线或变化的色块分隔时,用户很容易产生联想,明白网站的内容还有资讯是被分开的,如果要完整阅读,必须要移动或滚动画面。

色差设计

色差在网页内容区块设计上很有用,在首页的滚动视差也是如此,利用空白而不是交替色块时就如同观看简报一样,很快就能注意到滚动视差的内容已经播放完毕,用户注意到特效结束或已经到达页尾时,就有机会移动至其他页面观看内容。

中断体验

用户体验固然重要,但如果你有非得传达的讯息时,适当的中断也是一个手段,例如观看时差播一段文字或按钮,告知用户可以随时跳离滚动视差的特效环境中,直接到他们想去的页面。中断或许不是公司预期的网站导览方式,但是用户滚动时,用户脱离特效直接访问其他页面的的一个很好的管道。

浮动选单

传统网页设计上,我们习惯在选单钉在首页最上方,但时代变了,智慧手机的用户喜欢选单随处可及,浮动选单成为一个好的方案。用户向下滚动页面后,无须滚动回到最上方,透过浮动的选单,可以联络服务人员,或是开启网站的完整内容指南,重点是用户有自己的主控权,想要继续看完滚动视差效果或是到其他网页,都由用户自己决定。


返回列表

电话:025-8481 8352
传真:025-8618 9092
传真:025-8463 9263