foundation / foundation/yeti

Accordion - heading structure

Open
#12,465 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
29.8k
Forks
5.4k
Avg merge
25m
Merged PRs (30d)
1

Description

## What is missing?

Heading structure applied to accordion items for readability.

## What is wrong now ?

Currently no heading structure applied, screen reader lists this out as an item.

## Possible Solution

If an accordion sits underneath a H1 item, all accordion headings to be H2 (then content within this to start from H3). If an accordion sits underneath a H2 item, all accordion headings to be H3 etc.

So for example
H1 (Heading - page heading)
H2 (Accordion item - added automatically when adding accordion, content editors do not need to update)
H3 (Heading within accordion content - added by content editor)

or

H1 (Heading - page heading)
H2 (Sub heading - added in page by content editor)
H3 (Accordion item - added automatically when adding accordion, content editors do not need to update)
H4 (Heading within accordion content - added by content editor)

## Context

To provide a structure of content within the page using accordions

## Your Environment

- Foundation version(s) used: 6.7.4
- Browser(s) name and version(s):
- Device, Operating System and version:

## Checklist

- [ ] I have read and follow the CONTRIBUTING.md document.
- [ ] There are no other issues similar to this one.
- [ ] The issue title and template are correctly filled.

Contributor guide

Open the contributing guide

Research direction

No file, test, or entry point is named in the issue. Start by locating the accordion implementation and any existing accessibility tests, then verify how heading levels are determined in nested page content. Done means accordion items expose the requested semantic heading hierarchy and the behavior is covered by tests.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
accessibility, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.