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 19159 - allow use of hidden for tab panels
Summary: allow use of hidden for tab panels
Status: RESOLVED MOVED
Alias: None
Product: HTML WG
Classification: Unclassified
Component: HTML5 spec (show other bugs)
Version: unspecified
Hardware: PC Windows NT
: P2 normal
Target Milestone: ---
Assignee: steve faulkner
QA Contact: HTML WG Bugzilla archive list
URL: http://dev.w3.org/html5/spec/editing....
Whiteboard:
Keywords: a11y
Depends on:
Blocks:
 
Reported: 2012-10-01 11:15 UTC by steve faulkner
Modified: 2016-04-15 13:17 UTC (History)
10 users (show)

See Also:


Attachments

Description steve faulkner 2012-10-01 11:15:51 UTC
the following advice and MUST level conformance requirement in regards to the use of the hidden attribute is incorrect, a tabbed interface is not "merely a kind of overflow presentation " a tabbed interface has distinct semantics (role, states and properties) and interaction behaviours on all platforms. The ability to have content only displayed on selection is a common paradigm and useful for reducing cognitive overload especially for users with disabilities.

"The hidden attribute must not be used to hide content that could legitimately be shown in another presentation. For example, it is incorrect to use hidden to hide panels in a tabbed dialog, because the tabbed interface is merely a kind of overflow presentation — one could equally well just show all the form controls in one big page with a scrollbar."

Recommend removing the paragraph above at it provides incorrect advice and MUST level conformance requirements for developers.
Comment 1 steve faulkner 2012-10-01 12:53:15 UTC
Note also that its is common practice to use CSS display:none to hide tab panels other than the selected panel in custom tba widgets.
examples:
* http://jqueryui.com/demos/tabs/#default
* https://dojotoolkit.org/reference-guide/1.8/dijit/layout/TabContainer-examples.html
* http://yuilibrary.com/yui/docs/tabview/tabview-basic.html
 
Note: CSS display:none is used by browsers to implement hidden attribute display properties. CSS display:none is also commonly accepted and implemented as meaning hidden from all users including AT users.
Comment 2 Peter Winnberg 2012-10-02 22:19:40 UTC
I do agree with that paragraph from the specification that there are different kinds of hidden content.

If we take the tabbed interface as an example, this does not work (as) well in situations where you have limited horizontal space like on a cell phone display. So one way to handle that could be that on a display that is big enough you get a tabbed interface but on a cell phone it would be presented in a different way where none of the content is hidden and you could reach all of it using scrolling (another way to handle overflow). Scripts are always involved when you interact with a tabbed interface so obviously they would have to detect which presentation that currently is being used so that something different (or nothing at all) is done when the “tabs” are activated on a cell phone. So it makes sense to use display:none here so that it could change using e.g. media queries on a smaller display.

There are situations where you have content that should be hidden regardless of how you present it, like a dialog box with an error message about an error that didn’t occur (yet anyway). Situations like this is what the hidden attribute is for, at least that is the way I interpret the current text in the specification. But on the other hand using display:none in all CSS media types seems to do that too. I don’t think it is clear why a document author should not just continue to use display:none for all hidden content.

I think that removing that paragraph would make it even less clear why the hidden attribute should be used instead of display:none (other other method of hiding things). I do however agree that something needs to change. Either remove the hidden attribute completely from HTML5 or add a better description about this attribute’s relationship with other methods of hiding content.
Comment 3 Peter Winnberg 2012-10-02 22:35:44 UTC
I guess that it is possible see the hidden attribute as a way to hide things without CSS. But at least according to the testing that I have done that is not the case. If CSS is disabled completely in the user agent all elements with the hidden attribute will be displayed (which makes sense because the user agent applies display:none to them).

