当前位置:主页 > 计算机电子书 > 程序设计 > Web设计下载
渐进增强的Web设计

渐进增强的Web设计 PDF 高清版

  • 更新:2020-09-20
  • 大小:85.1 MB
  • 类别:Web设计
  • 作者:[美]Todd、[英]Patty、[英]
  • 出版:人民邮电出版社
  • 格式:PDF

  • 资源介绍
  • 相关推荐

渐进增强的Web设计》由全球著名Web设计公司Filament集团两位创始人和两位开发主力联手打造,其中Scott Jehl还是jQuery团队成员。四位作者具有多年的网站设计和开发经验,曾为网站、无线设备、Web应用设计过众多高度实用的用户界面,受到了高度赞扬。本书展示了如何利用渐进增强方法开发网站,从而获得最佳用户体验。本书既是理解渐进增强原则和益处的实用指南,也用详细的案例分析,目的是向设计师以及开发人员传授何时、何地以及如何采用体现渐进增强的具体编程和脚本技巧。

目录

  • 第一部分 测试驱动的渐进增强方法
  • 第1章 我们的方法  2
  • 1.1  测试浏览器能力  3
  • 1.2  规划渐进增强:X光透视  4
  • 1.3  从X光到实践:渐进增强开发的构成  5
  • 1.4  理论结合实践  6
  • 第2章 渐进增强实践:X光透视  7
  • 2.1  X光透视概述  7
  • 2.1.1  定义内容层级并将组件映射到HTML  8
  • 2.1.2  编写基础标记和尽可能少的安全样式  10
  • 2.1.3  应用标记、样式和脚本增强  11
  • 2.2  案例1:规划新闻网站的结构和组织方式  12
  • 2.2.1  评估内容组织和命名方式  12
  • 2.2.2  借助原生HTML层级功能实现内容组织  13
  • 2.2.3  构建导航  14
  • 2.2.4  处理分层和动画内容  15
  • 2.2.5  支持动态过滤和排序  16
  • 2.3  案例2:结账表单中的工作流、验证和数据提交  17
  • 2.3.1  解构结账表单设计  17
  • 2.3.2  标记表单以确保可访问性  23
  • 2.3.3  添加限制与验证  24
  • 2.3.4  组合基本和增强体验  25
  • 2.4  案例3:预算计算器里的交互数据可视化  25
  • 2.4.1  选择预算线组件的基本标记  26
  • 2.4.2  从基础标记开始创建可访问的滑块  28
  • 2.4.3  制作饼图  28
  • 2.5  案例4:支持功能完备浏览器应用程序的各种功能——照片管理器  30
  • 2.5.1  制作全局导航元素的标记  31
  • 2.5.2  支持专辑和多张照片的复杂交互  32
  • 2.5.3  创建自定义表单和叠加  37
  • 2.5.4  创建返回按钮支持  38
  • 2.6  在实践中运用X光的核对清单  39
  • 第3章 编写有意义的标记  40
  • 3.1  标记文本和图像  41
  • 3.1.1  用于标记有意义文本的元素  41
  • 3.1.2  列表  45
  • 3.1.3  表格式数据  46
  • 3.1.4  图像  48
  • 3.1.5  嵌入式富媒体  49
  • 3.1.6  嵌入外部网页内容  50
  • 3.2  标记交互内容  51
  • 3.2.1  锚链接  51
  • 3.2.2  表单结构  51
  • 3.2.3  表单控件  53
  • 3.3  创建页面环境  57
  • 3.3.1  了解何时该用块级元素或内联元素  58
  • 3.3.2  用ID和类标识元素  59
  • 3.3.3  用WAI-ARIA路标角色标识页面主要版块  60
  • 3.3.4  保持源代码顺序清晰易读  60
  • 3.3.5  使用title属性  62
  • 3.4  建立一张HTML文档  63
  • 3.4.1  DOCTYPE  64
  • 3.4.2  文档头  65
  • 3.5  加入可访问性  68
  • 3.5.1  可访问性指导原则和法律标准  69
  • 3.5.2  Web内容可访问性指南  70
  • 第4章 有效应用样式  71
  • 4.1  将样式应用到网页  71
  • 4.1.1  将样式保存在外部样式表里  71
  • 4.1.2  链接到外部样式表  72
  • 4.1.3  使用有意义的命名惯例  74
  • 4.2  为基本和增强体验添加样式  74
  • 4.2.1  基本体验里的安全样式  75
  • 4.2.2  为增强体验添加样式  76
  • 4.3  可访问性的考虑要点  77
  • 4.4  应对bug和浏览器差异  78
  • 4.4.1  条件注释  78
  • 4.4.2  常见问题和变通方法  79
  • 第5章 编写增强和交互脚本  83
  • 5.1  如何正确引用JavaScript  83
  • 5.1.1  避免内联JavaScript  83
  • 5.1.2  引用外部JavaScript  84
  • 5.2  理解JavaScript在基本体验里的位置  84
  • 5.3  脚本增强的最佳实践  85
  • 5.3.1  在内容就绪时运行脚本  85
  • 5.3.2  给标记应用行为  85
  • 5.3.3  用JavaScript构建增强标记  87
  • 5.3.4  管理内容可见性  89
  • 5.3.5  应用样式增强  90
  • 5.4  保持和增强可用性与可访问性  90
  • 5.4.1  实现键盘访问  91
  • 5.4.2  指派WAI-ARIA属性  92
  • 5.4.3  测试可访问性  93
  • 5.4.4  维持状态和“后退”按钮  93
  • 第6章 测试浏览器能力  95
  • 6.1  EnhanceJS:一套能力测试框架  95
  • 6.2  通过EnhanceJS应用增强  98
  • 6.3  配置EnhanceJS  100
  • 6.3.1  载入额外的样式表  101
  • 6.3.2  载入额外的脚本  102
  • 6.3.3  自定义体验切换链接  103
  • 6.3.4  强制通过或不通过EnhanceJS测试  104
  • 6.4  扩展EnhanceJS测试套件  105
  • 6.4.1  用EnhanceJS选项修改测试套件  105
  • 6.4.2  创建EnhanceJS的新实例或多个实例  105
  • 6.4.3  为调试开启能力测试警告  106
  • 6.5  在服务器上优化EnhanceJS  107
  • 第二部分 渐进增强实战
  • 第7章 用渐进增强方法构建组件  110
  • 7.1  组件是如何编写的  110
  • 7.2  在组件各章里导航  111
  • 7.3  可下载的范例代码  112
  • 第8章 可折叠内容  113
  • 8.1  X光透视  113
  • 8.2  创建可访问的可折叠内容  115
  • 8.2.1  基础标记和样式  115
  • 8.2.2  增强标记和样式  116
  • 8.2.3  实现可折叠的增强脚本  119
  • 8.3  使用可折叠脚本  121
  • 第9章 标签页  122
  • 9.1  X光透视  122
  • 9.2  创建标签页  124
  • 9.2.1  基础标记和样式  124
  • 9.2.2  增强标记和样式  126
  • 9.2.3  标签页脚本  130
  • 9.3  让标签页更进一步  132
  • 9.3.1  书签和历史(后退按钮)追踪  132
  • 9.3.2  自动轮换的标签页  135
  • 9.3.3  引用外部标签内容  136
  • 9.3.4  将标签页显示为手风琴组件  136
  • 9.4  使用标签页脚本  136
  • 第10章 工具提示  138
  • 10.1  X光透视  138
  • 10.2  用title内容创建工具提示  142
  • 10.2.1  基础标记和样式  142
  • 10.2.2  增强标记和样式  143
  • 10.2.3  工具提示增强脚本  145
  • 10.3  用锚链接创建工具提示  146
  • 10.4  用外部来源创建工具提示  148
  • 10.5  使用工具提示脚本  150
  • 第11章 树形控件  151
  • 11.1  X光透视  151
  • 11.2  创建树形控件  154
  • 11.2.1  基础标记和样式  154
  • 11.2.2  增强标记和样式  156
  • 11.2.3  树形控件增强脚本  159
  • 11.3  使用树形控件脚本  165
  • 第12章 HTML5 canvas图表  167
  • 12.1  X光透视  168
  • 12.2  基础标记  169
  • 12.3  创建可访问的图表  172
  • 12.3.1  解析表格数据  172
  • 12.3.2  用canvas实现数据可视化  176
  • 12.3.3  添加表格增强样式  183
  • 12.3.4  保持数据的可访问性  184
  • 12.4  让canvas图表更进一步:visualize.js插件  186
  • 第13章 对话框和叠加层  189
  • 13.1  X光透视  190
  • 13.2  创建对话框  191
  • 13.2.1  基础标记和样式  191
  • 13.2.2  增强标记和样式  193
  • 13.2.3  对话框增强脚本  198
  • 13.3  让对话框更进一步  202
  • 13.4  使用对话框脚本  202
  • 第14章 按钮  206
  • 14.1  X光透视  206
  • 14.2  给基于input的按钮添加样式  208
  • 14.2.1  基础标记和样式  208
  • 14.2.2  增强标记和样式  210
  • 14.2.3  悬停状态增强脚本  213
  • 14.3  创建带有复杂视觉格式的按钮  214
  • 14.3.1  基础标记和样式  215
  • 14.3.2  增强标记和样式  215
  • 14.3.3  input转button增强脚本  216
  • 14.4  使用input转button脚本  219
  • 14.5  让按钮更进一步  219
  • 第15章 复选框、单选按钮和星级评分  221
  • 15.1  X光透视  222
  • 15.2  创建自定义复选框  224
  • 15.2.1  基础标记  224
  • 15.2.2  增强标记和样式  225
  • 15.2.3  复选框脚本  228
  • 15.3  创建自定义单选按钮  230
  • 15.3.1  基础标记  230
  • 15.3.2  增强标记和样式  231
  • 15.3.3  单选按钮脚本  233
  • 15.4  让自定义input更进一步:星级评分组件  235
  • 15.4.1  基础标记  236
  • 15.4.2  增强标记和样式  237
  • 15.4.3  编写星级评分组件脚本  238
  • 15.5  使用自定义input和星级评分脚本  241
  • 第16章 滑块  242
  • 16.1  X光透视  242
  • 16.2  创建滑块  246
  • 16.2.1  基础标记和样式  246
  • 16.2.2  增强标记和样式  247
  • 16.2.3  滑块脚本  252
  • 16.3  使用滑块脚本  257
  • 第17章 下拉菜单  260
  • 17.1  X光透视  260
  • 17.2  创建可访问的自定义下拉菜单  262
  • 17.2.1  基础标记和样式  262
  • 17.2.2  增强标记和样式  263
  • 17.2.3  自定义下拉菜单增强脚本  270
  • 17.3  让自定义下拉菜单更进一步:给选项添加高级样式  277
  • 17.4  使用自定义下拉菜单脚本  279
  • 第18章 列表生成器  281
  • 18.1  X光透视  281
  • 18.2  创建列表生成器  283
  • 18.2.1  基础标记和样式  283
  • 18.2.2  增强标记和样式  284
  • 18.2.3  列表生成器脚本  287
  • 18.3  让列表生成器更进一步:多项选择、排序、自动完成和上下文菜单  292
  • 18.3.1  多项选择  292
  • 18.3.2  拖放排序  292
  • 18.3.3  自动完成  293
  • 18.3.4  上下文菜单  293
  • 18.4  使用列表生成器脚本  293
  • 第19章 文件输入控件  295
  • 19.1  X光透视  296
  • 19.2  创建自定义的文件输入控件  298
  • 19.2.1  基础标记和样式  298
  • 19.2.2  增强标记和样式  299
  • 19.2.3  自定义文件输入控件的脚本  302
  • 19.3  使用自定义文件输入控件脚本  304
  • 放眼未来  306

资源下载

资源下载地址1:https://pan.baidu.com/s/1Jmjq-0nQV4BYg6oqSDpEJw

网友留言