screen readers and html 5 elements

Hey ya'all,

My team is struggling with an issue regarding adding aria labels to
<section> elements in the markup for a website. Due to the way the site has
been set up in Drupal, it's going to be a pretty heavy development lift to
add an aria label to a particular section (the other sections are fine) due
to the section's unique markup. It looks like this:

<section>

  <div>

    <h2>News</h2>

    news content

  </div>

  <div>

    <h2>Events</h2>

    events content

  </div>

</section>


Because this section contains two divs with different headers, I am not
able to use the aria-labelledby attribute. And because the content editor
might use other blocks instead of news and events, we can't hardcode an
aria-label attribute.

Our testing tool (Siteimprove) flags this this as an "warning" because it
could be a problem for screen readers, but I'm having trouble understanding
why and how to fix it.

Thanks!

++

Michellanne Li
Web Designer

Palantir.net <http://palantir.net/>
773.645.4100

Sign up for occasional emails:  http://www.palantir.net/newsletter
Follow us on Twitter <https://twitter.com/palantir>

Received on Thursday, 17 May 2018 14:56:13 UTC