Photoshop网站UI设计

前言
第1章 网站UI概述 1
1.1 初识网站UI 2
1.1.1 什么是网页界面 2
1.1.2 网页界面的分类 2
1.1.3 网页界面的设计特点 4
· · · · · · (更多)

前言
第1章 网站UI概述 1
1.1 初识网站UI 2
1.1.1 什么是网页界面 2
1.1.2 网页界面的分类 2
1.1.3 网页界面的设计特点 4
1.2 网站UI设计原则 7
1.2.1 视觉美观 7
1.2.2 主题突出 8
1.2.3 整体性 8
1.2.4 为用户考虑 9
1.2.5 快速加载 10
1.3 网页的构成元素 10
1.3.1 文字 11
1.3.2 图像 11
1.3.3 超链接 12
1.3.4 多媒体 12
1.4 网页UI中的扁平化 13
1.4.1 图标 14
1.4.2 折角 14
1.4.3 圆角 15
1.4.4 徽章 15
1.4.5 条纹 16
1.4.6 标签 16
1.4.7 装饰元素 17
1.4.8 装饰背景 17
1.5 移动端与PC端网页UI的区别 17
1.5.1 精确度不同 17
1.5.2 位置不同 18
1.5.3 操作习惯不同 18
1.5.4 按钮状态不同 18
1.6 网页设计命名规范 18
1.7 专家支招 20
1.7.1 网站建设流程 20
1.7.2 什么是虚拟主机 20
1.8 总结扩展 21
1.8.1 本章小结 21
1.8.2 举一反三—排列网页小图标 21
========================================================
第2章 Photoshop基本操作 23
2.1 什么是Photoshop 24
2.2 Photoshop的安装和启动界面 24
实例：Photoshop的安装和启动 24
2.3 Photoshop中的基本操作 26
2.3.1 新建文档 26
2.3.2 打开文件 27
2.3.3 保存文件 29
实例：制作精美的网页图标 30
2.3.4 文件的置入和导入 33
2.3.5 修改图像大小 34
2.3.6 修改画布大小 35
实例：调整网页尺寸 35
2.4 图像的复制与粘贴 37
2.4.1 图像的复制 37
实例：制作精美网页 38
2.4.2 图像的拷贝与粘贴 40
实例：制作网页插图 40
2.4.3 选择性粘贴 41
实例：制作网页展板 42
2.5 图像的裁剪 43
2.5.1 固定尺寸裁剪 43
2.5.2 利用辅助线裁剪 44
2.5.3 透视裁剪 44
2.6 图像的变换 45
2.6.1 移动图像 45
2.6.2 缩放图像 46
2.6.3 旋转图像 46
2.6.4 变形和透视 46
2.6.5 自由变换 47
实例：为网页制作广告插图 47
2.7 还原与恢复操作 49
2.7.1 还原与重做 49
2.7.2 前进一步与后退一步 49
2.7.3 恢复文件 49
2.8 专家支招 50
2.8.1 什么是矢量图像和位图图像 50
2.8.2 分辨率 50
2.9 总结扩展 51
2.9.1 本章小结 51
2.9.2 举一反三—制作简单的网页按钮 51
========================================================
第3章 网站页面UI配色 52
3.1 色彩的基础知识 53
3.1.1 三原色 53
3.1.2 色彩视觉 54
3.1.3 色彩三要素 55
3.1.4 色彩的种类 57
3.1.5 色系 58
3.2 色彩在网页视觉设计中的作用 59
3.2.1 突出网页主题 59
3.2.2 划分视觉区域 60
3.2.3 吸引浏览者目光 60
3.2.4 增强网页艺术性 61
3.3 色彩的联想作用与心理效果 61
3.3.1 色彩的冷暖 62
3.3.2 色彩的软硬 63
3.3.3 色彩的大小 63
3.3.4 色彩的轻重 63
3.3.5 色彩的活泼和端庄 64
3.3.6 色彩的兴奋和沉稳感 64
3.3.7 色彩的华丽和朴素感 65
3.4 网页配色标准 65
3.4.1 Web安全色 65
3.4.2 使用Web安全色调色板 66
3.5 色彩中的功能角色 67
3.5.1 主色 67
3.5.2 背景色 67
3.5.3 辅助色 67
3.5.4 点缀色 68
3.6 网页配色技巧 68
3.6.1 配色原则 69
实例：制作简约网站主页 71
3.6.2 确定网页主题色 75
3.6.3 确定网页文本配色 75
实例：制作公司宣传主页 76
3.7 网页风格影响配色 83
3.7.1 冷暖配色 83
3.7.2 白色的应用 84
3.7.3 饱和度影响配色 84
3.8 影响配色的元素 85
3.8.1 根据行业特征选择网页配色 85
3.8.2 根据色彩联想选择网页配色 86
3.8.3 根据受众的色彩偏好选择网页配色 87
3.8.4 根据生命周期选择网页配色 89
3.9 专家支招 91
3.9.1 怎样提高对色彩的敏感度 91
3.9.2 什么是色立体 91
3.10 总结扩展 92
3.10.1 本章小结 92
3.10.2 举一反三—制作水族馆网站主页 92
========================================================
第4章 网站页面布局与版式设计 94
4.1 了解网页布局 95
4.1.1 网页布局的目的 95
4.1.2 网页布局的操作顺序 95
4.2 PC端常见的网页布局方式 96
4.2.1 “国”字型 96
4.2.2 T字型 97
4.2.3 标题正文型 97
4.2.4 左右分割型 98
4.2.5 上下分割型 98
4.2.6 POP型 98
4.2.7 封面型 99
实例：制作画展网站首页 99
4.2.8 Flash型 106
4.3 移动端网页布局方式 107
4.3.1 布局的类型 107
4.3.2 布局的实现方式 108
4.3.3 响应式布局 109
4.3.4 响应式布局的优缺点 112
4.4 网页布局方法 112
4.4.1 网页布局设计 112
4.4.2 网页布局特征 113
4.4.3 网页布局原则 114
实例：制作蛋糕店主页——顶部 115
实例：制作蛋糕店主页——主体 121
4.5 根据整体内容决定网页布局 127
4.5.1 左侧的页面布局 127
4.5.2 水平居中的页面布局 128
· · · · · · (收起)