今天完成的事情：（一定要写非常细致的内容，比如说学会了盒子模型，了解了Margin）

1，关于任务四banner的调研整理

重新对比了电商网站，京东，淘宝，唯品会和卷皮官网的banner 设计

淘宝：banner轮播图位于首页导航栏下方，单张切换类型，所处网页头部中间位置，banner占用篇幅较小，主要是用作广告推广，自动向左切进行切换，自动切换时间为5s，同时支持手动切换。

京东：banner轮播图位于首页导航栏下方，单张切换类型，所处网页头部中间位置，banner占用篇幅较小，主要是用作广告的推广，自动向左进行切换，自动切换时间为5s，同时支持手动切换。

卷皮网：banner轮播图位于首页导航栏下方，单张切换类型，所处网页头部中间位置，banner占用篇幅较小，主要是用作广告推广，采取的淡入淡出的切换模式，自动切换时间为5s，同时支持手动切换。

唯品会：banner轮播图位于导航栏下方，单张切换类型，所处网页头部位置，采取的满屏方式，主要是用作广告推广，采取淡入淡出的切换模式，自动切换时间为5s，同时支持手动切换。

总结：通过对部分电商网站进行调研，可以看到电商网站主要是采用将banner轮播图置于导航栏下方的方式进行设计，于此同时，采用的banner切换类型均为单张切换模式，当banner轮播图的位置在网页头部中间位置且占用篇幅较小的时候，banner左侧栏一定是分类列表，右侧则是个人信息栏，这样的设计方式也是目前主流设计

优点是左侧的详细分类列表可以满足用户的查找方式，中间的banner图则可以向用户去展示更多的信息广告信息，增加商品的曝光率，右侧的个人信息栏，可以方便用户操作。

娱乐网站banner对于，主要对比的是优酷网、腾讯网、爱奇艺网

优酷网：banner位于搜索栏下方，单张切换类型，采用图文结合的方式，文字悬于图片上方，点击文字，banner也可自动切换，所处网站头部位置，全屏铺满的样式，banner的作用主要是向用户推荐目前比较火的电影和电视剧，同时也增加曝光率，增加用户的点击率，采用的淡入淡出的切换模式，自动切换时间为5秒，也可以手动切换，手动切换则改成了点击悬于上方的文字，进行banner的切换样式，分类列表则放置于banner下方。

爱奇艺：banner图位于搜索框下方，单张切换类型，采取图文结合的方式，文字置于图片上方，点击文字，banner也可自动切换，所处为网站头部位置，全屏铺满的样式，banner的作用是向用户推荐目前比较火的电影和电视剧，同时不仅为了增加曝光率，也为了增加用户的点击率，采用的淡入淡出的切换模式，自动切换时间为5秒，也支持手动切换，手动切换则改成了点击悬于上方的文字，进行banner的切换样式，分类列表位悬于banner图上，位于banner轮播图下方。

腾讯：banner图位于搜索框下方，单张切换类型，采取图文结合的方式，文字置于图片上方，点击文字，banner也会跟随变换，所处位置为网站头部位置，全屏铺满的样式，banner的作用是向用户推荐目前比较火的电影或电视剧，同时不仅为了增加曝光率，也为了增加用户的点击率，采取淡入淡出的切换模式，自动切换时间为5秒，也可支持手动切换，手动切换则放弃了鼠标点击左右切换箭头，改成了点击悬于banner上方的文字，banner图进行跟随切换，分类列表则位于banner下方。

总结：通过对于娱乐网站的调研，可以发现，影视类网站主要是采用将banner轮播图置于搜索栏下方的方式进行设计，同时banner切换的方式是单张切换，banner则采取图文结合的方式向用户展示，文字悬于banner图右侧纵向布置，用鼠标点击文字，banner图则会跟随切换，取消了常规的向右向左的点击箭头切换的模式，分类列表位于banner下方。

有点：图文结合的banner不仅可以向用户展示主题信息，也可以更加吸引用户的眼球。

功能型网站主要对于12306、平安保险进行了调研

12306：banner轮播图位于导航栏下方，单张切换的类型，图文结合的方式向用户去展示，banner自动进行切换，切换时间为5S，采用全屏满铺的样式，也可进行手动切换，手动切换必须点击banner图中白点才能进行切换，没有箭头切换按钮，设计不合理，切换方式为向左自动滑动切换。

平安：banner轮播图位于导航栏下方，单张切换类型，图文结合的方式去向用户展示，banner可自动切换，切换时间为5S，采用全屏铺满的样式，也可手动点击箭头进行切换，切换方式为淡入淡出的方式。 

总结：功能型网站在于banner轮播图的设计上比较简洁，banner轮播图一般都是采用置于导航栏下方的方式进行设计，同时banner是采取图文结合的方式，主要是为了向用户介绍网站关连信息，banner图可以自动切换，切换时间一般都为5S，可以让用户有足够的时间去了解完banner图上的内容，也支持手动点击切换。

关于草船云网站的banner设计：

首先草船云定义为一个功能型网站，主要是为用户提供创业咨询与创业部分和人才推荐，所以在于banner的设计上应该采取功能型网站banner的布局设计，如banner轮播图应该位于导航栏下方，且为单张切换类型，图文结合的方式，可以更加清楚明了的向用户传递有用的信息，banner可自动切换，切换时间为5S，也可手动点击箭头切换，banner轮播图自动切换是向左进行自动切换，同时采取的是全屏铺满的样式设计。

明天计划的事情：（一定要写非常细致的内容）

遇到的问题：（遇到什么困难，怎么解决的）
收获：（通过今天的学习，学到了什么知识）

对于调研有了比较清晰的方向，在于不通过类型的网站，对于banner的设计上大部分会一样，区别于细节的设计差别，主要是为了网站进行服务。

如电商网站banner的大体上设计为左侧分类列表+中间banner轮播图+右侧个人信息，banner位于导航栏下方

如娱乐型网站banner的大体上设计为banner位于搜索框下方，banner则是满屏铺满的样式，图文结合，文字置于banner上方右侧成纵向分布，点击不同主题文字，banner会跟随切换，分类列表位于banner下方。

如功能型网站banner的大体上设计为banner位于导航栏下方，采取图文结合的方式向用户展示关于网站的一些重要信息。