网页设计 App界面设计

一、 网页设计

1. 什么是网站
   
2. 什么是网页
   
3. 首页和主页的区别
   
4. 网页的表现形式
   

二、 网页的板块结构

1. 网站LOGO
   
2. 导航条
   
3. 
4. 内容板块
5. 版尾或版权工具
   
   域尾包括：认证和备案；

1. 域名包括：.cn(国内域名)/.com（国际域名）；在万网可以买到（查找是否被注册），域名只能使用一次
2. 服务器：空间（在阿里云购买）
3. 网站命名：www.任意自己命名.com
4. 备案：国内域名必须备案；国际域名仅需认证（如下图）

5)站长之家可以查询网站流量

eg：

三、 网页的内容

1. 
2. 
3. 
4. 动画
5. 
6. 
7. 表单

四. 网页设计软件

1. 文本编辑器
2. 
3. ps
4. Fireworks

五、网页制作主要相关技术

六、 网站建设基本流程

七、 网页的版式设计

1. 布局：上下型结构，无框架局限式
2. 导航设计：一级导航栏+二级导航

八．网页的风格设计

1. 网页配色
   
   一种主调色+点情色

九.网站

1. 网站类型

1） 企业站（主要用于宣传和展示）
2） 门户类网站（如：新浪、搜狐等）以新闻信息为主
3） 商城类网站（如 淘宝，京东） 以商品为主
4） 行业类网站 （如政府网站等） 后三个属于功能型网站；第一个是展示型网站

2. 网站设计规范

1） 字号：12px——13px——14px(正文)；20px(标题)
2） 字体：微软雅黑、宋体（服务器自带的两种字体）
3） 尺寸：企业站（宽度：1200px_版心部分）；高度任意（根据内容而定）

eg:白色部分为版心

门户类网站，宽度为1004px,高度根据内容决定

4） 数据单位：px；
5） 最低分辨率：72px;

案例一——导航栏

1. 确定版心1200的位置 ；调出标尺ctrl+r;右键单击后选择像素，用矩形选框工具看着宽度拉出宽度1200px的矩形框，大概放至中间位置
2. 宋体-无 14px以上使用平滑
   微软雅黑-平滑
   
3. 唯品会案例中，上部未填充完整，使用矩形工具，按住ctrl+alt键可以将选中区域复制并移动
   
   
   
   

app界面设计

1. pc端 移动端
2. 界面
   
3. 移动端包括IOS 安卓
   ios
   
   1）ipone6 宽高：7501334px 分辨率：72px

2) 字体：华文黑体
3）字号：长文本（正文）：26px
图标尺寸 512512
4) 颜色值
Iponex
1）尺寸24361125像素
安卓
1）标签栏即主菜单栏；导航栏即菜单栏
2）设计尺寸：720*1280
3）
app页面设计案例

1. 圆角设计：矩形工具里的圆角工具，或者选择路径直接拉
   

在属性中点击链锁，可以调整单个圆角的半径

2. ctrl+回车，操作结束后选中
3. ctrl+alt+鼠标左键 复制相同框平移

工具复习

1. 磁吸，多边形为直线
2. 魔棒有颜色不同时不一定能全部选中，快速选择工具可以选中
3. 污点修复工具，填充为前景色；污点画笔工具：alt选中想要填充的部分后涂抹；修补工具-选中区域后向其他部分拖动
4. 笔刷一般不使用硬笔刷
   5.直接选择工具可以修改锚点所在的位置，移动工具可以移动，都是相对于矩形工具使用
   6.
   按住shift键选中两个图层，选择垂直居中
   案例2
5. 矩形圆角工具选中后选择路径，ctrl+回车选中后，新建图层，填充颜色
6. 按住shift移动可以水平