Problem/Motivation

During an accessibility audit, the Contact Information section on the Contact Us page was flagged with the warning:

Manual check: should this be a heading?

This occurs because “Contact Information” is currently styled using bold text instead of a semantic heading tag.
Screen readers interpret this as plain text rather than a navigational heading, which reduces accessibility and page structure clarity.

'Contact Information' missing heading tag

This violates WCAG 2.2 Guidelines (and WCAG 2.1 §1.3.1 Info and Relationships), which require clear and hierarchical heading structures for assistive technologies.

Proposed resolution

Ensure that this heading level logically follows the existing structure:

Page title →
Contact Us>
Section title →

Ask Us About Anything!
Sidebar title →

Contact Information

Confirm consistent use of heading levels without skipping levels.

  • Replace the bolded Contact Information text with a semantic heading tag
  • Improves screen reader navigation and page outline comprehension.
  • Ensures compliance with WCAG 2.2 heading hierarchy rules.
  • Provides a consistent semantic structure across the layout.

Remaining tasks

  • ✅ File an issue about this project
  • ✅ Addition/Change/Update/Fix to this project
  • ✅ Testing to ensure no regression
  • ➖ Automated unit/functional testing coverage
  • ➖ Developer Documentation support on feature change/addition
  • ➖ User Guide Documentation support on feature change/addition
  • ➖ UX/UI designer responsibilities
  • ➖ Accessibility and Readability
  • ✅ Code review from 1 Varbase core team member
  • ✅ Full testing and approval
  • ✅ Credit contributors
  • ✅ Review with the product owner
  • ✅ Update Release Notes and Update Helper on new feature change/addition
  • ✅ Release varbase-10.1.0-beta1, varbase_core-10.1.60

Varbase update type

  • ✅ No Update
  • ➖ Optional Update
  • ➖ Forced Update
  • ➖ Forced Update if Unchanged

User interface changes

  • N/A

API changes

  • N/A

Data model changes

  • N/A

Release notes snippet

  • [#3553436] fix(a11y): Added proper heading structure for Contact Information section on Contact Us page to comply with WCAG 2.2 accessibility standards
CommentFileSizeAuthor
Contact-Us-v10x01b3-10-20-2025_07_56_PM.png254.19 KBrajab natshah

Comments

rajab natshah created an issue. See original summary.

  • rajab natshah committed 7030bb17 on 10.1.x 
    [#3553436] fix(a11y): Add proper heading structure for Contact...
rajab natshah’s picture

rajab natshah
he/him
commented
Assigned: rajab natshah » s.halawani
Issue summary: View changes
Status: Active » Needs review
Issue tags: +varbase-10.1.0-beta1, +varbase_core-10.1.60
rajab natshah’s picture

rajab natshah
he/him
commented
Assigned: s.halawani » Unassigned
Status: Needs review » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

rajab natshah’s picture

rajab natshah
he/him
commented
Issue summary: View changes

✅ Released varbase_core-10.1.60

rajab natshah’s picture

rajab natshah
he/him
commented
Title: Add proper heading structure for Contact Information section on Contact Us page to comply with WCAG 3.0 accessibility standards » Add proper heading structure for Contact Information section on Contact Us page to comply with WCAG 2.2 accessibility standards
Issue summary: View changes
rajab natshah’s picture

rajab natshah
he/him
commented
Issue summary: View changes

✅ Released varbase-10.1.0-beta1

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.