Interesting video! I’ve been learning more about accessibility but finding it hard to find a lot of examples of how to implement, not just what you should implement. For the first theme with the mega menu. You stated you had to be able to hit Esc to close the menu and the left and right arrows to move to the next or previous submenu. My question is, say you’ve pressed the down arrow and gotten to the last link in the submenu, if you press the down arrow one more time is the focus supposed to go back to the first link in the submenu or back to the parent element that toggles the submenu? Also, does the same functionality apply to both mega menus as well as mobile menus with a hamburger button?
Thank you for watching and learning about accessibility! Could send me a timestamp of my examples with the arrow keys on menus? Usually implementing arrow key navigation is optional but they must be available to be tabbed through.
@@WebAccessibility It's around the 7:55 mark. I just watched that part again and I misunderstood. You were saying a person should just be able to tab past a submenu without it opening if they want, but this example it looks like once they landed on a submenu the tab focus automatically went inside and you couldn't get out until you tabbed through all the sub links inside.
@@artsycoder533 Yes indeed, since the sub-menus opened on focus (which is super bad) it makes it difficult to Tab through the page. I think the video was confusing because I used a bad video animation but I am not doing it for any current and future videos. Let me know if you have other questions.
Really interesting to watch! :) I have a couple of questions, hope you don’t mind: - Is it recommended to always underline links? Can the underline be generated with something different like border-bottom or a pseudo-element? - Is it ok to visually hide form labels while keeping them available for screen readers?
Thank you Rodrigo! 1. You should always underline links, the way you do it is up to you. 2. It is not. All form fields should have visible labels. In rare circumstances you can hide a label visually, but then you'd be forced to provide another one, otherwise you'd be violating Success Criterion 3.3.2 Labels or Instructions Feel free to ask accessibility questions :)
Interesting video! I’ve been learning more about accessibility but finding it hard to find a lot of examples of how to implement, not just what you should implement. For the first theme with the mega menu. You stated you had to be able to hit Esc to close the menu and the left and right arrows to move to the next or previous submenu. My question is, say you’ve pressed the down arrow and gotten to the last link in the submenu, if you press the down arrow one more time is the focus supposed to go back to the first link in the submenu or back to the parent element that toggles the submenu? Also, does the same functionality apply to both mega menus as well as mobile menus with a hamburger button?
Thank you for watching and learning about accessibility! Could send me a timestamp of my examples with the arrow keys on menus? Usually implementing arrow key navigation is optional but they must be available to be tabbed through.
@@WebAccessibility It's around the 7:55 mark. I just watched that part again and I misunderstood. You were saying a person should just be able to tab past a submenu without it opening if they want, but this example it looks like once they landed on a submenu the tab focus automatically went inside and you couldn't get out until you tabbed through all the sub links inside.
@@artsycoder533 Yes indeed, since the sub-menus opened on focus (which is super bad) it makes it difficult to Tab through the page. I think the video was confusing because I used a bad video animation but I am not doing it for any current and future videos.
Let me know if you have other questions.
Really interesting to watch! :)
I have a couple of questions, hope you don’t mind:
- Is it recommended to always underline links? Can the underline be generated with something different like border-bottom or a pseudo-element?
- Is it ok to visually hide form labels while keeping them available for screen readers?
Thank you Rodrigo!
1. You should always underline links, the way you do it is up to you.
2. It is not. All form fields should have visible labels. In rare circumstances you can hide a label visually, but then you'd be forced to provide another one, otherwise you'd be violating Success Criterion 3.3.2 Labels or Instructions
Feel free to ask accessibility questions :)
Very nice 👌👍👌
Thanks, Rahul! Glad you enjoyed the video :)