文档介绍：课程名称: 网页设计与制作
课题名称:网站页面布局分析
学院: 管理学院
专业班级: 电子商务1301班
姓名: 王敏
学号: 130506123
任课教师: 白晨生
完成日期: 2016年1 月3 日
目录
1
1
3
5
7
turliaw网站页面布局分析 7
Zilliow网站页面布局分析 8
Realestate网站页面布局分析 10
:京东商城 域名: 
:首页的各个模块布局 
:主体颜色以白色的背景,红色的主色调,一些价格优势,促销也是红色标给人醒目!细节在主体红色之外红的有色差而不是用一种红的色值 。页面总Width:1210p。
:顶部以Height:31px;其中包括收藏本页、切换地区,方便物流第一时间锁定用户地址、登陆提示和注册、会员专区、手机版京东、售后服务、网站导航。下面以通栏形式广告W:1210px。主要位置给京东Logo(1-1):width270px * height60px。 
 
图1-1
(图1-2): 默认搜索里主要以近期主打产品为主,搜索模块可以让买家直接输入自己想买的东西的名称,快速查找,节约时间。并且搜索栏下面有热门搜索,这可以显示大家最近在关注的东西。  
图1-2
(图1-3):分为7个主导航,左边主Navigation:w210px*h450px。分为14个主要商品分类。中间活动Advertisement:分上下两个广告,上面为6个主要活动,下面为3个打折促销活动是定时切换的,既能推广活动又能促销新品和折扣商品右边公司快讯和零碎功能入口。
图1-3
图1-4这些商品都是近期搜索指数最高、打折优惠、推新品、预售商品,采用灰色的商品模块 接下来分出8楼阶梯介绍商品其中每层阶梯结构,每层都是分为3部分结构 Left:以每层主分类、下跟具体商品细节分类小结:第一屏中以三列式布局呈“F”状的视线习惯,网页的上方为用户提供服务、配送方式等,让用户了解商城的运作方式,为用户以后的购物提供方便。在网页的中间部分是大幅的商城的最新信息,及商品的打折信息,让顾客能及时找到自己所需的商品,导航栏及所有商品分类为用户提供方便选择,网页中间展示了商品的最新更新,让用户能更快知道商品信息。网站板块设计横向按照1:2:1的比例设计,大致分为总体分类,产品展示等。这样的设计非常符合用户阅读习惯,中间是关键点占得比重比较大。
图1-4
(图1-5)分为两部分:上面主要给用户购物指引介绍京东商城的特点配送方式,付款方式,售后服务,特色服务,和京东物流实力;下面是在线咨询,查询等互动服务。
图1-5
:聚美优品 域名:http://bj./ 
:首页的各个模块布局  
:主体颜色以浅色背景,搭配粉色和黑色为主,公司主打方向是:化妆品团购网,并且保证30天无条件退货,页面Width:960px。
图1-6
+D收藏本页提示,下面为左右两部分,左边主要为限时特卖、美妆商城、美妆口碑、手机聚美和正品保证;右边是用户登录和订单信息。接下来是Logo(图1-7)和Shopping  
 
图1-7
在下面(图1-8)是网页分为五个入口,极速免税店,母婴特卖,美妆商城,国际轻奢,服装运动,鞋包配饰。 
 
图1-8
(图1-9)聚美大胆运用多种不同色彩元素但主色调还是以粉色为主,烘托出整个大卖场的热度,强刺激用户向下继续阅览。
图1-9
(图1-10)大致以两个部分组成:第一部分是以同一模块分为8个特卖专场为主与导航呼应,其中每个专场以三部分组成,上面介绍本专场内容,中间各个特卖商品及价格,下面指引用户进入本专区的入口;第二部分主体以左右两部分组成左边是各个商品的展示及价格,在展示最下面放置的是已经抢空的商品有勾引用户关注右边以上下组成大致分为五个模块,从上到下是商品预告、今日爆款、名牌商品预告、互动模块和跟随页面的导航条。
图1-10
(图1-11)大致两部分上部分是以服务保障、使用帮助、支付方式、配送方式、售后服务、二维码;给用户一个网站指引性的标志。
图1-11
:沱沱工社网域名:  / 
:首页的各个模块布局 
:主体颜