citizenlabsgr / website

Citizen Labs' website.
https://citizenlabs.org
MIT License
5 stars 5 forks source link

More accessibility for dropdown #43

Closed diiq closed 6 years ago

diiq commented 6 years ago

Adds aria-haspopup, a title, and does a little more styling to even out the visual weight of the chevron.

Allen616 commented 6 years ago

Submenu is shown deployed when opening site on iPhone. I have seen for other sites a "mobile" version of navigation that puts it in a "box." Is the chevron the preferred way to show a drop down from UX POV? I didn't understand it at first to choose the chevron for subnav.

IMG_8224.jpg

diiq commented 6 years ago

Right you are. Somewhat fixed; hadn't looked at the nav on mobile, def needs some more love.

Allen616 commented 6 years ago

Here is an example of what I was trying to explain. IMG_8227.jpg IMG_8228.jpg IMG_8229.jpg

diiq commented 6 years ago

So, just to clarify -- @oneblackcrayon's dropdown was merged last night; this PR is just to improve accessibility of the dropdown for screenreaders.

Re: is a chevron the right symbol? If you're asking "what's the right way to design a nav drop-down?" you've already heard my answer: on a simple site like this, I don't think there is one; I thought it was better without the drop-down at all.

Re: the navigation drawer: sure, that's one way we could dress up the nav on mobile, and I'd be happy to do it, or discuss other mobile alternatives (in a different issue/PR).