Close Banner

网站易用性

怀着同理心去开发

高级

大约 6 个礼拜

6小时每周 (按照自己的节奏)

由以下企业参与制作:
加入成千上万的全球学员

开始免费课程

加入课程
免费
可享受
课程视频
实战练习与参考项目指导
高级

大约 6 个礼拜

6小时每周 (按照自己的节奏)

由以下企业参与制作:
加入成千上万的全球学员

课程概述

在这门课程里,你将亲身体验如何使网络应用具有无障碍功能。你将理解用户何时需要无障碍功能,为何需要。然后你将深入学习“如何”实现无障碍性:使网页能够使用屏幕阅读器,并能控制输入焦点(即用制表符浏览表格时能突出显示相关内容)。你将了解对于网页来说,“语义学”和“语义标记”是什么意思,并添加 ARIA 标记以便使用各种辅助设备来浏览界面。最后,你将学习一些样式技巧,帮助视力受损的用户轻松可靠地浏览你的网页。

为什么学习这门课程?

并非所有用户都能毫无障碍地使用应用。无论是年龄受限、视力问题、听力问题、截肢或其他障碍,每个人都应不受限制地使用你的应用。这门课程将介绍为何要使网络应用具有无障碍性,以及如何实现。此外,无障碍网站对所有人来说,都更易于使用!

先修要求

学员应该了解 HTML、CSS 和 JavaScript。

查看使用优达学城的技术要求

你将学习什么内容?

项目

餐厅点评应用

你将开发一个餐厅点评应用,以易用性为重点。你将远程访问包含餐厅信息的 JSON 文件(包括名称、照片、地址、菜式和营业时间)以及包含每家餐厅评论信息的 JSON 文件(评论者名称、评论日期、五星评级和评语)。此评论应用必须包含应用标题及提供多个餐厅筛选选项的菜单(按菜式、位置等)。在查看某个餐厅时,在显示当前评论的同时还应提供一张表格供用户提交他们自己的评论。

学习计划

第 1 课:概述

在这课里,你将学习为何无障碍性很重要,会影响到哪些人。你还将首次阅读网络无障碍性指南(网络无障碍性倡议,简称 WAI),理解对于无障碍性来说,“POUR”是什么意思,并按照检查清单操作,使你自己的网站具有无障碍功能。

第 2 课:焦点

在这课里,你将学习如何创建使任何人都能使用键盘浏览的网页。首先,我们将介绍焦点概念(将对其触发键盘事件的网页元素),如何使元素可聚焦以及何时成为焦点,当用户使用键盘浏览网页时,按照何种顺序遍历可聚焦元素。你还将学习如何管理表格、自定义组件、弹出式窗口、隐藏内容中的焦点。

第 3 课:语义基础

在这课里,你将在键盘导航的基础上为无法使用标准用户界面的用户(例如看不见屏幕的用户)创建网页。这就需要辅助技术(例如屏幕阅读器)能获取足够的信息,以便呈现替代性 UI。你将使用屏幕阅读器尝试普通表格元素,并添加标记,使这些元素操作起来更方便。你将了解浏览器根据 DOM 构建的无障碍树。最后,你将学习如何使用内置的 HTML 功能使无障碍树准确地反映屏幕界面

第 4 课:高级语义知识

在这课里,你将深入了解屏幕阅读器体验,提高导航速度。你将学习如何排列标题和标签链接,以便屏幕阅读器用户能飞快地浏览你的网页!你还将学习如何在网页中调用“地标”以便进一步加快导航速度。(此外,这种“语义标记”还使标记更易阅读!)

第 5 课:语义 - ARIA

在这课里,你将不再使用原生 HTML 元素,而是构建自定义控件和互动操作。当然,这些控件和互动操作都需要具备无障碍性,这时候 ARIA (Accessible Rich Internet Applications) 就派上用场了。你将学习如何向自定义互动添加属性,使它们像原生元素一样具有无障碍性。你还将学习当用户与你的网页互动时,如何管理 JavaScript 中的这些属性。

第 6 课:样式

在这课里,你将学习无障碍性的第三大必要条件:样式。网页的样式需要能够突出显示焦点、指示 ARIA 状态、缩小和放大,并且只能看见某些颜色或具有对比视力的用户能够查看你的网页。你将学习如何使用 Chrome 无障碍性工具评估你的网页,纠正存在的任何样式问题,并且在设计时考虑到无障碍性。

讲师与合作伙伴

Alice Boxhall

Alice Boxhall

Alice 是 Google 的软件工程师,专门负责研究 Chrome 无障碍性。她尤其喜欢创建开发者工具来帮助开发者测试和调试无障碍功能,并寻找机会制定网络标准,从而改善网络的无障碍性现状。

Rob Dodson

Rob Dodson

Rob Dodson 是 Google 的技术推广工程师,主要负责网络组件和无障碍功能。他的使命是创建更完善的网站,帮助开发者打造绝佳的体验。你可以在YouTube 上看到他的系列视频“Polycasts”(每隔一周更新一次内容),或者在 robdodson.me 上找到他的博客。

Michael Wales

Michael Wales

Michael 是一名自学成才的全栈 Web 开发者和开源倡导者。在加入优达学城之前,他已有 10 年的工作经历,为世界上一些要求最严苛的情报组织开发机密应用。由于之前的工作性质,他目前仍拥有有效的绝密安全许可,除非你也有同等许可,否则关于他的信息我们只能告诉你这么多。他在业余时间喜欢打彩弹、玩视频游戏,以及花时间陪 3 个可爱的孩子玩耍。

官方微信公众号二维码

优达学城(Udacity)微信