网站设计小知识_官网设计中最低端的内容叫什么-CSDN博客

本文链接：https://blog.csdn.net/MeetWithDo/article/details/78653431

零零碎碎的一些网站设计小知识，都是平时做项目积攒的一些东西，今天抽空整理出来；若有问题可以联系我，我会及时修改。^_^

网站类型

网站一般分为四类
- 产品宣传型
例如：htc，小牛电动车，苹果官网，锤子官网：科技类宣传
设计室：奥美，洛可可，北京新几何
- 网上营销型
- 客户服务型
- 电子商务型

网站标配

产品介绍-产品功能-产品分类-产品活动
服务项目-市场分析-项目优势-团队介绍-案例展示
企业简介-项目规模-项目介绍-团购活动-活动流程

用ps设计网页的一些规范

页面大小规范
H:4000px W:1600px（内宽：1200px）
外宽1920px，内宽1200pxrgb72
外宽1600px ，内宽1200px
外宽1400px ，内宽1000px
正文文字规范：
思源黑体和微软雅黑（正文）
英文helvetica、三番sanmranciso（旧金山字体）
标题18-20px
副标题14-12px
行间距字号大小的1.5倍
图片使用规范，无水印高清无码，像素稍微大点，适用
banner（广告）：

网站标配的作用

分页导航的作用：
1，告诉用户要浏览的总信息量；
2，让用户跳过不想看到的信息
3，便于定位与查找
4，减小页面大小，提高加载速度；
5，给网站一种停顿，节奏感，减少用户浏览疲惫感。
浏览路径面包屑：展示了用户访网站的路线，由一大串的元素和节点组成。每个节点都与指向先前访问过的页面或父级主题相连，节点间以符号分隔，通常是大于号（>）竖线（｜）或者斜线（/）
作用：
1，让用户了解当前的位置
2，体现网站的架构层级，从而形成很好的位置感。
3，提供返回各个级别的路口，
4，使用关键字作为浏览路径的名称可以实现su优化。
5，降低网站的跳出率。
垂直菜单：通常置于网站二级也页面的左边或者右边的一列链接。垂直菜单较横向的导航更灵活，易于向下扩展，且允许的标签长度较长。
作用：
1，找个各个分类的快捷入口，
2，易于向下扩展，
3，允许标签长度较长
树状导航
常用与二级页面中的三级内容展示
站点地图（页面最低端）
为网站提供附加信息的迅速总览。适用于有大量内容和广泛用户群体的网站，因而应该比较简单易于扫视。
作用：
1，提高了到达其他也页面的速度，
2，方便网络爬虫通过站点地图，抓取页面，了解架构
3，为用户指明方向，

其他

导航栏的设计可以是静态的也可以是动态的。
滑动式、隐藏式、顶部固定透明、隐藏滑动式导航，侧边、固定侧导航，
排版的四大要素：
亲密性：在网页中主要表现为对于内容的主次关系。
对齐；
重复；
对比；
线框能起到强调的作用。

网站二级页面

功能：
1. 单页功能，(关于，说明，须知) 无页面跳转（不具备分页导航）
2. 文章系统（新闻，日志，咨询）
  2.1 文章列表页
  2.2 文章详情页
3. 图文系统（产品案例）
  3.1图文列表页
  3.2 图文详情页（图片文字）
4. 表单系统（留言评论登录注册）
  4.1 表单填写页
  4.2 表单查询页
5. 招聘系统

网站二级页面的布局

电子商务
特性：方便性整体性安全性协调性
1. 电子商城：阿里巴巴 B2B(企业对企业）淘宝 C2C（个人对个人）天猫京东 B2C（企业对个人）饿了么美团糯米
  （附注：O2O 是指线上与线下（线上支付，线下消费）共享经济：共同创造，有参与感）
2. 综合商城： c2c b2c 商品多分类
  专一整合性
  - 百货商店（凡客成品）
    （卖家只有一个单对多的模式进行运营一般具有自有仓库以及物流配放和客户服务）
  - 垂直商场
    （只卖一种，专门针对于某种人群和行业进行专业服务）
主要功能构成：
导航（主导航侧导航站点地图分页导航浏览面包屑）；钻展 banner；直通车/推广推荐；产品列表/产品详情；登录注册页；购物车；订单页；个人中心。

电子商城首页设计

 产品浏览>新用户注册 >登录> 挑选商品> 放入购物车 >确认货物信息填写信息表单 > 选择付款方式 >生成订单

头部改变
头部登录/注册个人信息个人中心的购物提示（收藏功能购物车提示订单查看购物信息）
LOGO 整站提示导航

普遍有两个导航总导航侧边分类导航导航在网站改版时不会轻易

banner 制作分类
给力的文案；信息突出；目标群明确。
目的: 产品的转化率访问量
内容区域
内容主体区域：产品分类，主打产品展示，热门推荐，品牌分类，热卖排行，使用功能分类。
商品列表页表现形式：
- 行列排列（每个卡片大小，空隙一样）利于用户找到浏览规律
- 瀑布流更多在流行时尚领域
- 特别款突出。
制作产品检索需要主要
1.展示的基本信息：
简单扼要的图片、商品名称以及价格说明，购买人数。
2.鼠标悬停时产生交互效果
效果包括：变色色框 JS效果（放大或者左右位移）
3.始终带给用户指引
网站应该始终为用户提供指引，带给他们明确的方向感。
4.设置相关推荐促成更多的销售
5.减少操作步骤
6.从众效应
从众心理是网上购物人群的普遍状态。
底部
联系方式站点地图版权信息附加导航（联系我们关于我们。。。）以及服务专区。

附注

电子商城
个人中心最初体现注册登录以及购物车订单信息收藏信息
注册信息按钮
1.让用户在心理上认同
2.鼓动人们采取行动 “免费获得”“免费注册”“免费试用”
个人中心的构成
表单页的填写
1.有效的说服用户进行填写
首先，告知用户为什么要填单s

系统模式

1.  B/S模式
即browser/server（浏览器/服务器）结构，是随着Internet技术兴起出现的，
在这种结构下，用户完全
2.  CS模式
即client/server（客户机/服务器）结构
是大家熟知的软件系统体系结构需要安装客户端才可进行管理操作，开发比较容易，操作简便；可以监顾局域网或者互联网使用，视觉个性化较强。