响应式Web图形设计

响应式Web图形设计
分享
扫描下方二维码分享到微信
打开微信,点击右上角”+“,
使用”扫一扫“即可将网页分享到朋友圈。
作者: [美] ,
2014-04
版次: 1
ISBN: 9787115347763
定价: 49.00
装帧: 平装
开本: 16开
纸张: 胶版纸
页数: 226页
字数: 351千字
正文语种: 简体中文
7人买过
  •   网页中的图形设计是在线内容用户体验的关键,尤其是现在的用户会使用多种设备访问网页,如智能手机、平板电脑、笔记本电脑、桌面电脑,甚至是智能电视。《响应式Web图形设计》以创建响应式Web的角度,介绍了基础的HTML和CSS语法,并深入研究了响应式Web设计中色彩、布局、图像、排版、动画、视频和音频等方面的内容。
      《响应式Web图形设计》结构整、轻松易懂,能够帮助Web设计新手快速入门,并打下坚实的基础。   Christopher Schmitt,Heavision.com公司创始人,专注于新媒体、设计和出版。他在Web设计领域有着超过20年的经验,并著有广受好评的《HTML5经典实例》一书。 第1章 了解HTML 1
    1.1 为什么要学习HTML? 2
    1.1.1 HTML使得因特网更受欢迎 2
    1.1.2 学习HTML,更好地理解网页设计 2
    1.1.3 学习HTML很容易 2
    1.2 HTML编程基础 4
    1.2.1 文本编辑器 4
    1.2.2 文字处理软件不是文本编辑器 4
    1.2.3 用HTML编写代码 5
    1.3 构建网页 6
    1.3.1 指定DOCTYPE 6
    1.3.2 保存和查看页面 9
    1.4 布置页面内容 10
    1.4.1 HTML标题 10
    1.4.2 HTML文本标签 10
    1.4.3 为网站创建链接 12
    1.4.4 添加title属性 12
    1.4.5 网站的链接 13
    1.5 总结 15

    第2章 使用CSS设置样式 17
    2.1 CSS来帮忙 18
    2.2 初识样式 18
    2.2.1 声明 18
    2.2.2 选择器 19
    2.2.3 更多的CSS 选择器 19
    2.3 添加CSS格式 20
    2.3.1 链接到CSS 21
    2.3.2 内联样式 22
    2.4 块和行内格式化 23
    2.4.1 HTML的通用元素 24
    2.4.2 伪类和伪元素 25
    2.5 专门为IE写CSS 27
    2.6 常规流和定位 29
    2.6.1 静态文本流(static) 29
    2.6.2 固定定位(fixed) 29
    2.6.3 相对定位(relative) 29
    2.6.4 绝对定位(absolute) 30
    2.7 总结 33

    第3章 网页排版 35
    3.1 网页字体 36
    3.1.1 size属性和值 38
    3.1.2 那么,你应该使用什么测量值呢? 39
    3.1.3 粗细、样式、变形和修饰 40
    3.2 网页安全字体实践 42
    3.2.1 网页安全字体 42
    3.2.2 移动安全字体 43
    3.3 制作更好的字体栈 44
    3.4 网页中的“Real Fonts” 45
    3.4.1 @font-face属性 46
    3.4.2 生成嵌入文件 47
    3.4.3 免费字体 48
    3.4.4 商业字体 50
    3.5 总结 53

    第4章 网页设计中的挑战 55
    4.1 网络环境 56
    4.1.1 揭示浏览器问题 56
    4.1.2 使用测试页 58
    4.1.3 颜色 58
    4.1.4 屏幕和像素 59
    4.1.5 可访问性 59
    4.2 决定你的跨浏览器目标 61
    4.3 针对不同设备开发网站 65
    4.3.1 重置和标准化浏览器样式 65
    4.3.2 特殊前缀 67
    4.3.3 检验 68
    4.3.4 测试 70
    4.4 总结 71

    第5章 网页中的颜色 73
    5.1 网页颜色编码 74
    5.1.1 十六进制颜色标记 74
    5.1.2 重写HTML的默认颜色 74
    5.1.3 图像边框 75
    5.1.4 带透明度的CSS颜色 76
    5.2 颜色属性 76
    5.3 原色系统 77
    5.4 颜色组合 78
    5.5 构建配色方案 79
    5.5.1 寻找基色 79
    5.5.2 文化与颜色 81
    5.5.3 浏览颜色的启示 82
    5.5.4 构思方案 84
    5.6 一致的颜色 85
    5.6.1 校正颜色 86
    5.6.2 拾取颜色 86
    5.7 CSS颜色表 86
    5.8 总结 91

    第6章 网站图像 93
    6.1 位数的问题 94
    6.1.1 像素深度 94
    6.1.2 色调分离和抖动 94
    6.1.3 更多位意味着更多颜色 94
    6.1.4 为什么位深度如此重要? 95
    6.2 光栅图像格式 97
    6.2.1 GIF图像格式 97
    6.2.2 JPEG图像格式 98
    6.2.3 PNG图像格式 99
    6.3 图像压缩表 100
    6.4 SVG:网页中的矢量文件 106
    6.5 总结 107

    第7章 为网页创建图像 109
    7.1 使用Illustrator 110
    7.1.1 为网页设置工作区 110
    7.1.2 设置文档尺寸 111
    7.1.3 导出光栅图像 114
    7.1.4 使用Illustrator导出矢量图像 116
    7.2 使用Photoshop 117
    7.2.1 新建文档 117
    7.2.2 导出光栅图像 117
    7.3 管理Web图像文件 118
    7.4 减小文件尺寸 119
    7.4.1 压缩光栅图像 119
    7.4.2 使用HTTP压缩 120
    7.5 总结 123

    第8章 透明度和阴影 125
    8.1 使用GIF图像创造透明度 126
    8.1.1 杂边 127
    8.2 PNG半透明图像 128
    8.2.1 8位PNG 128
    8.2.2 24位PNG 129
    8.3 CSS透明度 129
    8.3.1 圆角 130
    8.3.2 图像蒙版 130
    8.3.3 元素透明 131
    8.3.4 背景色透明度 132
    8.3.5 文本阴影 132
    8.3.6 3D文本阴影 133
    8.3.7 盒阴影 133
    8.4 总结 135

    第9章 收藏夹图标和移动书签 137
    9.1 收藏夹图标在哪里 138
    9.2 收藏夹图标的图像格式 139
    9.3 将收藏夹图标插入到网站中 139
    9.3.1 为子网站设定收藏夹图标 139
    9.3.2 推广收藏夹图标 140
    9.4 为网页创建收藏夹图标 140
    9.5 移动书签 144
    9.5.1 文件格式 144
    9.5.2 命名规范 144
    9.5.3 自动图像处理 145
    9.5.4 插入图标 145
    9.6 混合收藏夹图标与移动书签 146
    9.7 总结 147

    第10章 列表和图标字体 149
    10.1 无序列表 150
    10.1.1 CSS项目符号图标 150
    10.1.2 插入定制图标 151
    10.2 定义列表 151
    10.3 有序列表 152
    10.3.1 改变顺序 153
    10.3.2 设置目录 153
    10.3.3 添加有序标记的另一种写法 154
    10.4 高效列表设计 156
    10.5 图标字体 158
    10.5.1 选择一种图标字体 159
    10.5.2 突出字符或者短语 160
    10.5.3 创建可点击的单独图标 161
    10.6 总结 163

    第11章 图像映射 165
    11.1 创造图像映射 166
    11.1.1 基础的手工编码 166
    11.1.2 使用Fireworks 168
    11.2 响应式图像映射 170
    11.3 总结 171

    第12章 页面布局 173
    12.1 CSS浮动 174
    12.1.1 float属性 174
    12.1.2 多重浮动 175
    12.1.3 clear属性 175
    12.2 浮动页面布局 176
    12.2.1 页面结构 176
    12.2.2 两栏流式布局 178
    12.2.3 两栏固定布局 179
    12.2.4 三栏流式布局 181
    12.2.5 三栏固定布局 182
    12.2.6 使用浮动布局的优缺点 184
    12.3 CSS框架 184
    12.3.1 网格系统 184
    12.3.2 最后看看框架 187
    12.4 响应式布局 188
    12.4.1 适应媒体查询 189
    12.4.2 流式布局 190
    12.4.3 文本回流 192
    12.4.4 媒体查询实战 193
    12.4.5 响应式框架 199
    12.5 总结 199

    第13章 响应Web设计中的图像 201
    13.1 缩放图像和媒体 202
    13.2 缩放图像带来的问题 202
    13.2.1 大尺寸图像 203
    13.2.2 更大尺寸的图像 203
    13.2.3 把网速考虑进来 204
    13.3 自适应图像解决方案 204
    13.3.1 另寻他法 204
    13.3.2 压缩Retina图像 205
    13.4 多图像解决方案 208
    13.4.1 picture元素 208
    13.4.2 srcset属性 209
    13.4.3 使用图像补丁脚本 210
    13.5 总结 217

    第14章 对齐图像 219
    14.1 图像与文本的对齐 220
    14.1.1 baseline 220
    14.1.2 text-bottom 220
    14.1.3 text-top 221
    14.1.4 top和bottom 221
    14.1.5 middle 222
    14.2 在浏览器窗口中居中图像 222
    14.2.1 使用CSS 设置背景 222
    14.2.2 仅用CSS 223
    14.2.3 幸亏有jQuery,我们不用把数字写死了 224
    14.3 在浏览器中伸展图像 225
    14.4 总结 226
  • 内容简介:
      网页中的图形设计是在线内容用户体验的关键,尤其是现在的用户会使用多种设备访问网页,如智能手机、平板电脑、笔记本电脑、桌面电脑,甚至是智能电视。《响应式Web图形设计》以创建响应式Web的角度,介绍了基础的HTML和CSS语法,并深入研究了响应式Web设计中色彩、布局、图像、排版、动画、视频和音频等方面的内容。
      《响应式Web图形设计》结构整、轻松易懂,能够帮助Web设计新手快速入门,并打下坚实的基础。
  • 作者简介:
      Christopher Schmitt,Heavision.com公司创始人,专注于新媒体、设计和出版。他在Web设计领域有着超过20年的经验,并著有广受好评的《HTML5经典实例》一书。
  • 目录:
    第1章 了解HTML 1
    1.1 为什么要学习HTML? 2
    1.1.1 HTML使得因特网更受欢迎 2
    1.1.2 学习HTML,更好地理解网页设计 2
    1.1.3 学习HTML很容易 2
    1.2 HTML编程基础 4
    1.2.1 文本编辑器 4
    1.2.2 文字处理软件不是文本编辑器 4
    1.2.3 用HTML编写代码 5
    1.3 构建网页 6
    1.3.1 指定DOCTYPE 6
    1.3.2 保存和查看页面 9
    1.4 布置页面内容 10
    1.4.1 HTML标题 10
    1.4.2 HTML文本标签 10
    1.4.3 为网站创建链接 12
    1.4.4 添加title属性 12
    1.4.5 网站的链接 13
    1.5 总结 15

    第2章 使用CSS设置样式 17
    2.1 CSS来帮忙 18
    2.2 初识样式 18
    2.2.1 声明 18
    2.2.2 选择器 19
    2.2.3 更多的CSS 选择器 19
    2.3 添加CSS格式 20
    2.3.1 链接到CSS 21
    2.3.2 内联样式 22
    2.4 块和行内格式化 23
    2.4.1 HTML的通用元素 24
    2.4.2 伪类和伪元素 25
    2.5 专门为IE写CSS 27
    2.6 常规流和定位 29
    2.6.1 静态文本流(static) 29
    2.6.2 固定定位(fixed) 29
    2.6.3 相对定位(relative) 29
    2.6.4 绝对定位(absolute) 30
    2.7 总结 33

    第3章 网页排版 35
    3.1 网页字体 36
    3.1.1 size属性和值 38
    3.1.2 那么,你应该使用什么测量值呢? 39
    3.1.3 粗细、样式、变形和修饰 40
    3.2 网页安全字体实践 42
    3.2.1 网页安全字体 42
    3.2.2 移动安全字体 43
    3.3 制作更好的字体栈 44
    3.4 网页中的“Real Fonts” 45
    3.4.1 @font-face属性 46
    3.4.2 生成嵌入文件 47
    3.4.3 免费字体 48
    3.4.4 商业字体 50
    3.5 总结 53

    第4章 网页设计中的挑战 55
    4.1 网络环境 56
    4.1.1 揭示浏览器问题 56
    4.1.2 使用测试页 58
    4.1.3 颜色 58
    4.1.4 屏幕和像素 59
    4.1.5 可访问性 59
    4.2 决定你的跨浏览器目标 61
    4.3 针对不同设备开发网站 65
    4.3.1 重置和标准化浏览器样式 65
    4.3.2 特殊前缀 67
    4.3.3 检验 68
    4.3.4 测试 70
    4.4 总结 71

    第5章 网页中的颜色 73
    5.1 网页颜色编码 74
    5.1.1 十六进制颜色标记 74
    5.1.2 重写HTML的默认颜色 74
    5.1.3 图像边框 75
    5.1.4 带透明度的CSS颜色 76
    5.2 颜色属性 76
    5.3 原色系统 77
    5.4 颜色组合 78
    5.5 构建配色方案 79
    5.5.1 寻找基色 79
    5.5.2 文化与颜色 81
    5.5.3 浏览颜色的启示 82
    5.5.4 构思方案 84
    5.6 一致的颜色 85
    5.6.1 校正颜色 86
    5.6.2 拾取颜色 86
    5.7 CSS颜色表 86
    5.8 总结 91

    第6章 网站图像 93
    6.1 位数的问题 94
    6.1.1 像素深度 94
    6.1.2 色调分离和抖动 94
    6.1.3 更多位意味着更多颜色 94
    6.1.4 为什么位深度如此重要? 95
    6.2 光栅图像格式 97
    6.2.1 GIF图像格式 97
    6.2.2 JPEG图像格式 98
    6.2.3 PNG图像格式 99
    6.3 图像压缩表 100
    6.4 SVG:网页中的矢量文件 106
    6.5 总结 107

    第7章 为网页创建图像 109
    7.1 使用Illustrator 110
    7.1.1 为网页设置工作区 110
    7.1.2 设置文档尺寸 111
    7.1.3 导出光栅图像 114
    7.1.4 使用Illustrator导出矢量图像 116
    7.2 使用Photoshop 117
    7.2.1 新建文档 117
    7.2.2 导出光栅图像 117
    7.3 管理Web图像文件 118
    7.4 减小文件尺寸 119
    7.4.1 压缩光栅图像 119
    7.4.2 使用HTTP压缩 120
    7.5 总结 123

    第8章 透明度和阴影 125
    8.1 使用GIF图像创造透明度 126
    8.1.1 杂边 127
    8.2 PNG半透明图像 128
    8.2.1 8位PNG 128
    8.2.2 24位PNG 129
    8.3 CSS透明度 129
    8.3.1 圆角 130
    8.3.2 图像蒙版 130
    8.3.3 元素透明 131
    8.3.4 背景色透明度 132
    8.3.5 文本阴影 132
    8.3.6 3D文本阴影 133
    8.3.7 盒阴影 133
    8.4 总结 135

    第9章 收藏夹图标和移动书签 137
    9.1 收藏夹图标在哪里 138
    9.2 收藏夹图标的图像格式 139
    9.3 将收藏夹图标插入到网站中 139
    9.3.1 为子网站设定收藏夹图标 139
    9.3.2 推广收藏夹图标 140
    9.4 为网页创建收藏夹图标 140
    9.5 移动书签 144
    9.5.1 文件格式 144
    9.5.2 命名规范 144
    9.5.3 自动图像处理 145
    9.5.4 插入图标 145
    9.6 混合收藏夹图标与移动书签 146
    9.7 总结 147

    第10章 列表和图标字体 149
    10.1 无序列表 150
    10.1.1 CSS项目符号图标 150
    10.1.2 插入定制图标 151
    10.2 定义列表 151
    10.3 有序列表 152
    10.3.1 改变顺序 153
    10.3.2 设置目录 153
    10.3.3 添加有序标记的另一种写法 154
    10.4 高效列表设计 156
    10.5 图标字体 158
    10.5.1 选择一种图标字体 159
    10.5.2 突出字符或者短语 160
    10.5.3 创建可点击的单独图标 161
    10.6 总结 163

    第11章 图像映射 165
    11.1 创造图像映射 166
    11.1.1 基础的手工编码 166
    11.1.2 使用Fireworks 168
    11.2 响应式图像映射 170
    11.3 总结 171

    第12章 页面布局 173
    12.1 CSS浮动 174
    12.1.1 float属性 174
    12.1.2 多重浮动 175
    12.1.3 clear属性 175
    12.2 浮动页面布局 176
    12.2.1 页面结构 176
    12.2.2 两栏流式布局 178
    12.2.3 两栏固定布局 179
    12.2.4 三栏流式布局 181
    12.2.5 三栏固定布局 182
    12.2.6 使用浮动布局的优缺点 184
    12.3 CSS框架 184
    12.3.1 网格系统 184
    12.3.2 最后看看框架 187
    12.4 响应式布局 188
    12.4.1 适应媒体查询 189
    12.4.2 流式布局 190
    12.4.3 文本回流 192
    12.4.4 媒体查询实战 193
    12.4.5 响应式框架 199
    12.5 总结 199

    第13章 响应Web设计中的图像 201
    13.1 缩放图像和媒体 202
    13.2 缩放图像带来的问题 202
    13.2.1 大尺寸图像 203
    13.2.2 更大尺寸的图像 203
    13.2.3 把网速考虑进来 204
    13.3 自适应图像解决方案 204
    13.3.1 另寻他法 204
    13.3.2 压缩Retina图像 205
    13.4 多图像解决方案 208
    13.4.1 picture元素 208
    13.4.2 srcset属性 209
    13.4.3 使用图像补丁脚本 210
    13.5 总结 217

    第14章 对齐图像 219
    14.1 图像与文本的对齐 220
    14.1.1 baseline 220
    14.1.2 text-bottom 220
    14.1.3 text-top 221
    14.1.4 top和bottom 221
    14.1.5 middle 222
    14.2 在浏览器窗口中居中图像 222
    14.2.1 使用CSS 设置背景 222
    14.2.2 仅用CSS 223
    14.2.3 幸亏有jQuery,我们不用把数字写死了 224
    14.3 在浏览器中伸展图像 225
    14.4 总结 226
