No Code Attached Yet a11y a11y-audit-backlog a11y-priority-moderate (Medium) a11y-ms1b-quickwins
avatar mbeganyi-a11y
mbeganyi-a11y
7 Sep 2026

Steps to reproduce the issue

Milestone 1a finding ID M1a-038
Backlog priority Medium
Severity — carried from Milestone 1a Moderate
Implementation effort Medium
Target milestone(s) MS2a — Design Tokens and Core Components; MS3a — Frontend Template Build
WCAG 2.2 success criterion 1.3.1 Info and Relationships; 2.4.4 Link Purpose (In Context)
Responsibility tag(s) from report Development, Design
Affected Joomla area/component Cassiopeia — article tag links — Milestone 1a finding #38
Affected user journey(s) 02 — Frontend Template (Cassiopeia)

Cassiopeia article showing a group of tag links, including Millions, beneath the article content

Audit finding

Cassiopeia displays article tags as a group of links. Visually, their design and position make it clear that they are tags.

Programmatically, the tags are standalone links within an unlabelled list. Assistive-technology users receive no indication that the links represent tags.

The report shows the current structure as an unlabelled <ul class="tags list-inline"> containing tag links. It suggests labelling the existing list, for example with aria-label="Tags", or using a labelled grouping container.

User impact

Screen-reader users may encounter links such as “Millions” without understanding that they are tags or that activating them will filter content by that tag.

When reviewing a page's list of links, users may see several short, ambiguous link names without enough context to decide whether to follow them.

This can make it harder to understand the article's subject categories and to navigate to related content.

The issue affects the meaning of the link group, not merely the visual presentation of individual tag buttons.

Remediation plan

Provide a programmatic relationship that identifies the links as tags

  • Give the tag list an accessible name that identifies it as tags
  • Consider aria-label="Tags" on the existing list, or use a labelled grouping container
  • Ensure the accessible name is translatable
  • Ensure the label is concise and does not duplicate the word “tags” unnecessarily for every link
  • Preserve the existing visual tag presentation unless a design change is separately agreed
  • Ensure the tag links remain operable with keyboard and pointer input
  • Preserve visible focus indicators
  • Ensure the tag group remains associated with the article or content item to which it belongs
  • Apply the corrected structure to the shared tags-list component
  • Verify article, category-blog, contact, and other Cassiopeia views that render the same component
  • Do not rely on visual styling or position alone to convey that the links are tags

Preconditions

  • Use Joomla 6.2 with the Cassiopeia frontend template
  • Use a test site with at least one article that has one or more tags
  • Ensure the tags are displayed on the article view or another Cassiopeia view that renders them
  • Record the exact Joomla build, browser name and version, operating system, viewport dimensions, and browser zoom
  • Record the screen reader and browser combination if testing announcements
  • Start at 100% browser zoom
  • Do not modify production content merely to create test tags

Steps to reproduce

  1. Open the frontend of the test site using Cassiopeia
  2. Open an article that displays tags
    • The report example is an article associated with the “Millions” tag
    • Record the article title and URL used
  3. Locate the group of tag links
  4. Inspect the tag group using Developer Tools
  5. Record the tag container's element type, class, accessible name, and DOM structure
  6. Record whether the list or grouping container has an accessible name
  7. Record each tag link's accessible name and destination
  8. Check whether the links are identified as tags through a label, heading, or other programmatic relationship
  9. Capture the tag group, its links, and the relevant DOM
  10. Repeat on another Cassiopeia view that renders tags, if available
    • Record any difference in structure or accessible naming

Screen-reader verification

  1. Use a screen reader with the browser combination being tested
  2. Navigate to the article containing tags
  3. Navigate by links and record how each tag link is announced
  4. Navigate by lists or landmarks, if supported, and record whether the tag group is identifiable
  5. Move to the tag group in reading order and record the announced context
  6. Activate one tag link only if using a test environment where the resulting tag view is safe to open
  7. Record whether the destination and purpose are understandable before activation
  8. Repeat with at least one additional screen reader if available
  9. Record the screen-reader name, version, browser, and operating system

Verification after remediation

  1. Open an article with tags in Cassiopeia
  2. Confirm that the tag group has an accessible name such as “Tags”
  3. Confirm that the name is exposed to assistive technology
  4. Confirm that the tag links remain keyboard operable and visibly focused
  5. Confirm that the group remains associated with the correct article
  6. Repeat in the other Cassiopeia views that use the component
  7. Confirm that the accessible name is translatable
  8. Record the final DOM structure, accessible name, and screen-reader announcements

Version

6.2

Expected result

The group of article tag links is programmatically identified as tags.

Assistive-technology users can understand that links such as “Millions” are tags and that activating one will lead to tag-related content.

The tag group remains keyboard operable, visibly focused, and correctly associated with the content it describes.

Actual result

The tag links are standalone links within an unlabelled list.

Assistive-technology users receive no indication that the links are tags.

The current Joomla 6.2 build and Cassiopeia configuration need to be checked to establish whether the issue persists.

What device were you using? (eg, phone, laptop)

Desktop web

What web browser were you using? (eg, Chrome, Safari)

Chrome, Firefox, Edge, Safari

Assistive Technology?

VoiceOver, JAWS, NVDA

Additional Comments

The browser and assistive-technology entries above are carried forward from the original issue and do not represent a new verification of every combination against Joomla 6.2.

Development and Design are the responsibility tags in the original report.

The report's aria-label="Tags" example is one possible remediation. A labelled grouping container is another. Verify the chosen approach with assistive technology.

The accessible name should be translatable and should not assume that every implementation uses English.

This issue concerns the accessible context of the tag group. It does not require changing the destination or filtering behaviour of individual tag links.

MS2a is proposed for the shared tags-list component, with MS3a covering the documented Cassiopeia integration.

avatar mbeganyi-a11y mbeganyi-a11y - open - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 7 Sep 2026
Labels Added: a11y a11y-audit-backlog a11y-priority-moderate (Medium)
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 7 Sep 2026
avatar joomla-cms-bot joomla-cms-bot - change - 7 Sep 2026
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 7 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 8 Sep 2026
Title
…
Tags are just stand-alone links without context
Cassiopeia: Tags are just stand-alone links without context
avatar mbeganyi-a11y mbeganyi-a11y - edited - 8 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 8 Sep 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 8 Sep 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 22 Oct 2026
Labels Added: a11y-ms1b-quickwins
avatar mbeganyi-a11y mbeganyi-a11y - labeled - 22 Oct 2026
avatar mbeganyi-a11y mbeganyi-a11y - change - 26 Oct 2026
The description was changed
avatar mbeganyi-a11y mbeganyi-a11y - edited - 26 Oct 2026
avatar drmenzelit drmenzelit - change - 30 Oct 2026
Status New ⇒ Closed
Closed_Date 0000-00-00 00:00:00 ⇒ 2026-10-30 11:11:10
Closed_By ⇒ drmenzelit
avatar drmenzelit drmenzelit - close - 30 Oct 2026

Add a Comment

Login with GitHub to post a comment