
Tagged: Focusable elements
-
AuthorPosts
-
July 2, 2025 at 2:38 pm #1486243
Hi,
the topic of accessibility is currently on our minds. We actually have it well under control, and the Enfold theme is exemplary in this regard. Currently, we’re working on focusable elements, such as buttons that indicate the action behind them when hovered over. If you only use the keyboard, this change in the button color isn’t visible. This leads to complaints. Do you have any ideas how to solve this? This also applies to links or searches…basically, every interaction!Regards
July 4, 2025 at 4:42 am #1486293Hey Biggy,
Thank you for the inquiry.
We may need to review a test page to better understand the issue. Please create one and provide the login details in the private field. Also, make sure that Appearance > Theme File Editor is accessible.
Best regards,
IsmaelJuly 4, 2025 at 8:39 am #1486302take a look at the rules for the hover state and apply them to the focus-visible state.
f.e.: on that page here – the first button on top: https://kriesi.at/themes/enfold-overview/
.avia-button.avia-color-light:focus-visible { opacity: 0.7; transition: all 0.4s ease-in-out; } .av-icon-on-hover:focus-visible .avia_button_icon { width: 1.5em; opacity: 1; }
the focus-visible state ( or focus-within too ) do not influence a clicked or hover state.
This means that normal navigation is not affected, contrary to the focus state.July 4, 2025 at 11:42 am #1486313Thanks, Guenni,
The issue is that the buttons in Enfold don’t meet the WCAG standard for keyboard accessibility. We do meet the 4:1 contrast ratio requirement, and we also tested black and white. It’s 21:1, which is extreme. But when reading the page with the keyboard, the button doesn’t change, even though the focus-visible is set to !important in the CSS.Regards
July 4, 2025 at 8:53 pm #1486326you can see how focus-visible status leads to a Tab Navigation: https://guenterweber.com/
but all css is manually set !July 4, 2025 at 9:41 pm #1486327Hi Guenni,
We always knew you really knew Enfold inside and out. And that’s really good.
Thanks for the help. This post can be closed.
Regards
BiggyJuly 5, 2025 at 10:49 am #1486334Hi,
Great, I’m glad that @guenni007 could help you out :-)
Please open a new thread if you should have any further questions or problems.
Best regards,
Rikard -
AuthorPosts
- The topic ‘Focusable elements’ is closed to new replies.