查看详情
您可能感兴趣 / 更多
响应式Web图形设计
无辜者的谎言(相信我!看到结局你一定会头皮发麻;全美读者推荐的悬疑神作,GOODREADS高分作品)
[美]A.R.托雷 著;梁颂宇 译;星文文化 出品
响应式Web图形设计
孩子,把你的手给我1:怎么说孩子才爱听,怎么教孩子才肯学?帮助每一位3-12岁孩子的父母结束与孩子的所有冲突!
[美]海姆·G.吉诺特
响应式Web图形设计
哲学、历史与僭政——重审施特劳斯与科耶夫之争
[美]弗罗斯特(Bryan-Paul Frost) 编;[美]伯恩斯(Timothy W. Burns)
响应式Web图形设计
怎样做成大事
[美]丹·加德纳(Dan Gardner) 著;贾拥民 译;湛庐文化 出品;[丹麦]傅以斌(Bent Flyvbjerg)
响应式Web图形设计
力量训练的科学基础与实践应用(第三版)
[美]弗拉基米尔· M.扎齐奥尔斯基;[美]威廉·J.克雷默;[美]安德鲁· C.弗赖伊
响应式Web图形设计
1200年希腊罗马神话
[美]伊迪丝·汉密尔顿
响应式Web图形设计
爱情心理学(新编本)
[美]罗伯特·J. 斯腾伯格 (美)凯琳·斯腾伯格 倪爱萍 译
响应式Web图形设计
黄金圈法则
[美]西蒙·斯涅克 著;磨铁文化 出品
响应式Web图形设计
最后一章
[美]厄尼·派尔
响应式Web图形设计
汤姆·索亚历险记 彩图注音版 一二三四年级5-6-7-8-9岁小学生课外阅读经典 儿童文学无障碍有声伴读世界名著童话故事
[美]马克 吐温
响应式Web图形设计
富兰克林自传 名家全译本 改变无数人命运的励志传奇 埃隆马斯克反复推荐 赠富兰克林签名照及精美插图
[美]本杰明·富兰克林 著;李自修 译
响应式Web图形设计
国际大奖图画书系列 共11册(小老鼠的恐惧的大书,大灰狼,红豆与菲比,别烦我,下雪了 ,穿靴子的猫 ,先有蛋,绿 ,特别快递,如果你想看鲸鱼 ,一个部落的孩子 ) 麦克米伦世纪
[美]莱恩·史密斯 (英)埃米莉·格雷维特 (美)劳拉·瓦卡罗·等/文 (英)埃米莉·格雷维特 等/图 彭懿 杨玲玲 阿甲 孙慧阳 白薇 译