This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 11004 - Add an example of suggestion labels being used and rendered for input type="range"
Summary: Add an example of suggestion labels being used and rendered for input type="r...
Status: RESOLVED WORKSFORME
Alias: None
Product: HTML WG
Classification: Unclassified
Component: HTML5 spec (show other bugs)
Version: unspecified
Hardware: PC All
: P2 editorial
Target Milestone: ---
Assignee: Edward O'Connor
QA Contact: HTML WG Bugzilla archive list
URL:
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2010-10-10 10:03 UTC by Benjamin Hawkes-Lewis
Modified: 2016-04-15 21:42 UTC (History)
8 users (show)

See Also:


Attachments

Description Benjamin Hawkes-Lewis 2010-10-10 10:03:30 UTC
You can give suggestions for a input type="range" labels by using the "label" attribute on the "option" elements in a list referenced by the "list" attribute.

At the moment this isn't very obvious. Could we include an example showing the rendering of such labels as slider tick mark labels along the lines of the example at:

http://www.filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/

Compare also Bug 10988.
Comment 1 Shelley Powers 2010-10-10 15:13:35 UTC
We also need to ensure a mapping between the actual range value and the datalist option label. Currently, the list/datalist is seen as more of a passive visual aid, then an actual concrete mapping. 

In addition, we would need an ARIA mapping associated with the labeling, in such a way that actual step values would be available via API with the tick marks, but the step value AND label being available when a label is specified.
Comment 2 Benjamin Hawkes-Lewis 2010-10-10 15:50:00 UTC
(In reply to comment #1)

These remarks seem fairly off-topic for this bug, which is solely about providing an example rendering.

> We also need to ensure a mapping between the actual range value and the
> datalist option label. Currently, the list/datalist is seen as more of a
> passive visual aid, then an actual concrete mapping. 

As far as I can tell, the "value" attribute concretely maps the suggestion label to its numeric value.

If this is somehow not sufficient, please file a separate bug explaining the problem.

> In addition, we would need an ARIA mapping associated with the labeling, in
> such a way that actual step values would be available via API with the tick
> marks, but the step value AND label being available when a label is specified.

The requirement for accessibility mappings in the mappings Note is already logged as Bug 11003.

ARIA does not cover all semantics that need to be mapped to accessibility APIs (at the moment, for instance, it doesn't even cover tables). I don't think ARIA has any particularly obvious mapping for range control suggestion labels. Notably the JQuery UI slider doesn't seem to add ARIA annotations to the tick mark labels.

If you think there is a good way to map the native semantics to ARIA as it stands, please explain how in dedicated bug. Otherwise, please propose additions to ARIA to PFWG via the public-pfwg-comments mailing list.
Comment 3 Shelley Powers 2010-10-10 16:30:17 UTC
(In reply to comment #2)
> (In reply to comment #1)
> 
> These remarks seem fairly off-topic for this bug, which is solely about
> providing an example rendering.
> 
> > We also need to ensure a mapping between the actual range value and the
> > datalist option label. Currently, the list/datalist is seen as more of a
> > passive visual aid, then an actual concrete mapping. 
> 
> As far as I can tell, the "value" attribute concretely maps the suggestion
> label to its numeric value.
> 
> If this is somehow not sufficient, please file a separate bug explaining the
> problem.
> 
> > In addition, we would need an ARIA mapping associated with the labeling, in
> > such a way that actual step values would be available via API with the tick
> > marks, but the step value AND label being available when a label is specified.
> 
> The requirement for accessibility mappings in the mappings Note is already
> logged as Bug 11003.
> 
> ARIA does not cover all semantics that need to be mapped to accessibility APIs
> (at the moment, for instance, it doesn't even cover tables). I don't think ARIA
> has any particularly obvious mapping for range control suggestion labels.
> Notably the JQuery UI slider doesn't seem to add ARIA annotations to the tick
> mark labels.
> 
> If you think there is a good way to map the native semantics to ARIA as it
> stands, please explain how in dedicated bug. Otherwise, please propose
> additions to ARIA to PFWG via the public-pfwg-comments mailing list.


Sorry, disagree with you. 

As the example you have linked demonstrated, there are available ARIA mappings that would work. These need to be documented in the HTML WG documentation. 

However, do agree with you that these could be handled in a separate bug.
Comment 4 Shelley Powers 2010-10-10 16:40:36 UTC
(In reply to comment #2)
> (In reply to comment #1)
> 
> These remarks seem fairly off-topic for this bug, which is solely about
> providing an example rendering.
> 
> > We also need to ensure a mapping between the actual range value and the
> > datalist option label. Currently, the list/datalist is seen as more of a
> > passive visual aid, then an actual concrete mapping. 
> 
> As far as I can tell, the "value" attribute concretely maps the suggestion
> label to its numeric value.
> 
> If this is somehow not sufficient, please file a separate bug explaining the
> problem.
> 
> > In addition, we would need an ARIA mapping associated with the labeling, in
> > such a way that actual step values would be available via API with the tick
> > marks, but the step value AND label being available when a label is specified.
> 
> The requirement for accessibility mappings in the mappings Note is already
> logged as Bug 11003.
> 
> ARIA does not cover all semantics that need to be mapped to accessibility APIs
> (at the moment, for instance, it doesn't even cover tables). I don't think ARIA
> has any particularly obvious mapping for range control suggestion labels.
> Notably the JQuery UI slider doesn't seem to add ARIA annotations to the tick
> mark labels.
> 
> If you think there is a good way to map the native semantics to ARIA as it
> stands, please explain how in dedicated bug. Otherwise, please propose
> additions to ARIA to PFWG via the public-pfwg-comments mailing list.

Sorry, had missed your reference to bug 11003 earlier.
Comment 5 Ian 'Hixie' Hickson 2010-10-12 10:27:31 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are satisfied with this response, please change the state of this bug to CLOSED. If you have additional information and would like the editor to reconsider, please reopen this bug. If you would like to escalate the issue to the full HTML Working Group, please add the TrackerRequest keyword to this bug, and suggest title and text for the tracker issue; or you may create a tracker issue yourself, if you are able to do so. For more details, see this document:
   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Accepted
Change Description: no spec change
Rationale: The very first type=range example shows exactly that as far as I can tell.

If you want another example, please provide the source and screenshot for the example you have in mind. I'd be happy to add more examples.
Comment 6 Benjamin Hawkes-Lewis 2010-10-22 07:33:43 UTC
Not really, I mean something like:

<input type="range" min="0" max="100" value="0" step="10" name="speed" list="speeds">
<datalist id="speeds">
  <option value="10">Slower</option>
  <option value="20">Slow</option>
  <option value="30">Medium</option>
  <option value="70">Fast</option>
  <option value="90">Faster</option>
</datalist>

Excuse the ASCII art:

------------------------------------------------------------
|       |              |             }               |        |        |         }           |        |              |
       Slower      Slow       Medium                                 Fast               Faster       

The example in the spec doesn't have labels specified in the data list, or render them.

Assigning to me in the hopes that I'll find time to come up with a nicer example, though.
Comment 7 Michael[tm] Smith 2011-08-04 05:01:32 UTC
mass-moved component to LC1
Comment 8 Michael[tm] Smith 2011-11-20 14:23:37 UTC
(In reply to comment #6 from Benjamin Hawkes-Lewis)
> Assigning to me in the hopes that I'll find time to come up with a nicer
> example, though.

Note that per the chairs latest published timeline, we need for this bug to be resolved by December 31 -

  http://lists.w3.org/Archives/Public/public-html/2011Jun/0315.html

If you don't have time before then to come up with a better proposed example, one possible resolution is to move the bug to resolved=later and get back to it when you can.
Comment 9 Ian 'Hixie' Hickson 2011-11-24 02:59:09 UTC
If you don't have the time to make an example, feel free to reassign it to me. I'll do one or find someone to do one. (Definitely don't close the bug, it'd be a pity to lose track of this suggestion.)
Comment 10 contributor 2012-07-13 18:04:59 UTC
This bug was cloned to create bug 17771 as part of operation convergence.
Comment 11 Edward O'Connor 2012-10-16 17:25:43 UTC
EDITOR'S RESPONSE: This is an Editor's Response to your comment. If you are
satisfied with this response, please change the state of this bug to CLOSED. If
you have additional information and would like the Editor to reconsider, please
reopen this bug. If you would like to escalate the issue to the full HTML
Working Group, please add the TrackerRequest keyword to this bug, and suggest
title and text for the Tracker Issue; or you may create a Tracker Issue
yourself, if you are able to do so. For more details, see this document:

   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Rejected
Change Description: No spec change.
Rationale: Let's add an example when someone comes up with one, but let's not block HTML5 on it.
Comment 12 Robin Berjon 2013-01-21 15:59:59 UTC
Mass move to "HTML WG"
Comment 13 Robin Berjon 2013-01-21 16:02:43 UTC
Mass move to "HTML WG"
Comment 14 Travis Leithead [MSFT] 2016-04-15 21:42:31 UTC
HTML5.1 Bugzilla Bug Triage: It looks like the current spec has three examples that show how labels might be used in: http://w3c.github.io/html/sec-forms.html#range-state-typerange
1. An example with a wheel that has marks at 400, 500, and 600.
2. An example with "High" and "Low" labels
3. A 'multiple' example with time duration labels (not positioned along the tick marks)

I think this is probably sufficient and the second example covers the list attribute case.

If this resolution is not satisfactory, please copy the relevant bug details/proposal into a new issue at the W3C HTML5 Issue tracker: https://github.com/w3c/html/issues/new where it will be re-triaged. Thanks!