Accessibility Options Shaper Theme
Stefanie Decker
Dear Sir or Madam,
we are currently using helix ultimate template and are working at our joomla site to improve accessibility.
Some accessibility problems are related to the template. We are asking gently, if you could change these options. Following problems:
<ul class="menu"> (On mobile) --> Could you please give an aria-title for this element
On the data protection field of contact forms, the aria title of the checkbox and text is "policy text". Could insert a more detailed name and group button and text
Accordion SP Page Builder: At the title there is Aria-label. It should be "Aria-title".
Accordion SP Page Builder: Could you insert an aria title at icons showing up there
Tabs SP Page Builder: At the title there is Aria-label. It should be "Aria-title".
The arrow down at submenus on the menu of the template doesnt have an aria name / title / etc. alt
Carousel SP Page Builder: At the carousel hidden elements should be declared right:We used IBM Equal Access Accessibility Checker to check the accessibility options at the page.
We are looking forward for your reply.
Kind regards
Mehtaz Afsana Borsha
Accepted AnswerHi
Thanks for contacting us and sorry for your issue. I will inform our DEV team about it so that they can take care of it.
-Regards.
Paul Frankowski
Accepted AnswerIf I may...
Menu - do we talk about Mobile Menu? What title should be added "Mobile Navigation" ?
For example this would be correct
<ul class="menu nav-pills" aria-label="Mobile Menu">
title="Mobile Menu" - can be added, but is not needed by WCAG
Can you show me example website where Menu HTML structure is correct accoring to IBM Equal Access Accessibility checker ? I need to see to tell more.
Aria-title - does not exist, there is title="" or aria-label="" in HTML syntax.
Aria-label is fully correct, should be kept, it provides an accessible name for the element.
- offical guide: https://www.w3.org/WAI/tutorials/menus/structure/
Paul Frankowski
Accepted AnswerI like to be inquisitive, and I checked out the site https://www.ibm.com/able/ (that is owner of IBM Equal Access Accessibility Checker tool), and their dekstop & mobile menu looks like that
I marked aria-label in menu using red arrow. No title or aria-title (!)
Does the shoemaker walk without shoes? Or there is mistake in translation, hmm?!
Paul Frankowski
Accepted AnswerAbout " arrow down at submenus on the menu of the template doesnt have" - right now is FA icon. I fully agree that that element needs small accessibility improvment. I have to check WCAG suggestions.
Probably aria-hidden="true" is needed for mobile menu <span class="menu-toggler"></span>