forked from w3c/adapt
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexplainer.html
250 lines (217 loc) · 21.7 KB
/
explainer.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
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Personalization Semantics Explainer 1.0</title>
<meta charset="utf-8"/>
<script src="https://www.w3.org/Tools/respec/respec-w3c-common" class="remove"></script>
<script src="common/biblio.js" class="remove"></script>
<script src="respec-config.js" class="remove"></script>
<link href="common/css/common.css" rel="stylesheet" type="text/css" />
</head>
<body>
<section id="abstract">
<p>Personalization involves tailoring aspects of the user experience to meet the needs and preferences of the individual user. For example, having familiar terms and symbols is key to many users being able to use the web. However, what is familiar for one user may not be familiar to another, requiring them to learn new symbols. The challenge has been the ability to identify the types of content in a document that should be adapted to the preferred user experience. The introduction of standardized semantics allows web applications to customize the presentation of that content to one that is familiar to individuals based on their specific needs and preferences. This specification defines standard semantics to enable user driven personalization. For example, the association of user-preferred symbols with elements having those semantics. This ensures that users can quickly find familiar icons, for example, a help icon, within the context of user interface elements.</p>
<p>This document is an explanation for understanding how to use Personalization properties to personalize an accessible web site.</p>
</section>
<section id="sotd"></section>
<section class="informative" id="introduction">
<h1>Introduction</h1>
<p>The goals of this specification include:</p>
<ul>
<li> Expanding the accessibility information that may be supplied by the author;</li>
<li> Facilitate preference driven individual personalization;</li>
<li> Enable the author to specify key semantics needed to support users with cognitive impairments</li>
</ul>
<p>This is a proposal for defining syntax for adaptable content such as: links, buttons, symbols, help and keyboard. The proposed syntax will start by using the data-* mechanism provided by HTML5.</p>
<!--<p>Personalization involves tailoring aspects of the user experience to meet the preferences or needs of the user. For example, having familiar terms and symbols is key to being able to use the web. However what is familiar for one user may be new for another requiring them to learn new symbols. Personalization could include loading a set of symbols that is appropriate for the specific user, ensuring that all users find the icons simple and familiar.</p> -->
<p>Technology holds the promise of being extremely flexible and the design of many systems includes the expectation that users will be able to optimize their interaction experience according to their personal preferences or accessibility needs. </p>
<section class="section" id="why_accessibility">
<h2>Why We Need Personalization</h2>
<p>We need personalization because: </p>
<ul>
<li>The needs of an individual user may conflict with certain established mainstream user-patterns.</li>
<li>Learning new design patterns, widgets, and user interfaces can be confusing. The goal is to give users the ability to decide what works best for them based on preference and ability. Personalization enable websites to adapt to and meet the user's needs.</li>
<li>Extra support can be a distraction for people who do not need it, so a robust solution requires the ability to increase or decrease levels of complexity as people's skills improve or decline over time.</li>
<li>Ability to increase or decrease levels of complexity as people's skills improve or decline over time.</li>
<li>Enable websites to adapt to and meet the user's needs.</li>
</ul>
<p>Some users need extra support. This can include: </p>
<ul>
<li>Symbols, iconography and graphics that they are familiar with</li>
<li>Tooltips or similar on-demand help or clue</li>
<li>Language they understand</li>
<li>Fewer or more constrained features</li>
<li>The ability to programmatically distinguish between native content and third-party content on a page or screen</li>
<li>The ability to implement custom keyboard short cuts at the user-end</li>
</ul>
<p>To achieve this, we need standardized terms and supportive syntax. These can be linked to associated symbols, terms, translations and explanations. They are then provided to an individual based on personal preferences.</p>
</section>
<section>
<h2>Use Cases</h2>
<p><a href="requirements/">Requirements for Personalization Semantics</a> elaborates many use cases that further contextualize the above summary of user needs. These use cases form the basis of requirements for this technology.</p>
<p>Examples include:</p>
<p>Assuming an author can make it programmatically known that a button sends an email, and based on user preference settings:</p>
<ul>
<li>The button might then render as an alternative term, and/or furnish an additional tooltip that is understandable by the individual user.</li>
<li>It could automatically include F1 help that explains the send function in simple terms.</li>
<li>It could be identified with a keyboard shortcut that is always used for send (Submit).</li>
</ul>
<p>In addition, the button could be identified as important and always rendered or rendered in an emphasized form.</p>
<p>Another use-case is the use of Symbols. Some users might have a severe speech and/or physical impairment and 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 for both consuming and producing information.</p>
<p>Symbol users face a wide variety of barriers to accessing web content, but one of the main challenges is a lack of standard interoperability between different symbol-sets, or a mechanism for translating how a concept is represented in one symbol-set to how it may be represented in another symbol-set.</p>
<ul>
<li>An assisted living home authors adult education courses and life-skills content, for example, how to make dinner using a microwave. Even within their core user-base, different users are accustomed to different symbol-sets. The authors need to be able to create content for all their users. </li>
<li>A large banking site wants people to be as autonomous as possible while using their services. They have provided augmented symbol references onto their core services so that the user-interface can be rendered usable for users of symbol-sets, without specifying which symbol-set is being used: they need to programmatically support multiple symbol-sets.</li>
<li>People who know different symbol-sets wish to talk to each other. A government agency is making information sheets about human rights and patient rights and are seeking feedback from impacted users. They add symbols from a common symbol-set to support a majority of different users, but they wish to also support people who use or require different symbols, to enable them to both read the content, as well as edit it.</li>
</ul>
<p>It should be noted that users who depend on symbols for daily communication needs often also struggle the most with mistranslations, as they have severe language disabilities. Inferring what was meant by using an incorrect symbol will not be achievable for many users. This rules out relying on machine learning until it is almost error free.</p>
<p>In another use-case, a user has dyscalculia and has difficulty understanding numbers. They struggle with understanding websites that use numbers to convey information. For this reason, the numeric information must also be provided in an alternative format that the user can understand.</p>
<ul>
<li>The user wishes to get the latest weather report for their city and goes to an online weather site. For the day’s forecast, it shows a high of 95 ℉ and a low of 40 ℉, which is not helpful for this particular user. Allowing this numeric information to be presented instead as an image, symbol, or as written text would benefit the user (i.e. instead of 95 ℉, a picture of someone wearing shorts and a tee-shirt with the sun above or simply a text alternative of “Very warm”, and instead of 40 ℉ a picture of someone wearing a jacket with pants, or a text alternative of “Very cold”). </li>
</ul>
<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>
<p>Finally, consider someone with autistic spectrum disorder and with a learning disability. They may be a slow reader but find numbers clear and precise. They may go to the same website and find all the word and images unclear and the animations cause cognitive overload. They want the same information with more numbers and less words. </p>
<p>More examples can be found on <a href="https://github.com/w3c/personalization-semantics/wiki/Use-cases">Use-cases Wiki page</a>.</p>
<p>More information on persona and user needs can be found in <a href="https://www.w3.org/TR/coga-usable/">Coga usable document</a>.</p>
</section>
<section>
<h2>Out of Scope</h2>
<p>While the intention of this work is to introduce a new set of attributes to support Personalization, 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>data-symbol</code></li>
</ul>
<p>We encourage a the development of these items and a list of implementations can be found on our wiki.</p>
</section>
<section>
<h2>Technology Comparison Summary</h2>
<p>The task force reviewed various vocabulary options before deciding upon the use of the data- 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</li>
<li>AUI-* a new, personalization specific set of attributes</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 personalization type attribute and an associated value attribute. </li>
<li>Negotiate new personalization attributes into native host languages</li>
<li>Embed personalization data via JavaScript Object Notation (JSON)</li>
<li>Use of the existing data- attribute mechanism of HTML</li>
</ul>
<p></p>
<ul>
<li>Authoring - ease of authoring and potential ambiguity between personalization and existing features</li>
<li>User Agents - ease of determining and parsing the properties & values and the ability to implement as an extension</li>
<li>Host Languages - 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</li>
<li>Functionality - necessity of multiple properties and interaction between properties, integration with other vocabularies, likely search engine support for content alternatives, and typed value support</li>
<li>Strategy - avoid segregation of accessibility from other features, provide a clear path to join with other W3C personalization efforts, and stable enough to avoid modification of authored content over time</li>
</ul>
<p>The details of our research and discussion is documented on the <a href="https://github.com/w3c/personalization-semantics/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/personalization-semantics/wiki/Prototypes-with-data-dash-*-(Take-2)">Prototypes with data dash</a> pages in our Wiki. </p>
<p>
We presented some of these options at the TPAC 2018 Personalization Plenary Day presentation and provided a working example using the data- attribute to add personalization features. The data- solution was recommended by representatives of several working groups attending our presentation and discussions. See the <a href="https://w3c.github.io/personalization-semantics/#vocabulary-implementations">Vocabulary Implementations section in the Explainer document</a> for further details on the use of data- attributes.
</p>
</section>
</section>
<section class="section informative" >
<h2>Modules</h2>
<p>This specification has been divided into modules. </p>
<p>Each module has use cases and vocabularies: </p>
<ul>
<li><a href="content/index.html">Adaptable Content:</a>
<p>This section provides vocabularies that enable user agents to augment or adapt content to the user scenario and helps the user use and understand the content.</p>
<p>It includes 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">Adaptable Help and Support:</a>
<p>The first working draft of this module is now available.</p>
<p>It 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">Adaptable Tools</a>
<p>The first working draft of this module is now available.</p>
<p>It 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 class="informative" id="characteristics_semanticproperties">
<h1>Vocabulary Structure</h1>
<p>Personalization Semantics is made of a vocabulary of properties and their values. This generic structure makes it possible to apply Personalization Semantics 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 personalization types supported by the vocabulary. A given property supports a specific type of personalization. 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 personalization 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 value may be one of the following types:</p>
<dl>
<dt id="valuetype_true-false">true/false</dt>
<dd>Value representing either true or false, with a default "false" value.</dd>
<dt id="valuetype_true-false-undefined">true/false/undefined</dt>
<dd>Value representing true or false, with a default "undefined" value indicating the state or property is not relevant.</dd>
<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>
</section>
</section>
<section class="informative">
<h2>Vocabulary Implementations</h2>
<p>At the present stage of development, the Personalization Semantics vocabulary can be used in HTML content using <a href="https://www.w3.org/TR/html5/dom.html#embedding-custom-non-visible-data-with-the-data-attributes">data- attributes</a> [[html5]]. Attributes in this form can be used in valid HTML to implement features recognized by browser extensions or other special processors. Personalization Semantics is using this approach to gain early implementation experience of the features in a way that is simple and likely to be accepted within the web ecosystem as an interim approach.</p>
<p>For this publication of Personalization Semantics, the task force has accepted the name and values of three attributes for the Content module:</p>
<ul>
<li><a href="content/#action-explanation">data-action</a></li>
<li><a href="content/#destination-explanation">data-destination</a></li>
<li><a href="content/#purpose-explanation">data-purpose</a></li>
</ul>
<p>Other properties in the vocabulary are not yet mature enough to suggest using them in production HTML with data- attributes. Examples of those properties in the modules are to facilitate review, not to suggest implementation. See the discussion <a href="https://github.com/w3c/personalization-semantics/wiki/Prototypes-with-data-dash-*-(Take-2)">Prototypes with data dash</a>.</p>
<p class="note">The HTML data- attribute syntax is not intended to be used for long-term wide-scale features. The task force is using this approach at the moment to gain implementation experience and demonstrate the usefulness of Personalization Semantics in practice. Content authors and user agent implementers should be aware that the recommended approach to use the vocabulary is expected to change, and structure their implementation in a manner that will facilitate the transition to a new syntax.</p>
</section>
<section class="informative">
<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/personalization-semantics/wiki/Implementations-of-Semantics">extension an 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>