Repository navigation
Announcement bar has no landmark role or aria-live region #97
Description
Summary
The announcement bar rendered at the top of the homepage is a plain <div> with no landmark role or live region. Screen reader users have no way to identify it as an announcement, and if the content were to change dynamically it would not be announced.
Affected location
_includes/announcementbar.html:4
<div class="announcement-bar">
<a href="{{ announcement.url }}"><strong>Announcement:</strong> {{ announcement.title }} →</a>
</div>Fix
Add role="region" and aria-label="Announcement" so it appears as a named landmark. If announcements could ever update without a page reload, also add aria-live="polite":
<div class="announcement-bar" role="region" aria-label="Announcement">
<a href="{{ announcement.url }}"><strong>Announcement:</strong> {{ announcement.title }} →</a>
</div>WCAG criterion
1.3.1 Info and Relationships (Level A)
Activity
Aevil1 commentedon Jul 5, 2026
Hi! I’m new to CivicTechTO and wanted to check if you’re open to outside contributions.
I’d be happy to take this issue on. From what I understand, the announcement bar just needs to be updated from a plain
<div>to a named region usingrole="region"and something likearia-label="Announcement".I can put up a small PR for that if it sounds good.
Khasir commentedon Jul 7, 2026
Hi @Aevil1, thanks for offering! Feel free to raise a PR and we'll review.