-
Notifications
You must be signed in to change notification settings - Fork 1.8k
/
index.html
140 lines (137 loc) · 5.83 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Udacity A11y</title>
<!-- Mobile -->
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>Udacity A11y Course TOC</h1>
<ul>
<li>
<span>Lesson 01: Overview</span>
<ul>
<li>Experiencing a screen reader: <a href="lesson1-overview/06-experiencing-screen-reader/">Exercise</a>
</ul>
</li>
<li>
<span>Lesson 02: Focus</span>
<ul>
<li>
Experiencing Focus: <a href="lesson2-focus/01-basic-form">Solution</a>
</li>
<li>
Focusable elements in wrong DOM order:
<a href="lesson2-focus/02-dom-order">Problem</a> |
<a href="lesson2-focus/02-dom-order/solution/index.html">Solution</a>
</li>
<li>
Offscreen content:
<a href="lesson2-focus/04-offscreen-content">Problem</a> |
<a href="lesson2-focus/04-offscreen-content/solution/index.html">Solution</a>
</li>
<li>
Radio Group:
<a href="lesson2-focus/05-radio-group">Problem</a> |
<a href="lesson2-focus/05-radio-group/solution/index.html">Solution</a>
</li>
<li>
Modals and keyboard traps:
<a href="lesson2-focus/07-modals-and-keyboard-traps">Problem</a> |
<a href="lesson2-focus/07-modals-and-keyboard-traps/solution/index.html">Solution</a>
</li>
<li>
Manage focus yourself:
<a href="lesson2-focus/03-managing-focus">Problem</a> |
<a href="lesson2-focus/03-managing-focus/solution">Solution</a>
</li>
</ul>
</li>
<li>
<span>Lesson 03: Semantics, Built-in</span>
<ul>
<li>
<a href="lesson3-semantics-built-in/02-chromevox-lite">Exercise 02: Introducing ChromeVox lite</a>
</li>
<li>
<a href="lesson3-semantics-built-in/03-experience-screen-reader">Exercise 03: ChromeVox lite with unfamiliar form</a>
</li>
<li>
<a href="lesson3-semantics-built-in/05-writing-semantic-html">Exercise 05: Writing semantic HTML</a>
</li>
<li>Node 17: <a href="lesson3-semantics-built-in/17-text-alternatives/funion.html">Text alternatives</a>
<li>
Exercise 06: Labelling input elements:
<a href="lesson3-semantics-built-in/16-labelling-input-elements/index.html">(ChromeVox Lite version)</a> |
<a href="lesson3-semantics-built-in/16-labelling-input-elements/flight-booking.html">(Vanilla version)</a> |
Solution 1:
<a href="lesson3-semantics-built-in/16-labelling-input-elements/solution/index.html"> (ChromeVox Lite version)</a> |
<a href="lesson3-semantics-built-in/16-labelling-input-elements/solution/flight-booking.html"> (Vanilla version)</a> |
Solution 2:
<a href="lesson3-semantics-built-in/16-labelling-input-elements/solution2/index.html"> (ChromeVox Lite version)</a> |
<a href="lesson3-semantics-built-in/16-labelling-input-elements/solution2/flight-booking.html"> (Vanilla version)</a> |
</li>
</ul>
</li>
<li>
<span>Lesson 04: Semantics: navigating content</span>
<ul>
<li><a href="lesson4-semantics-navigating/03-navigating-by-headings/index.html">Exercise 01: Navigating by headings</a>
<li><a href="lesson4-semantics-navigating/08-link-text/index.html">Exercise 03: Link text</a> | <a href="lesson4-semantics-navigating/08-link-text/solution/index.html">Solution</a>
<li><a href="lesson4-semantics-navigating/10-landmarks/index.html">Exercise 04: Landmarks</a>
</ul>
</li>
<li>
<span>Lesson 05: Semantics: ARIA</span>
<ul>
<li><a href="lesson5-semantics-aria/02-why-aria/index.html">Video 02: Checkboxes</a>
<li>
Exercise: Checkboxes
<a href="lesson5-semantics-aria/03-first-steps/index.html">Problem</a> |
<a href="lesson5-semantics-aria/03-first-steps/solution/index.html">Solution</a>
</li>
<li>
Exercise: Radio group
<a href="lesson5-semantics-aria/06-radio-group/index.html">Problem</a> |
<a href="lesson5-semantics-aria/06-radio-group/solution/index.html">Solution</a>
</li>
<li>
Exercise: Combobox
<a href="lesson5-semantics-aria/13-combobox/index.html">Problem</a> |
<a href="lesson5-semantics-aria/13-combobox/solution/index.html">Solution</a>
</li>
<li>
Exercise: Dialog
<a href="lesson5-semantics-aria/21-dialog/index.html">Problem</a> |
<a href="lesson5-semantics-aria/21-dialog/solution/index.html">Solution</a>
</li>
</ul>
</li>
<li>
<span>Lesson 06: Styling</span>
<ul>
<li>
Focus styles:
<a href="lesson6-styling/01-focus-styles/index.html">Problem</a> |
<a href="lesson6-styling/01-focus-styles/solution/index.html">Solution</a>
</li>
<li>
Style ARIA states:
<a href="lesson6-styling/02-style-aria-states/index.html">Problem</a> |
<a href="lesson6-styling/02-style-aria-states/solution/index.html">Solution</a>
</li>
<li>
Contrast Audit:
<a href="lesson6-styling/03-contrast-audit/index.html">Problem</a> |
<a href="lesson6-styling/03-contrast-audit/solution/index.html">Solution</a>
</li>
<li>
Mobile Screenreader:
<a href="lesson6-styling/04-mobile-screenreader/index.html">Example</a>
</li>
</ul>
</li>
</ul>
</body>
</html>