RE: Hiding heading level ones

Laura Carlson wrote:
>
> A Web developer in our marketing department has asked if the following
> markup, which is meant for use in Drupal themes and Dreamweaver
> templates throughout the organization, would meet WCAG AA with the
> notion that screen readers will be able to receive a good heading for
> the page and some snappy marketing text could go in the <h2>.

<SNIP>

> <h1 class="hidden">Page Title</h1>
>  <!-- No other content -->
> <h2>THIS IS WHERE THE DOCUMENT HEADING GOES.</h2>
>
> Thoughts on that markup and WCAG AA?

Quick question: Fill in the blank - 2, 4, 6, __, 10



Who didn't come up with eight?

Through observation and discussion, I've long held that the "level" of the
heading(s), while providing some semantic information, is less useful than
the relationships created by headings at different levels. In my question
above, you likely understood the pattern (that if a=2, and b=4, and c=6,
then d MUST=8) - the relationship is far more important than the
character/number itself. I'd go so far as to say that if you built a web
site (multiple pages) that only used even numbered headings, while "weird"
and perhaps even a little off-putting, that for those users who rely on
_structured semantic headings_ to navigate, that they would pick it up very
quickly, and have no problem navigating my "even headings only" site. (Not
for one minute however am I advocating this, I simply toss it out as a straw
man argument for contemplation.)

Does it *really* matter if each page visually starts with an <h2>, if the
content of that <h2> is meaningful, unique and helps orient the end-user to
what the page contains? What real hardship is caused if each page visually
starts at an <h2>, and then uses heading structures properly, so that users
can comprehend that all of the <h3>'s are children of any given <h2>, and
that an <h4> MUST be the child of its parent <h3>? We've long discussed
whether a page should have more than one <h1>, and frankly I think the jury
is still out on that one - most agree that it is probably a very rare
instance, but that edge and corner cases could exist... yet I think it would
be fairly trivial to find pages with hidden <h1>s and then multiple <h2>s -
effectively creating the same "edge case" but without being "wrong".

I've often noted as well that for some reason, many authors think that the
content of the <h1> and the <title> should be the same - although why that
is I do not know (perhaps because the <title> content is not rendered well
in browsers?). It very much feels like that here - heck Laura's sample code
even states:

	<h1 class="hidden">Page Title</h1>

... yup, page TITLE, and then our friend Sailesh wrote:

> Non-SR users will not see a page title.
> Yes in some situations one may have an h1 and no content before the
> next heading.

>From my perspective, if all you are using the <h1> for is to echo back what
is also in the <title>, then I would suggest that it is a bit of a mis-use
of the <h1>, and that for sighted users it likely isn't a big deal. What is
more important is that the <h2>snappy marketing text</h2> is going to be
styled to quickly orient the sighted user to *that* page, and that headings
used after that initial <h2> are properly structured usage.


> I stated that if he hides the <h1> he would be locking out people with
> cognitive and learning disabilities who would benefit from the ability
> to identify content by a visible <h1>. My advice to him was to keep the
> <h1> visible and intuitively easy to understand.

...or so goes the common wisdom, but let me ask you this: if each page on
your site always visually started with an <h2>, and was styled such that the
"snappy marketing text" served as a good visual "heading" of what is on the
page, then what? Would those users with cognitive and learning disabilities
really be locked out? I argue no, as for the most part they are using the
visual styling of the headings to grok the semantic structure, and not the
enumeration of headings in the code.

In fact, back when the W3C was working on XHTML2, the proposal was to
eliminate the enumeration, and simply use <h> - allowing the user agent to
build the "outline algorithm" mechanically.
(http://www.w3.org/TR/xhtml2/mod-structural.html#sec_8.5.)


> I have cited Info and Relationships Success Criteria 1.3.1, "When such
> relationships are perceivable to one set of users, those relationships
> can be made to be perceivable to all."

Correct, but nowhere does it state that the relationship model must always
start at "1", especially when 1=redundant information, and "2" is styled in
such a way as to serve the practical function of "1" - it's a game at that
point: the intent is met, if not the pure-play mechanics.

Laura, sometimes when using system-wide CMS tools (like Drupal) across an
organization your templates need to meet the majority requirement. If all of
the sites using Drupal (for example) have a consistent heading navigation
structure [sic], then I don't see any real harm in having all pages visually
start with appropriately styled <h2>'s - in fact I would be more concerned
that the <title> and <h1> content is repeating itself for no practical
reason, and even then it is a minor concern.


>
> In addition I have pointed him to:
> http://www.d.umn.edu/itss/training/online/structure/coding/index.html#w
> riting
>
> Other thoughts?
>


Yup, you offered the following code sample for <strike>hidden</strike>
<ins>off-screen</ins> text:

> <style>
> .hidden {
> position: absolute;
> top: -9999px;
> left: -9999px;
> }
> </style>

Our testing has shown that in some rare instances, this will introduce a
horizontal scroll bar in some browsers, even if you cannot actually scroll
L-to-R - the visual bar still manifests.  A well-tested and "better"
solution is to use CSS differently:

.offscreen-text {
	font-size:0;
	width:0;
	height:1px;
	position:absolute;
	overflow:hidden;
	z-index:-1000;}


My $0.05 Canadian (Canada no longer has $0.01 coins <grin>)

JF
------------------------------
John Foliot
Web Accessibility Specialist
W3C Invited Expert - Accessibility
Co-Founder, Open Web Camp

Received on Tuesday, 25 November 2014 17:05:12 UTC