Staging Review finding: Use of H3 heading in banner

[shiragoodman]

Need help? Please review how to read a Staging Review ticket. Tag @platform-governance-team-members on Slack if you need further assistance.

Product Information

Team: Facilities
Product: VAMC
Feature: Alternative Alert Banners

Findings details

VA.gov Experience Standard - issue: User can't determine next steps in a flow.
VA.gov Experience Standard - category: Findability
Launch-blocking: No
Design System review: No
Collab Cycle Reviewer: @briandeconinck (Accessibility)

Description

Banner headings are hard-coded in the component as H3s. This isn't technically against spec (headings that come before the H1 count a little differently, as do headings in a role="region") and is consistent with other banners in other contexts (eg. on the VA.gov homepage). But it's definitely unusual for a section of content to be indicated with an H3 without a parent H2, and that may be confusing to some screen reader users trying to make sense of the page structure.

The actual impact of this may not be huge, since it's in a region labeled as an info banner and so long as content editors are providing clear and descriptive headings. But I think this is a potential point of confusion that could be cleared up pretty easily.

Recommended action

I think my expectation here would be for the banner to use an H2 rather than an H3. But chatting with @laflannery about this, this is definitely a bigger conversation that should involve CAIA folks --- what are the heading rules and expectations when headings appear before the H1 for the main content? Ultimately that's a style choice that needs to be defined.

(Such a conversation should also consider the headings in the left nav menus, which are obviously out of scope for this review.)

References

• Accessibility Defect Severity: 4: Low. Consider fixing or exploring in 2-4 sprints post-launch.
• WCAG Success Criteria: N/A
• Modality: Screen reader
• Design System Component: N/A
• Design System Pattern or Template: N/A
• Design System Foundation: N/A
• Content Style Guide: N/A
• Context: N/A

---

Next Steps for the VFS Team

• Questions? For the most timely response, comment on Slack in your team channel tagging @platform-governance-team-members with any questions or to get help validating the issue.
• Ticket ownership: If you believe that this issue is out of scope, not your team's responsibility, or a Design System issue, comment and tag @platform-governance-team-members on your team channel in Slack to provide an explanation and who you believe is responsible. The Governance team will follow up.
• Close this ticket when the issue has been resolved or validated by your Product Owner.

[jilladams]

@laflannery since I missed Staging Review, and we are not tracking this in a Sitewide ticket yet, can you clarify if this is something you recommend we follow up on changing, or will leave as is from an a11y perspective?

If no recommendation to change, this can go ahead and close.

cc @Agile6MSkinner

[laflannery]

It's something that needs a much wider discussion, with DST/Content/etc. How does the VA want to structure banners and headers on VA.gov to fit within the overall heading structure of a page? We need to make sure everyone is on board with any decisions made so all banners follow suit