-
Notifications
You must be signed in to change notification settings - Fork 27
/
index.html
340 lines (285 loc) · 27.5 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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>WAI-Adapt Explainer</title>
<meta charset="utf-8"/>
<script src="https://www.w3.org/Tools/respec/respec-w3c" class="remove"></script>
<script src="common/biblio.js" class="remove"></script>
<script src="respec-config.js" class="remove"></script>
</head>
<body>
<section id="abstract">
<p>People have very different needs. There are many people with cognitive and learning disabilities that affect their ability to interact with the web. Some people cannot process numeric information (dyscalculia), but others understand numbers better than words. Some people with severe language disabilities use symbols to represent words; some people need (or want) simplified user-interfaces. Different people find different layouts and types of content easier to understand, and what is useable and understandable by one person can be be too complex for another. The WAI-Adapt Task Force seeks to address these varied and conflicting user needs, so that content can be made more understandable to individual users based on their unique requirements. The various WAI-Adapt specification modules described in this Explainer provide various means for web technologies to address these requirements.</p>
<p>The various WAI-Adapt module specifications enable authors to selectively add semantic information about content to enable content and interface personalization for individual users. In turn this facilitates user-agents for people with learning and cognitive disabilities.</p>
<p>WAI-Adapt technologies allow authors to add additional semantic information using a collection of new attributes and values, with (in most cases) a fixed token list (taxonomies). This document provides an explanation for understanding how the WAI-Adapt attributes can be used to personalize a more accessible web site.</p>
</section>
<section id="sotd"></section>
<section id="introduction">
<h1>Introduction</h1>
<p>The WAI-Adapt specification modules:</p>
<ul>
<li>Expands upon the types of accessibility information that the author can provide;</li>
<li>Facilitate preference-driven individual personalization;</li>
<li>Enable the author to specify key semantics to support users with cognitive impairments;</li>
<li>Define a syntax for adaptable content such as: links, buttons, symbols, help, and keyboard shortcuts.
</ul>
<p>Personalization involves tailoring aspects of the user experience to meet the preferences or needs of individual users. For example, having familiar terms and symbols is critical for effective use of web content for many as described in the user scenarios and use cases published in the <a href="https://www.w3.org/TR/coga-usable/">Making Content Usable (for COGA people)</a>. However what is familiar to one user will inevitably be new and foreign to another. Personalization based on WAI-Adapt AAC symbol support technologies supports loading a set of symbols that is appropriate for the specific user, ensuring that each user is presented with familiar symbols.</p>
<p>Technology holds the promise of being extremely flexible and the design of many systems includes the expectation that users can optimize their interaction experience according to their personal preferences or accessibility needs. </p>
<section class="section" id="why_accessibility">
<h2>Why We Need WAI-Adapt</h2>
<p>WAI-Adapt will allow assitive technology to: </p>
<ol>
<li>adapt to and meet the user's needs. Users who have difficulty with established, mainstream patterns can interact with interfaces modified to their preferences and abilities. </li>
<li>modify levels of complexity as people's skills improve or decline over time. For example, extra support may be critical for some people but distracting for others.</li>
<li>provide better support to users who require:
<ul>
<li>familiar and consistent symbols, iconography, and graphics </li>
<li>tooltips or similar on-demand help or clues</li>
<li>language they understand</li>
<li>fewer or more constrained features</li>
<li>clearer distinction between native and third-party content</li>
<li>custom keyboard shortcuts</li>
</ul>
</li>
</ol>
<p>To achieve this, we need standardized terms and supportive syntax. These can be linked to associated symbols, terms, translations and explanations. This allows modifications based on an individual's personal preferences.</p>
<div class="example"><p>Example of sending an email:</p>
<p>An author programmatically identifies that a button sends an email. Based on user preference settings the interface can be modified to:</p>
<ul>
<li>render the button with an alternative term, and/or furnish an additional tooltip that is understandable by the individual user;</li>
<li>include F1 help that explains the send function in simple terms;</li>
<li>associate the button with a keyboard shortcut that is always used for send (Submit);</li>
<li>identify the button as important and always rendered in an emphasized form.</li>
</ul></div>
</section>
<section>
<h2>Use Case Examples</h2>
<p><a href="requirements/">Requirements for WAI-Adapt</a> elaborates many use cases that further contextualize the above summary of user needs. These example use cases form the basis of requirements for this technology. WAI-Adapt enables developers to create targeted extensions as additional use cases are encountered.</p>
<p>Examples</p>
<ul>
<li><a href="#distracted">Easily Distracted / Overwhelmed</a></li>
<li><a href="#difficulty_numbers">Difficulty Understanding Numbers</a></li>
<li><a href="#learning_disability">Mild-Moderate Language Impairment / Learning Disability</a></li>
<li><a href="#language_impairment">Severe Language Impairment</a></li>
<li><a href="#memory_impairment">Working Memory and Short-term Memory Impairment</a></li>
</ul>
<section class="section" id="distracted">
<h3>Easily Distracted / Overwhelmed</h3>
<p>Someone who is either easily distracted or can be easily overwhelmed with too much information on a web page needs the ability to simplify the page. They want just the critical information, and need anything that is not integral to the understanding and use of the page suppressed.</p>
<div class="example"><p>Example: The user wants to get the latest weather report for their city and goes to a weather website.</p>
<p>Finding the actual weather forecast is actually a little challenging even if you have no disabilities due to all the additional content on the screen; along with advertisements, there is also the day's top stories, trending news, and social media to cognitively filter. If you are easily overwhelmed or distracted getting the key information about today's weather is a challenge. Having the ability to personalize and prioritize all but the key information (i.e. just the weather forecast for my city) is critical for this user.</p></div>
<p>In this example, the author can mark the <code><section></code>, <code><p></code>, or <code><div></code> that contains the actual weather report and any associated tools to manipulate the weather report (i.e. city search, hourly vs. 5 day forecast, etc.) with the <code>adapt-simplification</code> attribute (with a value of "critical"), and mark the other on-screen content as "medium" (default) or "low". (e.g. <code><p adapt-simplification="critical"></code><em>Today’s forecast is a high of 95° and a low of 40°</em><code></p></code>)
<p>For websites which rely on advertising revenue, it may be undesirable to completely suppress advertisements. We envision that this attribute could also facilitate relocating the most critical sections of a website above anything that is a lower priority. (i.e. Content re-ordering)</p>
</section>
<p>WAI-Adapt recognizes that appropriate simplification will often be task determined. A complex page will often support multiple tasks each of which could be critical to the user requiring simplification at different times. We propose to investigate how we might facilitate users defining what task is critical to them in the moment rather than pre-determining what is primary or secondary in advance.</p>
<section class="section" id="difficulty_numbers">
<h3>Difficulty Understanding Numbers</h3>
<p>Someone who has dyscalculia will have difficulty understanding numbers and will have a hard time interacting with websites that use numbers to convey information. Therefore, critical numeric information must be provided in an alternative format that the user can understand.</p>
<div class="example"><p>Example: The user wants to get the latest weather report for their city and goes to a weather website.</p>
<p> For today’s forecast, it shows a high of 95° and a low of 40°. This representation is not understandable for particular user. Presenting this numeric information as a symbol or text would benefit the user. For example, next to the number 95, there could be:</p>
<ul>
<li>a picture of someone wearing shorts and a tee-shirt with the sun above or </li>
<li>simply a text alternative of “Very warm”. </li>
</ul>
<p>Next to the number 40, there can be: </p>
<ul>
<li>a picture of someone wearing a jacket with pants, or </li>
<li>a text alternative of “Very cold”. </li>
</ul>
<p>Next to the humidity index of 90%, there could be a text alternative of “muggy”.</p>
</div>
<p>In this example, the author would mark up the numbers using the <code>adapt-numberfree</code> attribute. The default would show the numeric value. Those needing an alternative representation for numbers, would get an associated image or description/values as simplified text instead.</p>
<p>It is important to note that people with dyscalculia are often very good with words, so long text can be better than short numbers.</p>
</section>
<section class="section" id="learning_disability">
<h3>Mild-Moderate Language Impairment / Learning Disability</h3>
<p>Those who have a moderate Language Impairment / Learning Disability may have a limited vocabulary. They will only know terms that are in the core vocabulary they have learned. They may also use symbols to represent words and concepts.</p>
<div class="example"><p>Example: The user may know the word "name" or "last name" but not recognize the term "family name" or "surname" as cognates.</p><p> For some users, learning new terms is a very slow process, requiring hours of work. For these users, reading web content may also be a very slow process, so that finding the information desired on some particular web page can present a laborious barrier. The ability to personalize a web page and present symbols instead, or alongside content can help some users better and more promptly understand the content being provided</p></div>
<p>Note that some people with language disabilities are good at numbers. They will want a long string of text replaced with a short number: <code><span <strong>adapt-easylang="90% of the time this happens"</strong>> normally this is the expected outcome</span></code>. This is the opposite of the numberfree example.</p>
<p>Additionally, because reading content for some users is extremely time-consuming, they may also want less content and fewer features on a given web page.<p>
</section>
<section class="section" id="language_impairment">
<h3>Severe Language Impairment</h3>
<p>Some users with a severe speech and/or physical impairment may communicate using symbols, rather than written text, as part of an Augmentative and Alternative Communication (AAC) system. The use of symbols to represent words is their primary means of communication when both consuming and producing information. Symbol users face a wide variety of barriers to accessing web content, but one of the main challenges is a lack of standard inter-operability between different proprietary symbol sets, or a mechanism for translating the same concept from one symbol set to another.</p>
<p>User Stories include:</p>
<ul>
<li>An assisted living home authors adult education courses and life-skills content, for example, how to make dinner using a microwave. Within their core user-base, users are accustomed to different symbol sets. The authors want to create content for all users across various symbol sets.</li>
<li>A large banking site wants people to be as autonomous as possible while using their services. They provide augmented symbol references onto their core services. They need a mechanism to programmatically support multiple symbol sets within the code. </li>
<li>People who know different symbol sets wish to talk to each other.</li>
<li>A government agency creating information sheets about human rights and patient rights are seeking feedback from impacted users. They add symbols from a common symbol set to support a majority of different users. The agency would prefer to use a common symbol reference to support people who use or require different symbols. This allows all symbol set users to both read and edit the content. </li>
</ul>
<div class="example"><p>Example: Using the <code>adapt-symbol</code> attribute, an author programmatically tags the label for a form input with the appropriate symbol value. Based on user preference settings, a browser helper application or stand-alone tool could then render that label using an appropriate symbol, alternative term, and/or furnishes an additional tool-tip that is understandable by the individual user. Using the <a href="https://www.blissymbolics.org/">Bliss Symbolics</a> set's unique reference numbers as our 'taxonomy', other symbol sets can map their equivalent symbols against the Bliss set.</p>
<code>
<label for="address" <strong>adapt-symbol="14885"</strong>>Your Principal Residence</label> <br>
<input type="textarea" id="address" adapt-purpose="street-address">
</code>
<p>Where the symbol value 14855 maps back to "Home".</p>
</div>
<h4>Proof of Concept: Symbol Example</h4>
<p>In the screen shots below, a browser extension uses the <code>adapt-symbol</code> attribute to load symbols that are familiar to the user.</p>
<p>Note that users learn a specific symbol vocabulary. However, the various symbol vocabularies are mutually unintelligible: users familiar with one set of symbols may not be familiar with or understand an alternative set. WAI-Adapt's <code>adapt-symbol</code> attribute offers a mechanism to translate between symbol sets, to allow people to communicate with one another where it was previously not possible.</p>
<figure>
<img src="https://user-images.githubusercontent.com/8376341/79741687-5b20a880-830a-11ea-814d-97ed7132d7d1.png" alt="screen shot, no symbols" style="height:95%; width:95%">
<figcaption>The original page</figcaption>
</figure>
<figure>
<img src="https://user-images.githubusercontent.com/8376341/79741694-5cea6c00-830a-11ea-80f6-6c7b632a451d.png" alt="screen shot with less content and symbols" style="height:95%; width:95%">
<figcaption>The same page loaded, but the user-agent has removed content and added symbols</figcaption>
</figure>
<figure>
<img src="https://user-images.githubusercontent.com/8376341/79741698-5d830280-830a-11ea-9976-f7816c4748be.png" alt="screen shot with different symbols (bliss)" style="height:95%; width:95%">
<figcaption>The same page loaded, but the user-agent has removed content and added different symbols that this user is more familiar with</figcaption>
</figure>
</section>
<section class="section" id="memory_impairment">
<h3>Working Memory and Short-term Memory Impairment</h3>
<p>Users may have differences in both working and short-term memory. For some users the number of items that can be held in working memory is a fraction of the amount most users can hold in memory. Whereas most adults can repeat about seven digits in correct order, some users may only manage two or three digits. When these users become distracted, they are also likely to forget any information in their working memory.</p>
<div class="example"><p>Example: Many processes consist of a sequence of separate steps or actions which must be performed by a user to complete a process or workflow.</p><p>Users need to remember completed tasks in order to identify their location in a process. In addition, a user must be able to navigate to completed tasks to make modifications or corrections.</p></div>
<p>A step indicator allows an author to define steps within a process or represent an entire user path outside of the context of a defined process. This includes turning steps between defined processes into breadcrumbs or linked steps that identify completed tasks. This allows the user to navigate back to completed steps and identify a user's current location in a path.</p>
<p>More information on personas and user needs can be found in <a href="https://www.w3.org/TR/coga-usable/" rel="nofollow">Making Content Usable for People with Cognitive and Learning Disabilities</a>.</p>
</section>
</section>
<section>
<h2>Out of Scope</h2>
<p>While the intention of this work is to introduce a new set of attributes to support WAI-Adapt, the following work items are out of scope:</p>
<ul>
<li>Develop an API for browsers or other user-agents</li>
<li>Develop or produce supporting technology (browser extension, stand-alone software, etc.)</li>
<li>Develop or produce an authoring tool to support the new attributes</li>
<li>Produce a symbol set for <code>adapt-symbol</code></li>
</ul>
<p>We encourage a the development of these items and a list of implementations can be found on <a href="https://github.com/w3c/adapt/wiki">our wiki</a>.</p>
</section>
</section>
<section >
<h2>Modules</h2>
<p>WAI-Adapt specifications will be published as individual modules. How many modules will eventually be created is unclear at the time of this writing. However, each module specification
will include use cases and vocabularies. At this time only one specification module is advancing toward Candidate Recommendation status at W3C:</p>
<ul>
<li><a href="symbols/index.html">WAI-Adapt: Symbols Module:</a>
<p>This module provides vocabularies that enable user-agents to augment or adapt content to allow authors to support AAC symbols.</p></li></ul>
<p>Additional modules, some available in early drafts, may include:</P>
<ul><li>
<p>Use-cases and vocabularies for identifying the purpose of controls, symbols and user interface elements, and supports simplification and avoiding distractions.</p></li>
<li><a href="help/index.html">WAI-Adapt: Help and Support Module:</a>
<p>The first working draft of this module is now available.</p>
<p>This module addresses adding information about the content to enable help scaffolding and additional support for different user scenarios.</p></li>
<li><a href="tools/index.html">WAI-Adapt: Tools Module:</a>
<p>The first working draft of this module is now available.</p>
<p>This module addresses adding information about the content to enable user-agents and extensions to provide additional support to the user. One example is adaptable breadcrumbs.</p></li>
</ul>
</section>
<section id="characteristics_semanticproperties">
<h1>Vocabulary Structure</h1>
<p>WAI-Adapt is made of a vocabulary of properties and their values. This generic structure makes it possible to apply WAI-Adapt in a variety of contexts by adapting how the vocabulary is instantiated. The <a href="#vocabulary-implementations">Vocabulary Implementations</a> section below describes current ways to use the vocabulary.</p>
<section>
<h2>Properties</h2>
<p>Properties are the main units of WAI-Adapt types supported by the vocabulary. A given property supports a specific type of WAI-Adapt. That property would only be used once on a given piece of content, but multiple different properties could be used on the same piece of content to address different needs.</p>
</section>
<section id="propcharacteristic_value">
<h2>Values</h2>
<p>Values provide the specific WAI-Adapt information for the property. The possible values for each property are elaborated in the definition of the property in the modules. Some properties require the value to come from a predefined list of possible values, others can accept arbitrary strings, and some may accept multiple values. The attribute value may be one of the following types:</p>
<dl>
<dt id="valuetype_idref">ID reference</dt>
<dd>Reference to the ID of another element in the same document</dd>
<dt id="valuetype_idref_list">ID reference list</dt>
<dd>A list of one or more ID references.</dd>
<dt id="valuetype_integer">integer</dt>
<dd>A numerical value without a fractional component.</dd>
<dt id="valuetype_number">number</dt>
<dd>Any real numerical value.</dd>
<dt id="valuetype_string">string</dt>
<dd>Unconstrained value type.</dd>
<dt id="valuetype_token">token</dt>
<dd>One of a limited set of allowed values.</dd>
<dt id="valuetype_token_list">token list</dt>
<dd>A list of one or more tokens.</dd>
<dt id="valuetype_uri">URI</dt>
<dd>A Uniform Resource Identifier as defined by <cite><a href="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a></cite> [[RFC3986]]. It may reference a separate document, or a content fragment identifier in a separate document, or a content fragment identifier within the same document.</dd>
</dl>
<div class="note">The attributes and values in this specification are not intended to overide the semantics exposed in the Accessibility Tree, but rather augment them. In the case of conflict between an element's semantics and the attribute values, validation algorithms should issue a warning but not an error.</div>
</section>
</section>
<section>
<h1>Vocabulary Implementations</h1>
<section class="section">
<h2>Current Usage</h2>
<p>This publication of the WAI-Adapt provides several <em>key-value pairs</em> (attribute = value). These attributes include but are not limited to:</p>
<ul>
<li><a href="symbols/#action-explanation">adapt-action</a></li>
<li><a href="symbols/#destination-explanation">adapt-destination</a></li>
<li><a href="symbols/#purpose-explanation">adapt-purpose</a></li>
<li><a href="symbols/#symbol-explanation">adapt-symbol</a></li>
</ul>
<p>Other properties exist or will be developed as the modules mature.</p>
</section>
<section class="section">
<h2>Technology Comparison Summary</h2>
<p>The task force reviewed various vocabulary options before deciding upon the use of the HTML attribute syntax. The list of technologies included:</p>
<ul>
<li><a href="https://www.w3.org/TR/rdfa-lite/">RDFa Lite</a></li>
<li><a href="https://www.w3.org/TR/microdata/">HTML Microdata</a></li>
<li>Additional ARIA attributes (e.g. <code>aria-action</code>)</li>
<li>AUI-prefixed attributes: a new, WAI-Adapt specific set of attributes (e.g. <code>aui-action</code>)</li>
<li>A new single attribute, purpose, to encode both properties and values</li>
<li>A new single attribute with properties and values encoded using inline css syntax of key/value pairs</li>
<li>An extension of the above single attribute using CSS key/value pairs and simple text content</li>
<li>Three new attributes for token, value, and URI, respectively</li>
<li>Value pairs - a WAI-Adapt type attribute and an associated value attribute. </li>
<li>Negotiate new WAI-Adapt attributes into native host languages</li>
<li>Embed WAI-Adapt data via JavaScript Object Notation (JSON)</li>
<li>Use of the existing data- attribute mechanism of HTML</li>
</ul>
<h3>Considerations in the decision process:</h3>
<dl>
<dt>Authoring</dt>
<dd>ease of authoring and potential ambiguity between WAI-Adapt and existing features;</dd>
<dt>User-Agents</dt>
<dd>ease of determining and parsing the properties & values and the ability to implement as an extension;</dd>
<dt>Host Languages</dt>
<dd>requirement for special host language support, works in multiple languages, integrates with ARIA and HTML, easy extension of the vocabulary, and needed number of new features;</dd>
<dt>Functionality</dt>
<dd>necessity of multiple properties and interaction between properties, integration with other vocabularies, likely search engine support for content alternatives, and typed value support;</dd>
<dt>Strategy</dt>
<dd>avoid segregation of accessibility from other features, provide a clear path to join with other W3C WAI-Adapt efforts, and stable enough to avoid modification of authored content over time;</dd>
</dl>
<p>The details of our research and discussion are documented on the <a href="https://github.com/w3c/adapt/wiki/Comparison-of-ways-to-use-vocabulary-in-content">Comparison of ways to use vocabulary in content</a> and <a href="https://github.com/w3c/adapt/wiki/Prototypes-with-data-dash-*-(Take-2)">Prototypes with data dash</a> pages in our Wiki. </p>
</section>
</section>
<section>
<h2>Stakeholders</h2>
<p>
This document is useful for:
</p>
<ul>
<li>Content creators who want to accommodate as many users as possible, including AAC users, and people with learning & cognitive disabilities.</li>
<li>Content creators who want to create adaptable content that meets the users' preferred experience</li>
<li>Technology developers and providers who want to build technologies that enable more people to use the web effectively</li>
<li>Developers of symbol languages and related technologies </li>
<li>Students who wish to develop a new software project that meets a real need</li>
<li>Policy makers who want to understand what is possible for inclusion</li>
</ul>
<p>For early implementations of content we suggest including a link to an <a href="https://github.com/w3c/adapt/wiki/Implementations-of-Semantics">extension implementation</a> that can maximize the benefit for users.</p>
</section>
<!--
<section class="appendix" id="changelog">
<h2>Change Log</h2>
<section>
<h2>Substantive changes since the <a href="@@">last public working draft</a></h2>
<ul>
<li>@@</li>
<!- EdNote: After each WD publish, move contents of this list into the next one below. ->
</ul>
</section>
<section>
<h2>Other substantive changes since the <a href="@@">First Public Working Draft</a></h2>
<ul>
<li>@@</li>
<!- EdNote: After each WD publish, move previous list into this one. ->
</ul>
</section>
</section>
-->
<div data-include="common/acknowledgements.html" data-oninclude="fixIncludes" data-include-replace="true">Acknowledgements placeholder</div>
</body>
</html>