三、轮播图的布局设计

1.整张大图

优点：视觉效果非常好，重点突出，可以让用户一眼关注到宣传重点

缺点：占用空间较多，影响屏幕信息容量

场景：定位清晰、布局简洁、内容较少、对于宣传十分重视的web

案例：小猪短租、美团、途牛

2.一屏多栏轮播图

优点：可以填充更多信息，用户可以根据喜好进行选择

缺点：视觉效果不好，画面混乱

场景：想展示的信息内容较多

案例：淘宝、新浪新闻、京东

一屏多栏轮播图的情况，一起自动切换会让用户眼花缭乱，引起厌烦，所以新浪新闻为了解决这种情况，选择了在多栏轮播图的情况下，一栏舍弃自动切换，只采用手动切换的形式

3.多张小图构成一张轮播图

优点：可以填充更多信息，用户可自行选择

缺点：用户容易抓不住重点，对排版要求很高，否则容易画面混乱

场景：想展示的信息内容多且并且可以整合成为一个整体

案例：百度视频、易车网、京东

四、切换方式

1.自动切换

优点：展示更多图片，用户不用手动切换

缺点：可能会在用户没看完的时候自动切换

场景：通用

案例：淘宝、新浪新闻、百度视频

2.轮播点切换

优点：可以跳转切换，可以直观看到一共有多少张图片

缺点：点击面积太小，容易误触

场景：通用

案例：淘宝、新浪新闻、百度视频

关于轮播点切换可能会造成误触的问题，有些web进行了改良，将轮播点调整成为不用点击，鼠标放置在该轮播点位置就会自动切换的形式，避免了为了切换轮播图造成页面跳转的情况

3.翻页键切换

优点：用户使用更加方便，不翻页时可自动隐藏，不会遮挡图片

缺点：只能一张一张进行切换，用户不能直观看到图片总数

场景：通用

案例：淘宝、网易新闻、百度视频

4.标签切换

优点：分类清晰，用户使用起来很方便，不会误触，可以跳转切换，有意义的直观信息

缺点：美观性较差，更占空间，要考虑标签容量，不能添加太多图片

场景：多种类型，且分类十分明确的内容展示

案例：新浪新闻

5.导航切换

优点：可以容纳更多一点的图片，可以直观了解到图片内容，可以跳转切换，让用户产生点击动机

缺点：会遮挡轮播图内容，用户会只选择自己感兴趣的

场景：主题明确，并且有明确用户兴趣点的内容展示

案例：爱奇艺、优酷、腾讯视频、音悦tai