Personalization Semantics Content Module 1.0

W3C Working Draft

This version:
https://www.w3.org/TR/2018/WD-personalization-semantics-content-1.0-20181018/
Latest published version:
https://www.w3.org/TR/personalization-semantics-content-1.0/
Latest editor's draft:
https://w3c.github.io/personalization-semantics/content/
Previous version:
https://www.w3.org/TR/2018/WD-personalization-semantics-content-1.0-20180316/
Editors:
(Benetech)
(W3C)
(W3C)
Richard Schwerdtfeger (Knowbility) (Editor until October 2017)

Copyright © 2017-2018 W3C® (MIT, ERCIM, Keio, Beihang). W3C liability, trademark and document use rules apply.

Abstract

This document provides use cases and a vocabulary of terms that can be used to enhance web content by providing information about form controls, symbols, and other user interface elements. User agents use the semantics to augment or adapt content to the user’s scenario. This helps users with varying needs to understand the content by providing support for simplification and a way to manage unnecessary distractions.

The Personalization Semantics Content Module 1.0 is an extension of the personalization semantics introduced in the Personalization Semantics Explainer 1.0 document.

Status of This Document

This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at https://www.w3.org/TR/.

This is a Working Draft of Personalization Semantics Content by the Accessible Platform Architectures Working Group. Personalization Semantics Content Module is a part of Personalization Semantics, which is introduced in the Personalization Semantics Explainer 1.0. This version updates values for properties and formats the example's code.

To comment, file an issue in the W3C personalization semantics GitHub repository. If this is not feasible, send email to public-personalization-tf@w3.org (archives). Comments are requested by 22 November 2018. In-progress updates to the document may be viewed in the publicly visible editors' draft.

Publication as a Working Draft does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.

This document was produced by a group operating under the W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.

This document is governed by the 1 February 2018 W3C Process Document.

1. Introduction

This section is non-normative.

This document provides personalization semantics and vocabularies that can be used to annotate web content enabling user agents to augment or adapt content to various user scenarios based on the user’s personalization settings or preferences.

Editor's note

Personalization semantics defines a set of properties and values to annotate content. The specific mechanism to apply these properties to content has not been decided. Several approaches are under consideration and future drafts will show progress. To help with understanding of the properties, this document provides many examples of personalization semantics applied to content, which show attributes beginning with the prefix "aui-". This has not been decided as the chosen approach, but the simplicity supports understanding of the examples.

2. Use Cases

2.1 Simplification

Requirement: There must be a mechanism to identify and differentiate the features included in web content based on its importance (e.g. critical, high, medium, low). The definition of a feature's importance should be defined from the user's perspective as:

User experience: A user changes their personalization settings to simplify the web content that displays based on the importance of various features. In the sample user experience available at https://rawgit.com/ayelet-seeman/coga.personalisation/demo/conactUs.html, the user can select a "More options button or "Less options" button to simplify the web content by hiding or displaying elements that are or of low importance.

Relevant properties: simplification

2.2 Adding Context

Requirement: Terms and symbols used in web content must be familiar to the user because what is familiar to one user may be unrecognizable or strange to someone else requiring the user to learn new symbols. Therefore, the user agent or script should understand the context of links, buttons, and other page elements so that symbols and text displayed in a way each user understands. This can include:

In order to display the appropriate content the supported syntax and terms must be standardized using attributes to associate symbols, terms, translations and explanations that are presented in a way that is understandable by various user scenarios.

Example user experience:: A web content author creates a button with a role="send" then, without any additional work by the author the web content automatically:

Standardizing content with the appropriate attributes can help to ensure a consistent user experience across applications and websites.

Relevant properties: action, destination, field

2.2.1 General Context

Requirement: Optimize the personalization of a product or service's content to ensure it is appropriate for the current context of use as well as relevant for the user.

User experience: A female user with a cognitive disability may need to select "Less options", while shopping on a website to eliminate options that are not relevant to a her shopping needs. In this case it may be appropriate to demote these options to display below the scroll or placed under a "More option" button.

Relevant properties: context

2.2.2 Interoperable Symbols

Requirement: Create interoperable symbol sets for users with complex communication needs that require the use of Alternative and Augmentative Communication (AAC) systems. AAC systems are designed for people who are non-verbal that often use symbols with or without text. AAC end-users tend to only learn one symbol set and cannot easily communicate with other symbol users in a written format. In addition, they may struggle to understand different symbols that are used in different applications. It's important to note that some symbols may be subject to copyright, which means they cannot be shared across applications. However, there are open symbol sets that can be shared and mapped against concepts, generating representative text. This text can also be translated into different languages as well as used to display a different set of symbols.

