电商营销之视觉设计（三）

ZME

先做个知识小贴士！这里的“第一屏”是指店铺的首页。电脑呈现给消费者的第一屏幕，是在不需要滚动条的前提下可观看的浏览面积。接下来没滚动一次鼠标滑轮就是第一屏，以此类推“第二屏”、“第三屏”等话不多说，回归正题。首页的第一屏就好比男女相亲的第一印象，一定要抓住对方的心，这样才有后续发展。首页的第一屏包括：店招、导航条和滚屏海报。


1、简约不简单的店招

店招，顾名思义就是店铺的招牌。总的来说，店招信息不宜过多，要以品牌为主，然后结合店铺的经营类目、品牌调性、总体套色等几个方面进行设计，这样简约但不简单的店招就出来了！

2、清晰明了的导航条
首页的用途之一就是把流量合理的分配给主推的页面或商品页面，引导用户找到合适的产品，并希望最终的订单成交。导航，在首页就是分类引导的作用。常见的导航根据出售产品的分类进行，列如服装类，以“外套、毛衣、衬衫、休闲裤.....”为分类。而电器则会以电器的功能性“电视机、洗衣机。电冰箱”等

值得注意的是在导航栏中，从左到右的前三个点击是最强大的视觉中心，无论是消费者观看的习惯、还是从视觉上一扫而光的时间来说，消费者看最多的就是前三个，并根据热力图数据显示，除首页的点击功能外，导航栏后三个点击数值相对密集，这也就是说，有必要把消费者点击的页面链接防在前三个导航信息内。


如果三个不够怎么办？或许你有多于三个以上不想舍弃的页面，想要展现给消费者，那么，你可以尝试使用一些小而精致的图标、标签、比较亮的颜色等手段，和其他的导航信息做出区别，引起消费者的注意。

3、呼之欲出的滚屏海报
滚屏海报，是个视觉炸弹，眼前一亮的感觉就靠它了！值得一提的是：一般滚屏数量已三张为佳，在丰富内容同时，又在消费者阅读新鲜感和视觉耐性的时间内。过多的滚屏会分散吸引力，起到适得其反的作用。如果是在活动多，可以根据首页的设置，放置于下方某处。

更多精彩案例：

题外话：一个画面的构思，与文案也有着环环相扣的因素，许多人觉得，电商的文案不重要，在这里，想要为伟大的电商文案们吐口气，你们对于页面的设计师来说，是一丝灵感、一丝创意闪现的重要存在！所以，请还在电商圈里奋斗的文案们加油！

看过了店招、导航和海报，当消费者转动鼠标向第二屏的时候，就到了“高手对招、各显神通”的阶段了。第二屏的信息一般为店铺活动、或者、主推产品，这个值得好好利用的位置。

小贴士：在第二屏进行产品推荐中，要对产品的热卖及功能做提炼，不能为了铺货而展示，单一的叠放，产品缺乏亮点，反而浪费了绝佳的展示机会。

消费者看到第三屏的时候，这是全面展示产品分类的好时机（但这块内容并不局限于第三屏，有店铺把它放在之后的位置，不强求）


记不记得，导航栏的目的是为了几个重要的页面，而在这里，我们的目的是让消费者能够通过分类进行选择查看。但这个功能有利有弊。好处是让希望直接查看某分类的消费者可以一击即中，跳转到需要的页面；坏处是在这一板块就会直接将首页的流量进行分流，导致首页的下半段的页面流失率提升。

内衣类目：

女装类目：

分类不是单一的，不是约定俗成的，可以根据店铺营销的需求及自身产品的特色，进行设计。可适时增加活动区、收藏区，或在具体的产品展示中增加“手机专享价”的产品内容，挑起消费者购买欲。

你以为当产品分类展示结束后，首页功能就此结束，页面就戛然而止？其实“后面的内容更精彩”，那就是店主推荐、爆款、热销专区。


作为店铺的杀手锏，这个板块无论是从选择方面，还是颜色、排版、字体优化等画面设计方面，遵循与店铺风格一致的基础上，追求个性化展示，劲爆的产品信息及画面设计会让消费者产生兴趣。当鼠标点击进入详情页时，促进“买买买”的目的就成功了。

小贴士：在挑选产品款式的时候，尽量选择一些款式差异化大的产品展示，对于价格上的差异化也是一样的。这样的设计排列不会给消费者带来热销新产品单一化的错觉，同时也不会对消费者造成购买的局限性。

其实在首页中，有很多信息的展示是机动性的，是根据整个首页的板块设置、画面设计、页面长度来控制的。比如“客服中心”，你可以设置在第五屏，也可以在靠前的版块内。还有类似“手机店铺收藏”等，结合上下板块的内容，融合设计。


另外，在设计上可以加入“自定义”版块内容，结合店铺和产品特色的需要。比如“最新热评”，在母婴产品类店铺内比较常见，通过众多评论，让消费者对产品及品牌产生信赖感。

小贴士：一般建议首页总体长度不宜八屏，太长的页面易造成视觉疲劳，选择困难，最终流失！所以进行首页设计前，需要整体把控框架内容、布局节奏、细节斟酌。