电商网站布局结构分析

电子商务网页设计与制作Design

and

making

of

E-commerce

webpages电商网站布局结构分析主讲人：傅俊THISIS导入：电子商务网站布局的概念网站版面布局的步骤常见版面布局的形式内容结构123导入-电子商务网站布局的概念网页美感来自网页的色彩搭配外，还有一个重要因素就是版面布局设计。布局，就是以最适合浏览的方式将图片和文字排放在页面的不同位置。什么才是“最适合”并没有一个标准答案。一般来讲主要考虑其实用功能和审美功能。

导入-电子商务网站布局的概念（1）实用功能网页内容的主次一定要从网页的版式上体现出来，网页设计要突出重点内容；网页的导航一定要清晰，布局合理和逻辑性也是网页版式设计的要点。

导入-电子商务网站布局的概念（2）审美功能网页的版式要具有整体性、一致性，总体来讲就是统一；要合理地划分整个页面，安排页面各组成元素，即分割；通过合理运用矛盾和冲突，使设计更加富有生机和活力，即对比。

网站版面布局的步骤构思并绘制草图粗略布局定案（1）绘制草图在对页面实施布局之初，就像面对一张白纸，没有其他结构的东西，可以尽可能的发挥你的想象力，将你想到的效果画上去（可以用一张白纸和一支铅笔草绘，也可以用Photoshop等画图软件）。这属于粗创阶段，不必考虑细节功能。网站版面布局的步骤构思并绘制草图粗略布局定案（1）绘制草图在对页面实施布局之初，就像面对一张白纸，没有其他结构的东西，可以尽可能的发挥你的想象力，将你想到的效果画上去（可以用一张白纸和一支铅笔草绘，也可以用Photoshop等画图软件）。这属于粗创阶段，不必考虑细节功能。（2）粗略布局在草图的基础上，将确定需要放置的功能模块安排到页面上。也就是对各个版面内容进行细化，功能模块主要包含网站标志、主菜单、新闻、搜索、友情链接、版权信息等。网站版面布局的步骤构思并绘制草图粗略布局定案（1）绘制草图在对页面实施布局之初，就像面对一张白纸，没有其他结构的东西，可以尽可能的发挥你的想象力，将你想到的效果画上去（可以用一张白纸和一支铅笔草绘，也可以用Photoshop等画图软件）。这属于粗创阶段，不必考虑细节功能。（2）粗略布局在草图的基础上，将确定需要放置的功能模块安排到页面上。也就是对各个版面内容进行细化，功能模块主要包含网站标志、主菜单、新闻、搜索、友情链接、版权信息等。（3）定案就是根据细化的结果去组织完成明确的效果图，这里包括色彩效果、栏目内容效果的具体化。网站版面布局的步骤草图绘制多套方案，包括大致配色，进行讨论选择。通过和客户沟通，确定灰白的配色以及对主体区域分布意见后，对草图进步细化布局，做出样稿，再和客户讨论后实现定案。在样稿时，也会考虑加入一些图例、色调和图文样式来更好的明确定案。网站版面布局的步骤“同字型”也称为“回字型”也有称为“国字型”，是国内企业类网站主页最常用的类型，即分为顶端、主体和底部区域三个部分。顶端区域常为网站Logo、Banner和导航条。主体部分是网站的主要内容，一般分为三列，左右分列一些栏目，中间是主要栏目，有时也分为均分的四列。“同字型”最主要的特点就是沿中轴线左右大致对称。底部区域是网站的一些版权声明、联系方式等。这种结构是一般企业电子商务网站主页的首选。常见版面布局的形式常见版面布局的形式现阶段，这类布局的趋势则是大幅度增加了Banner的幅度来增加美感、更好地宣传企业文化、企业产品等，同时大大减少了传统“同字型”中主体部分的内容，主体部分的内容也更为灵活，不一定局限在三列，整个首页的布局显得更为简洁，但是总体上还是保持沿中轴线对称的格局。常见版面布局的形式“拐角型”，也有被称为“T字型结构”，国内企业网站常采用“左拐角型”，这种结构与“同字型”很接近，只是形式上的区别。主要区别就是在主体部分区域，“拐角型”分为两列，“左拐角型”左侧列表为一窄列，右列则很宽；“右拐角型”反之，顶端和底部与“同字型”类似。因此，这种布局经常和“同字型”结合运用，很多企业网站主页采用“同字型”，二级栏目页面采用“左拐角型”，这样能够很好地体现网站整体的风格。常见版面布局的形式“标题正文型”即最上面是标题或类似的内容，然后是分割线，接着就是正文，很像平时的文章。这种类型多用于网站的新闻页面中，还有一些栏目页中的具体内容页面也常采用这类的布局。常见版面布局的形式

POP布局，就是指页面布局像一张宣传海报，以精美的大幅图片作为页面的中心，网站具体栏目内容的布局则沿用“同字型”或者“拐角型”。有些则更灵活自由，只保留了导航栏。这类布局网站效果明显，但由于大量图片、动画效果的运用，加载速度则受到一定影响。常见版面布局的形式电商平台类最主要的特色是在主页会有一定篇幅显示分类列表。分类列表的作用如同传统商场中的导购牌，将购物商场中的商品分门别类，这样可以方便访问者找到需要的商品。除了分类列表外，就是在主页最为明显的位置放置搜索栏。整个首页最为主要的部分，是分栏目的展现各种营销活动和商品的推荐，从而促发消费者的购买需求。现阶段由于主页商品展示的需求，电商平台