具体描述
本书循序渐进地介绍了HTML 5网页设计的基础知识和技能,提供了大量的HTML 5应用实例供读者实践,并清晰阐述代码如何工作方式及作用,使读者能在最短的时间内掌握HTML 5的应用技能。
全书共分20章,分别介绍HTML 5基本概念、HTML 5中的新增元素、认识网页和网站、HTML 5中的文档结构、HTML 5中的文本和图像、使用HTML 5建立超链接、使用HTML 5建立表格、使用HTML 5建立表单、使用HTML 5绘制图像、HTML 5中的音频和视频、如何在HTML 5获取地理位置、Web通信新技术、本地存储技术、线程处理技术、构造离线Web应用程序、使用CSS3修饰网页样式、JavaScript快速入门和HTML 5、CSS3和JavaScript的搭配应用等,最后通过开发两个综合案例——企业门户网站和HTML 5游戏,使读者进一步巩固所学的知识,提高综合实战能力。
本书适合HTML 5网页设计初学者、网站设计人员和网站开发人员使用。
作者简介
目录信息
1.1 HTML 5简介 1
1.1.1 HTML 1
1.1.2 HTML 5 2
1.1.3 HTML 5文件的基本结构 3
1.2 HTML 5文件的编写方法 3
1.2.1 手工编写HTML 5 4
1.2.2 使用HTML编辑器 5
1.3 使用浏览器查看HTML 5文件 9
1.3.1 与HTML 5兼容的浏览器 9
1.3.2 查看页面效果 9
1.3.3 查看源文件 10
1.4 问题解答 11
第2章 HTML 5中的新增元素 12
2.1 新增的主体结构元素 12
2.1.1 section元素 12
2.1.2 article元素 13
2.1.3 aside元素 16
2.1.4 nav元素 18
2.1.5 time元素 21
2.2 新增的非主体结构元素 22
2.2.1 header元素 22
2.2.2 hgroup元素 24
2.2.3 footer元素 25
2.2.4 figure元素 28
2.2.5 address元素 30
2.3 新增其他常用元素 32
2.3.1 mark元素 32
2.3.2 rp、rt与ruby元素 33
2.3.3 progress元素 34
2.3.4 command元素 35
2.3.5 embed元素 36
2.3.6 details与summary元素 37
2.3.7 datalist元素 38
2.4 新增全局属性 39
2.4.1 contenteditable属性 39
2.4.2 spellcheck属性 40
2.4.3 tabIndex属性 41
2.5 新增的其他属性 42
2.5.1 表单相关的属性 42
2.5.2 链接相关属性 51
2.5.3 其他属性 53
2.6 废除的属性 53
2.7 问题解答 55
第3章 认识网页与网站 56
3.1 网站的基本概念 56
3.1.1 什么是网页 56
3.1.2 什么是网站 56
3.2 网页基本构成元素 57
3.3 网页设计 58
3.3.1 网页设计概述 58
3.3.2 网页设计特点 59
3.3.3 网页设计相关术语 62
3.3.4 网页设计原则 63
3.3.5 网页设计的成功要素 65
3.3.6 网页设计风格及色彩搭配 66
3.4 网页设计师应具备的素质 67
3.4.1 艺术素质 68
3.4.2 技能素质 68
3.4.3 综合素质 68
3.5 网站制作流程 69
3.5.1 前期策划 69
3.5.2 页面细化及实施 69
3.5.3 网站上传 69
3.5.4 后期维护 70
3.6 综合实例——搜集网页素材 71
3.7 问题解答 72
第4章 HTML 5中的文档结构 74
4.1 Web标准 74
4.1.1 Web标准概述 74
4.1.2 Web标准规定的内容 75
4.2 HTML 5文档的基本结构 76
4.2.1 HTML 5结构 76
4.2.2 文档类型说明 77
4.2.3 HTML 5标记 77
4.2.4 头标记 77
4.2.5 网页的主体标记 80
4.2.6 页面注释标记 81
4.3 综合实例——符合W3C标准的HTML 5网页 82
4.4 问题解答 83
第5章 HTML 5中的文本和图像 84
5.1 添加文本 84
5.1.1 普通文本 84
5.1.2 特殊字符文本 84
5.1.3 文本特殊样式 86
5.2 排版文本 88
5.2.1 段落标记与换行标记 88
5.2.2 标题标记 91
5.3 建立文本列表 92
5.3.1 建立无序列表 92
5.3.2 建立有序列表 93
5.3.3 建立不同类型的无序列表 94
5.3.4 建立不同类型的有序列表 96
5.3.5 嵌套列表 96
5.3.6 自定义列表 97
5.4 添加图像 98
5.4.1 网页支持的图片格式 98
5.4.2 在网页中使用路径 99
5.4.3 在网页中插入图像 101
5.5 编辑图像 102
5.5.1 设置图像的宽度和高度 102
5.5.2 设置图像的提示文字 103
5.5.3 设置图片为网页背景 104
5.5.4 排列图像 105
5.6 综合实例——图文并茂的房屋装饰装修网页 106
5.7 问题解答 107
第6章 使用HTML 5建立超链接 109
6.1 URL 109
6.1.1 URL的格式 109
6.1.2 URL的类型 110
6.2 创建超链接 111
6.2.1 设置文本和图片的超链接 111
6.2.2 设置超链接指向的目标类型 112
6.2.3 用新窗口显示超链接页面 115
6.2.4 如何链接到同一页面的不同位置 116
6.3 创建热点区域 118
6.4 创建浮动框架 118
6.5 综合实例——用Dreamweaver精确定位热点区域 120
6.6 问题解答 122
第7章 使用HTML 5创建表格 124
7.1 表格的基本结构 124
7.2 表格的基本操作 126
7.2.1 创建表格 126
7.2.2 定义表格的边框类型 128
7.2.3 定义表格的表头 129
7.2.4 设置表格背景 131
7.2.5 设置单元格背景 132
7.2.6 合并单元格 133
7.2.7 排列单元格中的内容 138
7.2.8 设置单元格的行高与列宽 139
7.3 完整的表格标记 140
7.4 综合实例——制作计算机报价表 142
7.5 问题解答 145
第8章 使用HTML 5创建表单 146
8.1 表单概述 146
8.2 表单基本元素的使用 147
8.2.1 单行文本输入框 147
8.2.2 多行文本输入框 148
8.2.3 密码域 149
8.2.4 单选按钮 150
8.2.5 复选框 151
8.2.6 下拉选择框 152
8.2.7 普通按钮 153
8.2.8 提交按钮 154
8.2.9 重置按钮 155
8.3 表单高级元素的使用 156
8.3.1 url属性 157
8.3.2 email属性 157
8.3.3 date和time 158
8.3.4 number属性 160
8.3.5 range属性 161
8.3.6 required属性 162
8.4 综合实例——创建用户反馈表单 163
8.5 问题解答 164
第9章 使用HTML 5绘制图形 166
9.1 canvas概述 166
9.1.1 添加canvas元素 166
9.1.2 绘制矩形 167
9.2 绘制基本形状 168
9.2.1 绘制圆形 168
9.2.2 使用moveTo与lineTo绘制直线 169
9.2.3 使用bezierCurveTo绘制贝济埃曲线 171
9.3 绘制渐变图形 173
9.3.1 绘制线性渐变 173
9.3.2 绘制径向渐变 175
9.4 绘制变形图形 176
9.4.1 变换原点坐标 176
9.4.2 图形缩放 178
9.4.3 旋转图形 179
9.5 图形组合 180
9.6 绘制带阴影的图形 182
9.7 使用图像 184
9.7.1 绘制图像 184
9.7.2 图像平铺 185
9.7.3 图像裁剪 187
9.7.4 像素处理 189
9.8 绘制文字 191
9.9 图形的保存与恢复 193
9.9.1 保存与恢复状态 193
9.9.2 保存文件 194
9.9.3 绘制图形综合应用 195
9.10 综合实例——绘制火柴棒人物 197
9.11 问题解答 201
第10章 HTML 5中的音频和视频 202
10.1 audio标签 202
10.1.1 audio标签概述 202
10.1.2 audio标签的属性 203
10.1.3 音频解码器 204
10.1.4 浏览器对audio标签的支持情况 204
10.2 video标签 204
10.2.1 video标签概述 204
10.2.2 video标签的属性 205
10.2.3 视频解码器 206
10.2.4 浏览器对video标签的支持情况 206
10.3 问题解答 207
第11章 获取地理位置 208
11.1 用Geolocation API获取地理位置 208
11.1.1 地理定位的原理 208
11.1.2 获取定位信息的方法 208
11.1.3 常用地理定位方法 209
11.1.4 如何判断浏览器是否支持HTML 5获取地理位置信息 209
11.1.5 指定纬度和经度坐标 210
11.2 浏览器对地理定位的支持情况 214
11.3 综合实例——在网页中调用Google地图 214
11.4 问题解答 217
第12章 Web通信新技术 218
12.1 跨文档消息传输 218
12.1.1 跨文档消息传输的基本知识 218
12.1.2 跨文档通信应用测试 218
12.2 Web Sockets API 221
12.2.1 什么是WebSocket API 221
12.2.2 Web Sockets通信基础 221
12.2.3 在服务器端使用Web Sockets API 223
12.2.4 在客户端使用Web Sockets API 227
12.3 综合实例——编写简单的Web Socket服务器 227
12.4 问题解答 232
第13章 本地存储技术 233
13.1 认识Web 存储 233
13.3.1 本地存储和Cookie的区别 233
13.3.2 Web存储方法 233
13.2 HTML 5 Web Storage API 234
13.2.1 测试浏览器的支持情况 234
13.2.2 sessionStorage方法 235
13.2.3 localStorage 方法 237
13.2.4 Web Storage API的其他操作 238
13.3 在本地建立数据库 242
13.3.1 本地数据库概述 243
13.3.2 用executeSql来执行查询 243
13.3.3 使用transaction方法处理事件 243
13.4 浏览器对Web存储的支持情况 244
13.5 综合实例——制作简单Web留言本 244
13.6 问题解答 248
第14章 线程处理技术 249
14.1 Web Workers 249
14.1.1 Web Workers 概述 249
14.1.2 线程中常用的变量、函数与类 250
14.1.3 与线程进行数据的交互 250
14.2 线程嵌套 253
14.2.1 单线程嵌套 253
14.2.2 多个子线程中的数据交互 256
14.3 综合实例——创建Web Worker计数器 258
14.4 问题解答 259
第15章 构建离线Web应用程序 260
15.1 HTML 5离线应用程序 260
15.1.1 本地缓存 260
15.1.2 本地缓存与浏览器网页缓存的区别 260
15.1.3 支持离线行为 260
15.2 了解Manifest(清单)文件 261
15.3 了解applicationcache API 262
15.4 浏览器对Web离线应用的支持情况 264
15.5 综合实例——离线定位跟踪 264
15.6 问题解答 270
第16章 HTML 5的拖放功能 271
16.1 一个简单的拖放实例 271
16.2 分析拖放的实现过程 273
16.3 浏览器对拖放功能的支持情况 274
16.4 综合实例1——在网页中拖放文字 274
16.5 综合实例2——在网页中来回拖放图片 277
16.6 问题解答 278
第17章 HTML 5服务器发送事件 279
17.1 服务器发送事件概述 279
17.2 服务器发送事件的实现过程 279
17.2.1 检测浏览器是否支持Server-Sent Event 279
17.2.2 EventSource 对象 280
17.2.3 服务器端代码 280
17.3 综合实例——向服务器端发送事件 281
17.4 问题解答 283
第18章 HTML 5、CSS3和 JavaScript搭配应用 284
18.1 综合实例1——打字效果的文字 284
18.2 综合实例2——文字升降特效 286
18.3 综合实例3——跑马灯效果 288
18.4 综合实例4——闪烁图片 291
18.5 综合实例5——左右移动的图片 293
18.6 综合实例6——向上滚动菜单 295
18.7 综合实例7——跟随鼠标移动的图片 297
18.8 综合实例8——树形菜单 299
18.9 综合实例9——时钟特效 305
18.10 综合实例10——颜色选择器 308
18.11 问题解答 310
第19章 综合实战——企业门户网站 312
19.1 构思布局 312
19.1.1 设计分析 312
19.1.2 排版架构 313
19.2 模块分割 314
19.2.1 Logo与导航菜单 314
19.2.2 左侧文本介绍 316
19.2.3 右侧导航链接 318
19.2.4 版权信息 320
19.3 整体调整 321
19.4 问题解答 322
第20章 综合实战——HTML 5游戏 323
20.1 游戏概述 323
20.2 游戏需求分析 324
20.3 HTML 5、CSS和JavaScript搭配实现 325
20.3.1 基本的HTML 5结构和标记 325
20.3.2 使用CSS修改页面 326
20.3.3 JavaScript编程 328
· · · · · · (收起)
读后感
用户评价
这本书《精通HTML5网页设计》的质量超乎我的想象。作者的专业知识毋庸置疑,而且善于将复杂的技术概念转化为易于理解的语言。我特别欣赏书中关于无障碍设计的讲解。它让我意识到,设计一个优秀的网站,不仅仅是追求视觉上的华丽,更重要的是要让所有用户,无论他们的身体状况如何,都能方便地访问和使用。书中关于ARIA属性的介绍,让我能够为我的网页添加更多有意义的语义信息,从而更好地支持屏幕阅读器等辅助技术。 我还从书中学习到了很多关于HTML5多媒体技术的知识,比如如何使用 `<audio>` 和 `<video>` 标签来嵌入音视频内容,以及如何使用JavaScript来控制它们的播放。书中的示例代码非常实用,我能够很快地将学到的知识应用到我的项目中,并取得不错的效果。此外,我对书中关于Canvas的介绍也印象深刻,通过Canvas,我能够实现各种炫酷的图形和动画效果,让我的网页更加生动有趣。
我必须说,《精通HTML5网页设计》这本书是我近年来读过的最实用、最全面的一本网页设计书籍。作者的讲解风格非常清晰,一点也不枯燥。我尤其喜欢它关于无障碍设计(Accessibility)的章节,它让我意识到,设计一个网站不仅仅是为了视觉上的美观,更重要的是要让所有人都能方便地访问和使用。书中介绍了如何使用 ARIA 属性来增强屏幕阅读器对网页内容的理解,以及如何为图片添加有意义的 `alt` 文本,这些都是我之前容易忽视但又极其重要的细节。 此外,书中对HTML5新引入的语义化标签的讲解,真的让我豁然开朗。以前我总是随意地使用 `<div>` 和 `<span>` 来构建页面结构,看完这本书,我才明白 `<header>`, `<footer>`, `<main>`, `<aside>` 等标签的真正含义和作用。它们不仅让我的HTML代码更加清晰易读,也对搜索引擎优化(SEO)有着积极的影响。书中的例子也非常贴合实际,比如如何利用 `figure` 和 `figcaption` 来包裹图片及其说明,让内容组织更加规范。
我非常庆幸自己购买了《精通HTML5网页设计》这本书。作者的写作风格非常严谨,每一个概念都解释得清清楚楚,而且提供了大量的代码示例,让我能够边学边练。我尤其喜欢书中关于语义化标签的讲解,它让我明白,HTML不仅仅是标记内容,更是描述内容的结构和含义。通过合理地使用`<article>`, `<section>`, `<aside>` 等标签,我能够让我的网页更加符合语义,对SEO也更加友好。 书中关于表单的讲解也让我受益匪浅。我之前对表单的各种输入类型和验证方式感到困惑,但是这本书提供了一个非常系统化的讲解。从基本的文本输入框到文件上传,再到日期选择器和颜色选择器,作者都一一进行了介绍,并且提供了如何使用JavaScript来进行表单验证的示例。我还学会了如何使用 `<datalist>` 来提供输入建议,这大大提升了用户输入的效率。
《精通HTML5网页设计》这本书,绝对是我近期阅读过的最精彩的网页开发指南。作者的讲解深入浅出,既有理论高度,又不乏实践指导。我尤其喜欢书中关于HTML5表单增强功能的讲解,比如`<input type="date">`, `<input type="color">`, `<input type="range">` 等新类型的输入框,它们极大地简化了用户的输入过程,并提升了用户体验。 书中关于WebSockets的介绍也让我受益匪浅。它让我看到了构建实时交互应用的巨大潜力,例如在线聊天室、实时数据更新等。作者提供的代码示例清晰易懂,我能够很快地掌握WebSocket的基本用法。此外,我还从书中学习到了如何利用HTML5的File API来处理用户上传的文件,这为我实现更丰富的上传功能提供了基础。这本书真的让我对网页设计有了全新的认识。
自从我开始阅读《精通HTML5网页设计》,我的编程思维方式发生了很大的改变。这本书的讲解逻辑性非常强,循序渐进,让我能够从基础知识一步步深入到更高级的应用。我特别喜欢书中关于HTML5本地存储(Local Storage)和会话存储(Session Storage)的讲解,它们让我能够轻松地在浏览器端保存用户数据,从而实现更丰富的用户交互体验,比如记住用户的偏好设置,或者保存未完成的表单数据。 书中还详细介绍了HTML5的拖放API(Drag and Drop API),我通过学习这部分内容,成功地在我的一个项目中实现了一个文件上传的拖放功能,这极大地提升了用户的使用便捷度。而且,作者在讲解时,总是会给出多种实现方式,并分析它们的优缺点,这让我能够根据不同的需求选择最合适的方案。我对书中关于WebSockets的介绍也印象深刻,它为我打开了实时通信的大门,让我了解到如何构建能够与服务器进行双向通信的应用程序。
《精通HTML5网页设计》这本书,我只能用“惊艳”来形容。它不仅讲解了HTML5的基础知识,更重要的是,它教会了我如何去思考,如何去设计一个真正优秀的网页。我特别喜欢书中关于“移动优先”(Mobile First)的设计理念的阐述,这让我从一开始就关注用户在移动设备上的体验,而不是仅仅将桌面版网站缩小。书中提供的很多响应式布局的技巧,比如使用Flexbox和Grid布局,我都能够立刻应用到我的项目中,并且取得了非常好的效果。 书中的一些高级主题,例如Web Workers和Canvas,作者都用非常易于理解的方式进行了讲解。我之前一直觉得Canvas非常高深,但是看完这本书,我能够用简单的JavaScript代码在网页上绘制出精美的图表和动画。而且,作者还分享了一些关于性能优化的技巧,比如如何异步加载脚本,如何使用懒加载技术来优化图片加载,这些都对我日后的开发工作非常有帮助。
我必须坦白,在阅读《精通HTML5网页设计》之前,我对HTML5的了解仅限于皮毛。但是这本书,就像一位经验丰富的向导,一步步地带领我深入探索HTML5的广阔世界。我最喜欢它关于响应式设计的讲解,它彻底颠覆了我之前“为不同设备写不同代码”的旧观念。通过使用媒体查询和灵活的布局技术,我能够轻松地创建出能够适应各种屏幕尺寸的网页,无论是手机、平板还是桌面电脑,都能呈现出最佳的视觉效果。 书中关于Web Workers的介绍也让我眼前一亮。它让我了解到如何在不阻塞主线程的情况下执行耗时的JavaScript任务,这对于提升网页的响应速度和用户体验至关重要。我通过学习书中提供的示例,成功地在我的项目中实现了后台数据处理的功能,极大地提升了应用程序的流畅性。我还学到了如何使用HTML5的本地存储来缓存数据,这进一步优化了我的应用的性能。
《精通HTML5网页设计》这本书,我简直是爱不释手!从刚开始对网页设计一窍不通,到如今能够独立构建出令人眼前一亮的网站,这本书功不可没。它不像市面上那些泛泛而谈的教材,而是深入浅出,将HTML5的精髓一一剖析。我尤其喜欢它在讲解语义化标签时所举的那些贴近实际的例子,比如如何用`<article>`标签来包裹一篇博客文章,用`<nav>`标签来构建清晰的导航菜单,这些都让我瞬间明白了它们的重要性,而不仅仅是死记硬背。书中对于表单元素的讲解也异常详尽,从基本的`<input>`类型到更高级的`<datalist>`和`<keygen>`,都配有清晰的代码示例和效果演示,让我能够轻松掌握如何创建交互式的用户界面。 更让我惊喜的是,作者在书中并没有止步于HTML5的基础语法,而是花了大量篇幅介绍了如何将HTML5与CSS3结合,以及如何利用JavaScript增强网页的动态效果。比如,关于响应式设计的讲解,我第一次真正理解了媒体查询(Media Queries)的强大之处,能够根据不同的屏幕尺寸自动调整页面布局,让我的网站在手机、平板和电脑上都有着绝佳的浏览体验。书中关于HTML5 Canvas的教程也让我大开眼界,通过简单的JavaScript代码,就能在网页上绘制出各种复杂的图形和动画,这简直就像是拥有了一张无限可能的画板!
《精通HTML5网页设计》这本书,简直是网页开发者的福音!它的内容非常丰富,涵盖了HTML5的方方面面。我最喜欢的部分是关于离线应用和本地存储的讲解。这些技术让我能够构建出更具交互性的Web应用程序,即使在没有网络连接的情况下,用户也能够继续使用应用程序的部分功能,这对于提升用户体验至关重要。 书中关于Web Components的介绍也让我耳目一新。我之前对组件化开发的概念了解不多,但是通过这本书,我学会了如何创建可复用的自定义HTML元素,这在大型项目中能够极大地提高开发效率和代码的可维护性。而且,作者还提供了如何将HTML5与其他前端技术(如CSS3和JavaScript)结合使用的示例,这让我能够构建出功能更强大、用户体验更好的网页。
拿到《精通HTML5网页设计》这本书,我最大的感受就是它真的把“精通”这个词做到了。它不是那种让你匆匆翻完一遍就束之高阁的快餐式读物,而是更像一本值得反复研读的工具书和案头参考。我最欣赏的是作者对于每个知识点都进行了深度挖掘,比如在介绍HTML5的离线应用(Offline Applications)和Web Workers时,作者不仅给出了详细的代码实现,还深入分析了它们的应用场景和性能优化建议,这对于我这样有一定开发经验的读者来说,是非常宝贵的。 书中关于多媒体元素的讲解也十分到位,特别是 `<audio>` 和 `<video>` 标签的各种属性和事件,让我能够灵活地控制音视频的播放、暂停、音量以及加载状态等。而且,作者还花了不少篇幅讲解如何使用 `picture` 元素和 `srcset` 属性来提供不同分辨率的图片,这对于优化网页加载速度和提升用户体验至关重要。我还特别喜欢书中关于Web Components的章节,它让我对组件化开发有了更深刻的理解,知道如何创建可复用的自定义HTML元素,这在大型项目中能极大地提高开发效率。