Problem/Motivation
Headings and subheadings define the structural outline of a page and are critical for accessibility and navigation by assistive technologies.
When heading levels are skipped - for example, jumping directly from a Heading Level 1 (H1) to a Heading Level 3 (H3) - screen readers interpret this as missing or incomplete content. This creates confusion for users who rely on structured navigation to understand page hierarchy.
Example of the issue:
Heading level 1 (Title of the page: Blog)
Heading level 3 (Subtopic, e.g., “Varbase Blog” title for the Featured card - medium display mode)
Expected outline:
Heading level 1
Heading level 2: a topic
Heading level 3: a subtopic
Heading level 2: a new topicSteps to reproduce
- Inspect a page (or component) that renders headings with inconsistent nesting (e.g., H1 : H3).
- Use a screen reader or accessibility audit tool such as axe DevTools or Lighthouse.
- Observe the warning:
- “Manual check: was a heading level skipped?”
- The accessibility tool reports that the heading hierarchy is broken.
Proposed resolution
As the title of the Blog listing block view is not rendered, as the title of the page is Blog
Add <h2 class="visually-hidden">Blog Listing</h2> to the header of the view for the Blog site section
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_blog-10.1.0-beta1
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
- [#3552334] fix(a11y): Corrected missing H2 heading in Blog listing view to correct heading hierarchy
| Comment | File | Size | Author |
|---|---|---|---|
| Blog-a11y-10-15-2025_02_21_PM.png | 616.56 KB | rajab natshah |

Comments
Comment #2
rajab natshahComment #4
rajab natshahComment #5
rajab natshahComment #7
rajab natshah✅ Released varbase_blog-10.1.0-beta1
Comment #8
rajab natshah✅ Released varbase-10.1.0-beta1