无限滚动加载是否适用于您的产品
2022-08-25

如何以更友好的方式呈现一系列数据内容,包括文章、链接、图片、搜索结果等,对于设计师来说不是一件容易的事情,在这方面,分页是一个经过时间验证和可靠的解决方案。

然而,近年来,我们发现越来越多的网站开始使用无限滚动来呈现内容――当用户浏览到页面底部时,传统意义上的下一页会自动加载数据并将其输出到当前页面。

无限滚动对于某些类型的网站或移动应用程序是一个很好的模型,但在某些情况下,它也会产生灾难性的后果。

让我们先看看无限滚动载荷的优点和缺点。

优势

1。有效地降低了界面的复杂性并节省了空间:我们不再需要庞大而复杂的页面导航链接或按钮。

2。对于触摸屏设备,交互模式更直观:在移动应用的交互环境中,向上滑动已经成为最基本的用户习惯,所需的操作精度远远低于点击链接或按钮。

三。更高的参与度:以上两点带来的互动便利,让用户更关注内容,而不是操作,让用户更愿意沉浸在探索和浏览中。

缺点

1。有限使用案例:无限滚网站制作公司 动方法仅适用于特定产品类型的某一部分。例如,在电子商务网站中,用户通常需要在商品列表和详细信息页面之间切换。在这种情况下,传统的页码导航方式可以帮助用户更安全、更准确地返回特定的列表页。

2。额外的复杂性:虽然用于创建无限滚动的JS库声称易于使用,但您始终需要对它们进行定制,以在产品中不同程度地满足您自己的需求。此外,这些JS库在浏览器和设备兼容性方面的性能参差不齐,必须做好测试和调整工作。

三。再见,页脚:如果您使用更典型的无限滚动加载模式,这意味着您可以对页脚说再见。最好考虑页脚对您的网站,尤其是您的用户的重要性;如果有真正重要的内容或链接,最好改为更传统和安全的方式。不要对用户耍花招。当他们浏览到页面底部并看到一个接一个的页脚时,他们会更加生气,但由于自动加载的内容突然出现,他们无法单击页脚中的链接。

4。SEO:重点是在一个页面中动态加载数据。与一个页面的输出相比,哪种方式更有利于SEO,这是一个你必须考虑的问题。对于某些类型的网站,在这方面冒险是不划算的。

5。页码的印象:从用户的角度来看,这不是负面的;但是,如果你的网站通过更多的内容页面显示更多的相关信息(包括广告)是一个重要策略,那么在单个页面上无限滚动的方式不适用于你。

了解了这些优点和缺点,让我们来看看这两个网站,我个人认为是在使用无限卷轴的地方。

推特

Twitter适合无限滚动加载的一个重要原因是,每一个内容单元都非常短和精致,它是整个内容本身。用户无需在列表索引和内容详细信息之间切换即可获取所有信息,当鼠标悬停在某个内容项上时,会出现相应的操作(回复、删除、收集等),所有内容和功能都集中在当前上下文中。

图布雷尔

网站制作公司默认情况下,Tumblr通过无限滚动加载内容,但考虑到它们为用户提供了在其设置中禁用无限滚动的选项,Tumblr的产品特网站制作公司性决定了其内容类型的宽度。不同类型的用户可能会非常注意不同形式的内容;允许用户设置自己的内容加载方式可以处理不同的用户组。

默认无限滚动模式

用户可以选择是否启用无限滚动

禁用后,返回传统的页面导航方式

下面是一个我个人认为不适合无限轧制的例子。

必应的图像搜索

和Google一样,Bing在图片和视频的搜索结果页面中使用无限滚动加载。但是,当用户单击缩略图进入图片详细信息页面,然后返回到搜索结果列表时,他将丢失以前的位置,这使得用户必须再次滚动页面以在单击之前找到位置。如果关键词产生了大量的搜索结果,这种方法会给你带来极大的不便。(现在必应已经改变了这种方法)。当用户点击搜索结果中的缩略图时,他们将直接在当前页面上输出弹出层,包括大地图和相关信息;新过程不会让用户离开当前环境-翻译器C7210注释)

YouTube

我喜欢YouTube的整体设计,我理解他们不断修改和调整设计的意图,但我仍然对他们最近在主页上无限滚动页面导航的做法感到有点不安。与必应的问题类似,YouTube的实际内容(视频)是在一个单独的页面上,用户显然不希望看到E一段视频,然后返回列表页面,发现列表已重新加载。

另一个尴尬的是,YouTube的无限滚动加载并不是那么自动,用户需要点击一个按钮来加载列表中更多的视频内容;在某些方面,这并不糟糕,因为它确实向用户移交了控制权,并实现了与前面提到的Tumblr类似的方法,但直接将无限滚动与手动触发器结合起来。嗯,有点不一致。

最佳实践

希望通过以上内容了解您的产品是否适合无限滚动加载,如果答案是肯定的,以下几点可以帮助您避免实践中的一些关键问题:

1。提供降级解决方案:前端开发人员应该考虑JavaCrit在特殊环境中不能正常工网站制作公司作的情况,并提供一个平滑的降级解决方案。

2。可设置:如果可能,考虑为用户提供设置选项,以方便他们选择最合适的浏览模式。这将使用户感到亲密,从而提高您的产品的满意度和忠诚度。

三。视觉反馈提示:自动加载新内容时,应向用户提供必要的视觉反馈,如各种动画效果,可以表达加载,否则用户将无法理解当前的情况;在没有视觉提示的情况下,如果加载时间过长,用户将出错。N表示不再有内容。

4。帮助用户定位:不要丢失以前的列表位置,因为用户访问内容的详细信息并单击浏览器上的后退按钮。如果确实无法做到这一点,而且这对您的产品非常重要,那么最好考虑传统方式。

5。测试:使用目标用户组可能使用的各种设备进行测试,以验证无限滚动加载方案的实际性能。

新闻资讯