These are the links of my Navbars:
1- Navbar 1
2- Navbar 2
- The hamburger menu icon needs to be in a
<button>. Right now I can’t open it with the keyboard. Changing it to a button will fix this. Also, it needs to have some text associated with it for people who use screen readers. When focus is set on the hamburger button the screen reader needs to tell the reader what the button is for. So the text should be something like “Show Menu”. You can either put the text inside the button and visually hide it or add it to the button with the aria-label attribute.
- If you want to be semantically correct then I think you need to use the
Navbar 2 looks basically the same as 1 except the hamburger icon is on the right side. Same issues as above.
Thanks a lot, I will fix these issues
I prefer it on the left side. I don’t know why, may be because a lot of websites have it on the left. So it just comes naturally.