(In reply to comment #2)
"other other method of hiding things" should be "or other method of hiding things".
Comment 4 Leif Halvard Silli 2012-10-05 19:18:06 UTC
(In reply to comment #3)

> If CSS is disabled completely in the user agent all elements with the
> hidden attribute will be displayed

This is not true. In WebKit (and probably Chrome), if you disable CSS, then elements with hidden="" set will remain hidden. I would expect all UAs that have implemented @hidden to behave that way.

(In reply to comment #2)
> I do agree with that paragraph from the specification that there are different
> kinds of hidden content.

Me too.

(In reply to comment #0)
> the following advice and MUST level conformance requirement in regards to the
> use of the hidden attribute is incorrect, a tabbed interface is not "merely a
> kind of overflow presentation " a tabbed interface has distinct semantics
> (role, states and properties) and interaction behaviours on all platforms. The
> ability to have content only displayed on selection is a common paradigm and
> useful for reducing cognitive overload especially for users with disabilities.

The "displayed on selection" paradigm does not rely on display:none. What it relies on is a "for some reason, currently out of sight" behavior. 

@hidden enforces display:none. But not all tabbed interefaces rely on display:none.

> "The hidden attribute must not be used to hide content that could legitimately
> be shown in another presentation. For example, it is incorrect to use hidden to
> hide panels in a tabbed dialog, because the tabbed interface is merely a kind
> of overflow presentation — one could equally well just show all the form
> controls in one big page with a scrollbar."
> 
> Recommend removing the paragraph above at it provides incorrect advice and MUST
> level conformance requirements for developers.

I don't understand what the problem with this is.

(In reply to comment #1)
> Note also that its is common practice to use CSS display:none to hide tab
> panels other than the selected panel in custom tba widgets.
> examples:
> * http://jqueryui.com/demos/tabs/#default
> *
> https://dojotoolkit.org/reference-guide/1.8/dijit/layout/TabContainer-examples.html
> * http://yuilibrary.com/yui/docs/tabview/tabview-basic.html
> 
> Note: CSS display:none is used by browsers to implement hidden attribute
> display properties. CSS display:none is also commonly accepted and implemented
> as meaning hidden from all users including AT users.

While hidden="" implies display:none, display:none does not need to imply hidden="".  I don't understand whey we should change that.

Content that has hidden="" is hidden in all views an on all media. A danger with allowing hidden="" on every element that has display:none, regardless of the reason why it is hidden, would be that the this way hidden="" content becomes hidden also when CSS is disabled. Thus it could decrease accessibility for CSS-unsavvy usage and it could also decrease accessibilty for other media types. For example, to use hidden="" because of a need that occurred in screen media, would also hide that element in all other medias.
Comment 5 Leif Halvard Silli 2012-10-06 02:48:02 UTC
I think (In reply to comment #0)

> Recommend removing the paragraph above at it provides incorrect advice and MUST
> level conformance requirements for developers.

I think this is possible. But only if we remove the aria-hidden="true" mapping from the @hidden attribute.

As long as it is possible to style elements by using hidden as a selector - *[hidden]{display:block}, then some authors will do that.

The current spec text prevents it from happening too often. But if we remove that text, then it will happen often. (It might happen often even if we don't remove that text - it only takes that authors change their habits.)

Thus: I would be OK with allowing hidden="" to be used as display:none if it is made a 100% equal to display:none. But I would not be OK with  allowing hidden="" to be used as display:none as long as it has the additional semantic of aria-hidden="true".
Comment 6 steve faulkner 2012-11-22 10:55:38 UTC
test
Comment 7 steve faulkner 2015-06-12 14:33:35 UTC
Waiting for the HTML spec to be editable again...
Comment 8 Charles McCathieNevile 2015-06-12 14:49:19 UTC
see also 23347
Comment 9 Charles McCathieNevile 2016-04-14 14:29:53 UTC
Steve? Ping?
Comment 10 steve faulkner 2016-04-15 13:17:56 UTC
moved to https://github.com/w3c/html/issues/203