Archived topic
Accessibility Question
3 replies · Started by Hans on August 11, 2022
Hi,
I have a website that is under audit for accessibility, in the results are a few problems that I'm not able to fix myself.
Website: https://tropiqua.nl
1. When visitors use the mouse or keyboard to navigate the main menu items in the navigation at the top of the page (any page), submenu items automatically appear below the item that has hover or focus. If something appears when a visitor hovers over it with the mouse or focuses on it with the keyboard, the visitor must also be able to easily remove it without having to move the mouse, for example with the escape key.
QUESTION: Is there a way to make the menu focus disappear with escape button?
2. After going through all visible interactive elements on the homepage, a number of invisible links, such as tropiqua.nl/abonnementen and tropiqua.nl/facilities, receive keyboard focus due to a hidden navigation menu.
QUESTION: The focus continues with the links in the hidden mobile slide menu. Is it possible to prevent skipping to this hidden menu?
Hans
Hi there,
1. The alternative method would be to set the Customizer > Layout > Primary Navigation --> Navigation Dropdown to Click Arrow. This provides the user the option to Open the submenu or not open the submenu.
Is that a working solution ?
2. Off Canvas Panel has a few Accessibility improvements that will be patched in the next GP Premium release.
To fix the issue you're having try this CSS:
@media(min-width: 769px) {
#generate-slideout-menu {
display: none;
}
}
This will set the navigation to display none which will remove it from the normal flow of the document on larger screens where it is not visible.
That did solve both problems, David, thank you very much!
Hans
Glad to hear that!