User experience: Mapping an AAC users' symbols to the same concepts enables the user agent to load the appropriate symbols enabling the user to understand and access content on the web and in other applications. In addition, AAC users, and those working with AAC users will be able to load AAC user symbols into these applications enabling access to content that has been created by different providers.

Relevant properties: concept

3. Content

Editor's note
Since implementation has not yet been finalized any examples in this document are purely for help in understanding the concept. All examples will be updated once a final decision has been made on the method for implementation.

3.1 action

3.1.1 Description

The action attribute provides the context of a button. It is typically used on a button element or element with role="button".

3.1.2 Example

Here is an example using the action attribute.

Example 1: Action Using AUI
<button aui-action="undo">Revert</button>

A personalization agent may add a symbol, replace the text with a more familiar term, or give it a specific presentation. Note that there is no default value.

3.1.3 Characteristics

Characteristic Value
Related Concepts: link types [HTML52] and HTML types [HTML5]
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: token

The following could be supported values of action for buttons. Note that the following items represent an option or control that allows you to perform the action. They do not represent page regions.

3.1.4 Values

Value Description
add Add the selected item or the item at the current location to a list.
brightness Adjust the screen or application brightness. Often used with increase or decrease but is sometimes used alone as a menu name or item.
Editor's note
At risk pending implementations.
buy Buy the selected item or buy the item at the current location. Often involves adding the current item into a shopping cart. (Implied simplification = "critical".)
cancel Closes the dialog and discards any changes the user may have made within that dialog. (Implied simplification = "critical".)
captions Show the settings for captions and subtitles.
channel Adjust the channel of a multimedia component. Often used with increase or decrease but is sometimes used alone as a menu name or item.
Editor's note
At risk pending implementations.
checkout Proceed to the purchasing process. (Implied simplification = "critical".)
close Close the current dialog. (Implied simplification = "critical".)
color Opens a color picker.
compose Compose a new item such as an email. (Implied simplification = "critical".)
confirm Confirms submission of the form request to the server. For example, an "ok" button. (Implied simplification = "critical".)
connect Connect to a communication channel, such as an FTP server or Voice over IP channel. Often used with [aria-pressed = "true"] for on or [aria-pressed = "false"] for off.
copy Copies the selected control, item or text and places it onto the clipboard
cut Removes the selected control, item or text and places it onto the clipboard
date Opens a date control. (Implied simplification= "critical".)
decrease Decreases the level of the relevant setting. (Implied simplification= "critical".)
delete Delete the current item, selected control, or text.
download Download a file from the server.
drag Enables a dragged and dropped capabilities. Often used with [aria-pressed = "true"] for on or [aria-pressed = "false"] for off.
edit Edit the item or selection at the current location.
escape Typically used to abort, cancel or change what is currently being displayed on the screen. A common application of the the esc key is to leave full screen mode.
expand Expand or collapse the current item.
forward Forward the current item such as an email.
help Opens a help function. (Implied simplification= "critical".)
increase Increases the level of the relevant setting. (Implied simplification= "critical".)
label Add a label to the selected item or the item at the current location.
left Moves a selected item to the left into another column or list.
loop Plays the flow, presentation or a movie over and over again, once or without stopping. Often used with [aria-pressed = "true"] for on or [aria-pressed = "false"] for off.
Editor's note
At risk pending implementations.
mediaPosition Adjust the current playback position in the current media.
Editor's note
At risk pending implementations.
mode Change the mode or functionality. (Implied simplification= "critical".)
more Show more information.
move Changes the position of a selected item(s). Often used with left, right, begin, end, increase (up) or decrease (down).
mute Mute or toggle the mute option.
new Open a new item. (Implied simplification= "critical".)
next Move to the next item in the series. (Implied simplification = "critical".)
open Open an item. (Implied simplification = "critical".)
order Changes the position of the selected item within a list of items, while each item in the list has a layer position. Often used with increase (forward), decrease (back), first and end.
paste Paste the content from the clipboard to the current position.
pause Pause a multimedia, audio or video element or object. (Implied simplification= "critical".)
play Play a multimedia, audio or video element or object. (Implied simplification= "critical".)
previous Move to the previous item in the series. (Implied simplification = "critical".)
print Print the current page, selection or the item at the current location.
profile Opens the user's profile page
properties Shows the properties of an item.
received Open the received folder.
refresh Manually refresh the current contents of the screen.
remove Removes an item from a list.
reply Reply to the current item such as an email. (Implied simplification = "critical".)
reset Resets all the controls to their initial values.
resize Increase or decrease the font size. Often used with increase or decrease.
right Moves a selected item to the right into another column or list.
save Save the current content. (Implied simplification = "critical".)
scroll Advances the view. Often used with left, right, begin, end, increase (up) or decrease (down).
send Send a form, email or request. (Implied simplification = "critical".)
sent Open the sent folder.
settings Open settings and options.
skip Skips the current step. This is typically used in a sequence of steps.
submit Submits the form data or a request to the server. (Implied simplification = "critical".)
temperature Adjust the temperature. Often used with increase or decrease but is sometimes used alone as a menu name or item.
Editor's note
At risk pending implementations.
toc Opens a table of contents.
undo Revert back to the prior state before the user's most recent changes
upload Upload a file to the server.
voiceCommands Activate or deactivate voice commands. Often used with [aria-pressed = "true"] for on or [aria-pressed = "false"] for off.
volume Adjust the volume of a multimedia component. Often used with increase or decrease but is sometimes used alone as a menu name or item.
Editor's note
At risk pending implementations.

