Accessibility

Resolved Anonymous User 17185533
(@anonymized-17185533)

5 years, 2 months ago
After the last theme update, Lighthouse analysis returns these errors:
– The [aria- *] attributes do not correspond to their respective roles
Each ARIA role element supports a certain subset ofaria- *attributes. If they do not match, the aria- * attributes will not be considered valid. Further information.
Rejected items
Search
<a href="#" class="toggle search-toggle" data-toggle-target=".search-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-search-modal" data-set-focus=".search-modal .search-field" aria-pressed="false">
Menu
<a href="#" class="toggle nav-toggle" data-toggle-target=".menu-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-menu-modal" aria-pressed="false" data-set-focus=".menu-modal">

– The header elements are not in sequential descending order
Headings in the correct order that do not skip levels describe the semantic structure of the page, making it easier to navigate and understand when disability technologies are used. Further information.
Rejected items
h4
h5.title

– The name of the links is indistinguishable
Distinguishable, unique, and focusable link text (including image alt text if used as a link) improves the browsing experience for screen reader users. Further information.
Rejected items
a
<a href="https://andersnoren.se/themes/chaplin/wp-content/uploads/2019/07/Chaplin-Image-2.jpg">
a
<a href="https://andersnoren.se/themes/chaplin/wp-content/uploads/2019/07/Chaplin-Image-3.jpg">
- This topic was modified 5 years, 2 months ago by Anonymous User 17185533.
- This topic was modified 5 years, 2 months ago by Anonymous User 17185533.
The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

Theme Author Anders Norén
(@anlino)

5 years, 2 months ago

Hi @wporgspix,

Thanks for posting. I’ve updated the elements with the aria-pressed attribute to also have the role="button" attribute, so the aria attributes map correctly. I’ve also updated the widget titles to have h3 headings instead of h5, so the headings are sequential in the custom widgets. The updates are included in version 2.6.3, which should be live now.

The rest of the issues you mention (missing alt tags, other non-sequential headings) are all within the content of the block editor, so you can address those yourself when you edit your content.

— Anders

Thread Starter Anonymous User 17185533
(@anonymized-17185533)

5 years, 2 months ago

Thank you!
Great job, congratulations.
Thread Starter Anonymous User 17185533
(@anonymized-17185533)

5 years, 2 months ago
I have updated the theme. The ARIA error is gone.
I still have the error for the H4 order, but I need to investigate this better, because the error is present in a block of “characteristics” COBLOCKS.
As for the error about indistinguishable link names, I cannot intervene from the block editor, because the former refers to this theme element >
a.toggle.search-toggle (search):
```
<a href="#" class="toggle search-toggle" data-toggle-target=".search-modal" data-toggle-screen-lock="true" data-toggle-body-class="showing-search-modal" data-set-focus=".search-modal .search-field" aria-pressed="false" role="button"><div class="toggle-text">
Cerca</div>...</a>
```
The other refers to this theme element >
a.to-the-content
<a href="#post-inner" class="to-the-content">...</a>

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Accessibility’ is closed to new replies.