Heading semantics in Timeline Navigation available to VoiceOver be separate from control
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 38/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- javascript
- Domain
- accessibility, frontend
Research direction
Start by locating the Timeline Navigation implementation that renders the tl-timemarker and tl-headline markup shown in the issue, then inspect its existing accessibility behavior with VoiceOver. Done means the timeline item exposes heading semantics separately from its activation control, with the item name, date range, and instruction conveyed without requiring navigation to a parent element.
Written by the indexing model from the issue text.
Description
| Issue Description | WCAG Criteria | Status | Category | Example | Notes |
|---|---|---|---|---|---|
| Heading semantics in Timeline Navigation available to VoiceOver be separate from control | Enhancement | Identified | Screen reader | <div class="tl-timemarker tl-timemarker-with-end" tabindex="-1" id="ada-lovelace-marker" aria-label="Ada Lovelace, from December 10, 1815 to November 27, 1852, press space to show">…<div class="tl-timemarker-content-container tl-timemarker-content-container-long tl-timemarker-content-container-small"><div class="tl-timemarker-content">…<div class="tl-timemarker-text"><h2 class="tl-headline tl-headline-fadeout">Ada Lovelace</h2></div></div></div></div> | VoiceOver can navigate by headings in the Timeline Navigation but then must navigate "up" to the named div with the click behavior.A structure more like this could be cleaner:<h2 aria-label="Ada Lovelace, from December 10, 1815 to November 27, 1852"> <button tabindex="-1" aria-describedby="tl-timemarker-description"> <div class="tl-timemarker-media-container" aria-hidden="true"><span class="tl-icon-image"></span></div> Ada Lovelace</button></h2>…<div hidden id="tl-timemarker-description">press space to show</div> |
- Dominant language
- JavaScript
- Stars
- 3.2k
- Forks
- 645
- PR merge metrics
- No merged PRs in 30d
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from NUKnightLab/TimelineJS3
-
Difficulty 2/5 1-3 hours Newbie friendliness 65/100
NUKnightLab/TimelineJS3#797 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 68/100
NUKnightLab/TimelineJS3#617 ·
-
Bug CSS
Difficulty 1/5 Under an hour Newbie friendliness 62/100
NUKnightLab/TimelineJS3#602 ·
-
Difficulty 4/5 3-5 days Newbie friendliness 35/100
NUKnightLab/TimelineJS3#904 ·
-
Difficulty 4/5 3-5 days Newbie friendliness 35/100
NUKnightLab/TimelineJS3#902 · 2 comments ·
All issues in NUKnightLab/TimelineJS3
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
HarperFast/skills#96 ·
-
[Block] Latest Posts [Type] Bug
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Automattic/studio#4908 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 86/100
sugarlabs/musicblocks#8847 ·