WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Headings or not headings?

for

From: Mark Magennis
Date: Feb 2, 2022 8:05AM

I guess this comes down to semantics. Are those semantically headings? Or is a list of link/description pairs sufficient semantics? You could argue that this should be coded as a description list using <dl> <dt> <dd>.

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Fernand van Olphen
Sent: 02 February 2022 14:34
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: [EXTERNAL] Re: [WebAIM] Headings or not headings?

[You don't often get email from <EMAIL REMOVED> . Learn why this is important at http://aka.ms/LearnAboutSenderIdentification.]

Thanks Patrick!

A follow up question: what if something looks like a heading, but isn't marked up with a <h#>, is there a way to pass 1.3.1?

See this example: Gov.uk, https://www.gov.uk/education/funding-and-finance-for-students#policy_and_engagement

(code simplified)

<ul>
<li>
<a>Student finance login
<p>Your student finance online account - check payment dates, track an application, change details, reset password, find customer reference numbers
</li>

<li>
<a>Repaying your student loan
<p> When you start repaying your student loan, your monthly repayments, what to do if you have 2 jobs or are self-employed, how to get a refund if you've overpaid.
</li>

Will this pass 1.3.1?


Met vriendelijke groeten,

Fernand van Olphen
Functioneel beheerder
06 526 720 46
www.denhaag.nl<;http://www.denhaag.nl>;

Van: WebAIM-Forum < <EMAIL REMOVED> > namens Patrick H. Lauke < <EMAIL REMOVED> >
Verzonden: woensdag 2 februari 2022 12:29
Aan: <EMAIL REMOVED> < <EMAIL REMOVED> >
Onderwerp: Re: [WebAIM] Headings or not headings?

On 02/02/2022 11:00, Fernand en Jolanda van Olphen wrote:

> - SC 1.3.1: Text that *functions* as a heading must be *coded* as a
> heading. Meaning: if you use a heading, use the h-element.
> - SC 2.4.6: An element *coded* as a heading must *function* as a
> heading. Meaning: the heading must describe the content that follows it.

Slight correction on that last one: 2.4.6 is disconnected from 1.3.1. So regardless of whether the heading is *coded* correctly or not, if the thing/text acts as a heading, it should be sufficiently descriptive.

> I see a lot of websites with headings that, I think, don't really
> describe the content that follows it.
>
> Example: BBC.com
> (Code simplified)
>
> <h3><a href= >World record lightning bolt lit up three US states </a></h3>
> <a href=>EUROPE</a>
>
> <h3><a href=>The overlooked geniuses of 1922</a></h3> <a
> href=>CULTURE</a
>
> My question:
> To me this is a misuse of headings. Although they look like headings,
> they don't really describe the content that follows it. Any thoughts?

Pedantically, you're right, those don't "head up" any following content.
They do for stuff later on in the page (where there's an extra paragraph of content after the heading). This would, in my mind though, be a very borderline/mild failure (which of course means nothing, as WCAG doesn't have nuance...it's a binary pass/fail, so there's no "mild failure" per se).

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke