Website Bootstrap Menu Accessibility Issues

[JamoCA]

The website menu doesn't appear to be accessible on mobile devices or when using a desktop viewport that isn't opened full screen. You can only knowingly access options that are visible and within the browser's viewport. Keyboard focus + tabbing works, but doesn't identify anything focused that is hidden beneath the viewport height

[pfreitag]

Thanks @JamoCA - I have fixed it on desktop, mobile issue still needs to be fixed

[JamoCA]

Ahh... much, much better! Sometimes I develop on a 26" monitor and I tend not to open up my reference browsers to full height.

FYI: I was going to download the project and contribute, but I don't use Bootstrap. (I've used SmartMenus. It requires jQuery, easy to implement, works on all devices/screens and is Section 508 compliant.)

[shaedrich]

The question is: Does such a huge menu even make sense for mobile users? How would you browse the side as a mobile user? What would be neat in terms of mobile usability?

[pfreitag]

@shaedrich - that is a good point, it doesn't make sense to have such a huge menu for the mobile users.

[JamoCA]

Another accessible menu option: We've used mmenu.js for smaller screens & mobile devices. Even if you use a menu with many options, the menu choices are collapsed/expandable and are filterable.

If you used this, the menu options would be consistent for all users and you wouldn't have to provide two different experiences.