3.2 destination

3.2.1 Description

The destination attribute categorizes the target of a hyperlink.

A personalization agent or user agent may add additional familiar user interface features to help users understand the link and follow the right one easily. User agents might add a familiar customized icon to the link, or style the link in a customized way, or position the link on the page in a location that the user generally expects to find a link of the particular type.

3.2.2 Example

The below example section show how destination used when coding.

Example 2: Destination Using AUI
<a href="home.html" aui-destination="home">our main page</a>

See the destination sample user experience.

3.2.3 Characteristics

Characteristic Value
Related Concepts: link types [HTML52] and HTML 5.2 autocomplete [HTML52]
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: token

3.2.4 Values

Value Description
about Information about the content owner or producer.
accessibilityStatement Information about the accessibility features in a web site or web content.
begin Changes the location to the beginning item from a list of items or redirects the functionality to the first step in a sequence.
chat Human help or a dialog help function such as a chat bot.
comment Submit a comment on the current item.
contact Opens contact information for content owner or producer.
email Email address for the content owner or producer.
end Changes the location to the end item from a list of items or redirects the functionality to the last step in a sequence.
help A help function that includes support or instructions.
home Initial or main page of a website or application.
language Available language options for the website or web content.
left Changes the location of the selected item(s) to the left.
phone Phone number for the content owner or producer.
post Post current item. Item will be visible to other parties.
products Products available from the content provider.
related Adds a related item(s) to a pre-selected list of items.
right Changes the location of the selected item(s) to the right.
services Services available from the content provider.
signin Sign in to the current web site or application.
signout Sign out of the current web site or application.
sitemap Content containing a list of all the pages in a web site.
social Content provider on a social media platform. Note, that the specific name of the social media platform should be included in the accessible name.
Editor's note
At risk pending implementations.
terms The terms and conditions of use applicable to the website or web content.
tools Available tools for the current content.

3.3 field

3.3.1 Description

The field attribute provides the context of a text input field such as a text box. It is typically used on an input of type text, or element with a corresponding role.

A personalization agent may add a symbol, replace the text with a more familiar term, or give it a specific presentation. Note that there is no default value.

The user experience may include filling in the field and adding an icon.

The field values that would typically be on form controls should provide context for the user. For example tel would relate to the user's telephone number. Note that there is no default value and there can be more than one value for a field, such as aui-field="country postcode" which includes both the country and postal code.

3.3.2 Example

Here is an example using the field attribute when coding.

Example 3: Field Using AUI
<input type="text" name="telnum" aui-field="tel"/>

3.3.3 Characteristics

Characteristic Value
Related Concepts: link types [HTML52] and HTML types [HTML5]
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: token

3.3.4 Values

