为什么写昨天看了腾讯ISUX的《你还在用轮播图么？》（原文链接：https://isux.tencent.com/carousels.html） ，感觉写得很棒，想总结一篇学习笔记。刚好前一阵接触到结构化思维，就尝试用结构化思维做了这篇学习笔记：
1. 轮播图缺点
1）点击率通常都很低
A．设计不当的轮播图容易被用户当成与他想浏览的内容不相关的广告图片而直接无视
B．轮播图的交互效果十分不理想：只有1%的用户点击了轮播图上切换按钮，其中84%的用户只在首屏点了1次
C．还有学者针对30多个B2B的网站的网站进行了研究分析，根据轮播图的内容分成了三类：品牌宣传（Branding）、白皮书/在线研讨会（Thought Leadership）、服务推广（Service Promtion），发现不管是哪一类的内容，点击率都很低（0.16%~0.65%）
2）转化效果也并不好
3）不利于SEO：
A．复杂的大图导致网站性能低，加载速度慢。
B．使用轮换的标题。
C．Flash的使用。
2. 确保你是否必须使用轮播图？
这么做的目的是什么，当用户打开页面时，最希望他关注什么内容，这些内容是否能分出优先级；通过已有的研究结论，理性认识轮播图的效果（并非万能，如果设计不当可能带来负面效应）；思考是否有更好的方式去达到同样的目的；当无法抉择时，做ABtest
3. 如果一定要用轮播图，该怎么设计？
1）让轮播图看起来像是站点的一部分
2）不要自动切换：
“自动切换”这样的交互方式不仅起不到曝光更多内容的作用，反而影响了体验：没有多少用户会盯着图片为了未知的内容耐心等待5秒，当用户对当前的图片内容感兴趣进入阅读状态时，突然的自动切换会打断用户的阅读进程
3）对于面积较小的点击区域（如定位指示点），给予适当的容错区间。
4）提示用户所在的位置，提示用户操作后可见的内容：
在下图的案例中，banner区域的下方展示了不同视图下的缩略图和标题文字，让用户能够在不进行任何切换时，就获取隐藏的信息内容，然后再选择自己感兴趣的进行操作。
5）保证可用性，兼顾SEO：须考虑到网站的加载速度，对内容进行优化，使用轻量的图片元素和转场动画，保证网站的可用性
网友评论