How to add ARIA Labels for HTML SECTION and DIV Tags

Published December 20, 2018 | Categories: Beacon News
This is an example of ARIA labels for screen readers that read ARIA labels. It ultimately helps the end user.
When you have a portion on the content in a section, it must contain a Head tag. If however is does not contain a head tag, and needs an aria-label to describe the section, simply add the region role.
This will allow the screen reader to detect it as a new region and then it will read out the ARIA label.
Examples: Using a SECTION Tag:
<section aria-label=”Brief description of this section”>
<h2>Heading Title</h2>
<p>Content area content</p>
</section>
Using a DIV Tag:
<div role=”region” aria-label=”Brief description of this area”>
<p>Content area content</p>
</div>
Recent Posts

Hello from Beaconville: High Ed Conference Wrap-Up
View this Story

Cue the Confetti: Celebrating 2022's Higher Ed Wins So Far
View this Story

Beacon Technologies Opens Second Location in Carolina Beach, NC
View this Story

Why You Need Audience Personas For Your Website Content
View this Story