Value Description
additionalName Additional or middle name.
additionalNameInitial Additional or middle name initial.
addressLine1 First line of street address.
addressLine2 Second line of street address.
addressLine3 Third line of street address.
answer Answer to a section question.
area Administrative area, state, province, or region.
bday Birthday.
bdayDay Day of birthday.
bdayMonth Month of birthday.
bdayYear Year of birthday.
ccCsc Credit card security codey.
ccExp Date of expiration of credit card.
ccExpMonth Month of expiration of credit card.
ccExpYear Year of expiration of credit card.
ccName Full name, as it appears on credit card.
ccNumber Credit card number.
ccType Type of payment instrument (e.g. Visa). Note that there may be a change to allow for adding options.
city Locality or city.
comment Form comment section. Typically, a free text field.
country Country name.
dateEnd Set the end time of an event
Note
We may remove this or harmonize with other date time standards.
Editor's note
At risk pending implementations.
dateStart Set the start date or the date of an event.
Note
We may remove this or harmonize with other date time standards.
Editor's note
At risk pending implementations.
email Email address.
familyName Family name, surname, or last name.
fax Full fax number, including international country code.
faxAreaCode Area code.
faxCountryCode International country code.
faxLocal Local fax number: full number minus country and area codes.
faxNational National fax number: full number minus international country code and area code.
gender Gender identity.
givenName Given or first name.
honorificPrefix Prefix or title (Mr., Mrs., Dr., etc.)
honorificSuffix Suffix (Jr., II, etc.)
language Preferred language.
name Full name.
nickname Nickname.
org Company or organization.
photo Photo or avatar.
position User's position or title within a company or organization.
postalcode Postal or ZIP code.
section-***** Used to group forms together.
sex Sex or gender.
streetAddress Full street address condensed into one line.
subject Form subject. Typically, a free text field.
tel Full telephone number, including international country code.
telAreaCode Area code.
telCountryCode International country code.
telExtension Telephone extension number.
telLocal Local telephone number: full number minus international country code and area codes.
telNational National telephone number: full number minus international country code.
timeEnd Set the end time of an event.
Note
We may remove this or harmonize with other date time standards.
Editor's note
At risk pending implementations.
timeStart Set the start time or the time of an event.
Note
We may remove this or harmonize with other date time standards.
Editor's note
At risk pending implementations.
topic Topic for the form. Typically, selected from a list of reserved words.
transactionCurrency The monetary system being used for the transaction. Note that there may be a change to allow for adding options.
transactionAmount The amount that the user is committing to pay for a transaction. (Often used when entering a bid or sale price.)
url Website URL.

3.4 simplification

3.4.1 Description

The simplification attribute differentiates between critical features and less important features for simplification.

This allows simplified interfaces with less options or interfaces that emphasize critical features. Adaptations can be based on personalization settings.

Editor's note

This was formerly importance. However different people may feel that sections that would be hidden in a simplified version are still very important, such as marketing content or legal terms.)

Note

These semantics aid simplification. But what content is most useful to a user varies from user to user. For example, men may be more interested in men's clothing, and may not be interested in the more frequently use women's clothing option. For that reason we may add context for elements that will help the personalization agent select the most useful content for a given user (see the context attribute). This is also necessary for reminders (see below).

It is worth mentioning that a lot of this information is known for personalization of advertisements and content optimization.

3.4.2 Example

Here is an example using the simplification attribute in the context of a submit button.

Example 4: Simplification Using AUI
<input aui-simplification="critical" value="Submit" type="submit"/>

3.4.3 Characteristics

Characteristic Value
Related Concepts: SVG [SVG2] and DOM [DOM4] active
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: token

3.4.4 Values

Value Description
critical The critical setting should be used on:
  • Elements that are essential for the key function (from the user perspective) of the page. Example: The send button for an email draft in an email application.
  • Elements that are sometimes critical to use the site, such as "save my work" or "emergency instructions".
  • Elements that are used by over 90% of a user group (such as parents or teachers) most times they interact with the content.
medium (default) The medium setting should be used on:
  • Elements that are used frequently but are not essential for the key functioning of the application. Example: The delete button for an email draft in an email application.
  • Elements that are sometimes important for a user to interact with the site, such as settings to change colors or fonts.
  • Elements that are used by over 60% of a user group (such as parents or teachers) when they interact with the content.
low The low setting should be used on elements that are rarely used or only used by advanced users. Example: The terms and services or the archive button for an email application.

3.5 distraction

3.5.1 Description

The distraction attribute should be used on non-essential detracting content, so that people who have problems keeping focus can turn the content off. An example user experiences would be to hide all non-essential distracting content.

Supported values: animations, auto-starting, moving, ad, message, chat, overlay, popup Auto-changing (logs) third-party, offer (includes suggestions).

Note that there is no default value.

Note that elements with the distraction attribute should also have a label or accessible name.

3.5.2 Example

Here is an example using the distraction attribute in the context of an animated image.

Example 5: Distraction Using AUI
<img src="animated.gif" alt="animated banner advertising for Foobars" aui-distraction="moving ad">

3.5.3 Characteristics

Characteristic Value
Related Concepts: SVG [SVG2] and DOM [DOM4] active
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: token list

3.5.4 Values

