WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Query on heading hierarchy

for

From: Osmo Saarikumpu
Date: Mar 26, 2018 11:22AM

I'd fail it, but certainly not on the grounds that the font size of <h2>
is smaller than in <h3>. I see (sic!) larger font size for higher
ranking headings *just* as the *default* visual cue of their rank. And,
btw, lower ranking headings have by default smaller font sizes than body
text. In a word, font size, as such, should be a non issue in this
discussion thread.

As authors may, and rightfully so, choose other means to express
visually the underlying logical hierarchy. After all, the styling the
author chooses is just a suggestion, which the user can override with
his or hers preferred styles *if the underlying structure permits it*,
which in my view is all 1.3.1 is about. In a word, as "G141 Organizing a
page using headings"
<https://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/G141> says:
"Success Criterion 1.3.1 requires that the headings be marked such that
they can be programmatically identified."

And the above criterion is the reason of the failure: the several
sub-optimally named <h4>Examples</h4> have several subsections that
should be programmatically identified, but the STRONG element is used
instead of H5. See an interpretation of it in action:

https://validator.w3.org/nu/?showoutline=yes&useragent=Validator.nu%2FLV+http%3A%2F%2Fvalidator.w3.org%2Fservices&acceptlanguage=&doc=http%3A%2F%2Finclusivedesignprinciples.org%2F

In which the outliner has no idea about umpteen existing subsections.

Very sadly, your example page mimics the HTML 5.2 Rec
<https://www.w3.org/TR/html52/textlevel-semantics.html#elementdef-strong>
which uses the same structure and even gives advice according to it's
use in the prose:

"<strong>Importance</strong>: The strong element can be used in a
heading, caption, or paragraph to distinguish the part that really
matters from other parts that might be more detailed, more jovial, or
merely boilerplate.

For example, the first word of the previous paragraph is marked up with
strong to distinguish it from the more detailed text in the rest of the
paragraph."

But that is not all: the STRONG element may be used (among other uses)
to mark up a warning, caution notice, or to denote contents that the
user needs to see sooner than other parts of the document.

At least the two mentioned document authors chose to use the ambiguous
STRONG, which has changed it's meaning from spec to spec (I bet nobody
knows it's meaning anymore) over H5, which has maintained semantics
quite nicely. I've done that also, for reasons that might have been
justifiable about two decades ago.

--
Best wishes, Osmo

On 26/03/2018 12:00, Fernand van Olphen wrote:
> If you take a look at this website: http://inclusivedesignprinciples.org/
>
> The heading "The principles" (h2) is set in a smaller font than the headings below, like "Provide comparable experience" (h3). The visual weight of the latter is clearly different.
>
> According to 1.3.1, and the discussion in this thread, is this wrong? Which, if it is, feels awkward to me, because the headings on this website logically follow one another.
>
> Fernand van Olphen
> Accessibility Advisor
> Municipality of the Hague
> De disclaimer van toepassing op e-mail van de gemeente Den Haag vindt u op: http://www.denhaag.nl/disclaimer
> > > > >