[#45594] - [6.1] mod_languages: Include visible label in aria-label for accessibility
- Pending
- Medium
- Build: 5.3-dev
- # 45594
- Diff
- wk1337:feature/mod_languages-accessibility-labels
User tests: Successful: Unsuccessful:
Summary of Changes
This Pull Request improves accessibility for speech-input users in the mod_languages module by ensuring the visible text of language links matches the programmatic accessible name (aria-label).
Previously, the aria-label used only the native language name (e.g., Deutsch), while the visible text could be just the language code (e.g., DE). This mismatch breaks voice interaction workflows, where users say what they see to focus interactive elements.
Changes implemented:
• Updated how aria-label attributes are generated in both dropdown and list views.
• The new label format combines the visible text (e.g., EN) with the native name (e.g., English) — e.g., aria-label="EN – English".
• This ensures the visible label is always a substring of the accessible name, satisfying WCAG 2.1 Success Criterion 2.5.3 – Label in Name.
Testing Instructions
1. Enable the language switcher module (mod_languages) on a multilingual Joomla site.
2. Configure it to display language codes (e.g. EN, DE) instead of full names.
3. Use browser developer tools or a screen reader to inspect the aria-label of each language link.
4. Confirm that the visible text (e.g. EN) is included in the aria-label value (e.g. EN – English).
5. Optionally test with speech input or accessibility testing tools.
Actual result BEFORE applying this Pull Request
• aria-label only contained the native language name.
• Visible code (e.g. EN, DE) was not present in the accessible name.
• Speech-input users could not select a language by saying the visible label.
Expected result AFTER applying this Pull Request
• aria-label includes both the visible label and native name (e.g. EN – English).
• Visible label and accessible name match.
• Fully supports speech-based interaction with language selector.
| Status | New | ⇒ | Pending |
joomla-cms-bot
- | Category | ⇒ | Modules Front End |
| Labels |
Added:
PR-5.3-dev
|
||
| Labels |
Added:
a11y
|
||
@chmst @drmenzelit @brianteeman can you please give feedback to this pr?
This pull request has been automatically rebased to 6.1-dev.
This is a good feature request.
The solution works only for drop-down, not for horiziontal as we have for example in the default Cassiopeia.
It seems that the module has some a general issues which are not in scope of this PR.
Hi @chmst, thanks a lot for your review!
From my side the change now also works for the horizontal list layout (e.g. the default Cassiopeia header). For the list layout the accessible name is built here:
$lbl = '';
if ((($params->get('full_name') === 0) && ($params->get('image') === 0)) || (!$language->image)) {
$lbl = 'aria-label="' . strtoupper($language->sef) . ' – ' . $language->title_native . '"';
}I also agree with you that the module has some more general issues. I tried to keep this PR focused on improving the accessible name only.
| Title |
|
||||||
This pull request has been automatically rebased to 5.4-dev.