Value Description
ad An advertisement or offer for a product, feature or service that is under the authors' control and is not part of an activity where it is essential.
animations Computer-generated moving images. Animations are also automatically updating.
autoStarting Information that starts automatically without user interaction that is presented in parallel with other content.
autoUpdating Information that starts automatically and is presented in parallel with other content that updates frequently without user interaction unless the auto-updating is part of an activity where it is essential.
chat An interface that allows real-time interaction of text-based messages between a sender and a receiver.
message Communication sent to or left for the user.
moving Elements that change locations on the screen without user interaction.
overlay A part of an application or content that is displayed over the top of the main content in the same window.
popup A child window that blocks user interaction to the parent window.
thirdParty Content that is not under the author’s control.

3.6 symbol

3.6.1 Description

The symbol attribute identifies the concept for symbols.

The symbol attribute accepts the values of a URI or shortened URI. Note that namespaces are the only additional parsing that maybe required to identify the concept.

A personalization agent can then load alternative symbols that the user is familiar with so they do not have to learn new symbols for different applications.

Note

To help this be interoperable without an RDF parser we recommend referencing the most commonly used ontologies and the highest-level concept. (For example, reference "girl" and not "young girl".)

Editor's note

We should have a note of common suggested terms and references. (Maybe with links to http://www.arasaac.org/)

3.6.2 Example

Here is an example using the symbol attribute.

Example 6: Symbol Using AUI
<img aui-symbol="http://blisssymbolics.org/refnumber/001" href="mysymb.bmp" >

When there is more than one concept, multiple concepts can be referenced by separating them with white space. The order of multiple concepts should be subject predicate object. Both omissions and multiple triples are allowed.

3.6.3 Characteristics

Characteristic Value
Related Concepts: microdata [microdata], SKOS Core Guide [[SKOS Core Guide]] and RDFa [[RDFa 1.1 Primer]]
Used in Roles: All elements of the base markup
Inherits into Roles: Placeholder
Value: URI

A. Vocabulary Implementations

The vocabulary implementations included in this document are available at Personalization Explainer 1.0 Vocabulary Implementations section.

B. Change Log

The full commit history to personalization semantics content is available.

B.1 Significant editorial changes since the First Public Working Draft

C. Acknowledgments

This section is non-normative.

The following people contributed to the development of this document.

C.1 Participants active in the Personalization TF at the time of publication

C.2 Other Personalization TF contributors, commenters, and previously active participants

C.3 Enabling funders

This publication has been funded in part with U.S. Federal funds from the Health and Human Services, National Institute on Disability, Independent Living, and Rehabilitation Research (NIDILRR) under contract number HHSP23301500054C. The content of this publication does not necessarily reflect the views or policies of the U.S. Department of Health and Human Services, nor does mention of trade names, commercial products, or organizations imply endorsement by the U.S. Government.

D. References

D.1 Normative references

[DOM4]
DOM Standard. Anne van Kesteren. WHATWG. Living Standard. URL: https://dom.spec.whatwg.org/
[HTML5]
HTML5. Ian Hickson; Robin Berjon; Steve Faulkner; Travis Leithead; Erika Doyle Navara; Theresa O'Connor; Silvia Pfeiffer. W3C. 27 March 2018. W3C Recommendation. URL: https://www.w3.org/TR/html5/
[HTML52]
HTML 5.2. Steve Faulkner; Arron Eicholz; Travis Leithead; Alex Danilo; Sangwhan Moon. W3C. 14 December 2017. W3C Recommendation. URL: https://www.w3.org/TR/html52/
[microdata]
HTML Microdata. Charles McCathie Nevile; Dan Brickley; Ian Hickson. W3C. 26 April 2018. W3C Working Draft. URL: https://www.w3.org/TR/microdata/
[personalization-semantics-1.0]
Personalization Semantics Explainer 1.0. Lisa Seeman-Kestenbaum; Charles LaPierre; Richard Schwerdtfeger; Michael Cooper; Ruoxi Ran. W3C. 16 March 2018. W3C Working Draft. URL: https://www.w3.org/TR/personalization-semantics-1.0/
[SVG2]
Scalable Vector Graphics (SVG) 2. Nikos Andronikos; Rossen Atanassov; Tavmjong Bah; Amelia Bellamy-Royds; Brian Birtles; Cyril Concolato; Erik Dahlström; Chris Lilley; Cameron McCormack; Doug Schepers; Dirk Schulze; Richard Schwerdtfeger; Satoru Takagi; Jonathan Watt et al. W3C. W3C Working Draft. URL: http://www.w3.org/TR/2015/WD-SVG2-20150915/