Drop-down Menus

What do you think about Drop-down Menus??

A year ago - or maybe more - lots of people here at SitePoint helped me make a really nifty Drop-down Menu using only CSS.

Unfortunately, I stored it away, because I didn’t have enough Content to utilize it?! :blush:

Now that my website and my website’s Content is growing, I am thinking that a Horizontal Navigation Bar (CSS only) combined with some Drop-down Menus (CSS only) would be a great way to 1.) Group lots of Sub-Areas together, and 2.) Manage a growing amount of Content.

Thoughts?

Also, would it be acceptable to have a User navigate to a main “Section” in my Horizontal Menu Bar (e.g. “Finance”) and then when the Drop-down Menu appears, have them click on a “Sub-Section” (e.g. “Investing”) and then that would launch a page which is an “index” and shows a listing of all Articles dealing with “Investing”?? (Hope that makes sense?!)

Thanks,

Debbie

IMHO, drop menus are are sign that the site structure has failed. Ideally, you should be able to drill down intuitively to what you need on a site.

Anyhow, whether you use a dropdown or not, make the top level links clickable anyhow, and have an alternative to the drop menu for finding pages. Remember that CSS drop lists don’t work on mobiles (there is no hover) so if drop list links are the only way to access content, it’s inaccessible to users.

Also note that drop menus—especially CSS ones—can be hard for people with coordination difficulties to access, and also to those navigating via the keyboard.

You completely lost me, Ralph?! :-/

How is it a failure that I anticipate having more “Sub-Sections” - and possibly even “Sections” - than I can easily fit on my Horizontal Menu Bar?!

(If you look at most major online newspapers, they can’t fit ever Section/Sub-Section on their Top Menus either.)

Anyhow, whether you use a dropdown or not, make the top level links clickable anyhow, and have an alternative to the drop menu for finding pages. Remember that CSS drop lists don’t work on mobiles (there is no hover) so if drop list links are the only way to access content, it’s inaccessible to users.

Also note that drop menus—especially CSS ones—can be hard for people with coordination difficulties to access, and also to those navigating via the keyboard.

So what would you propose to address my dilemma?

Debbie

The main menu of a site ideally should point to each of the main sections into which the site’s content has been logically divided. I prefer to let visitors click those main links and then get a clear overview of what’s on option in that section of the site. If you want to have those options shown in a drop list, then fair enough, but don’t rely on them. Thats the main point.

In each section, it’s good to set up a submenu system that will easily grow if more subsections are added to the site over time. An example would be a list of links in a sidebar: the user can easily see what sections exist within the current main section.

So I hear you saying that I should have a Main Menu with only a handful of choices (e.g. Finance, Accounting, Marketing, Technology, Entrepreneurs), which are simple hyperlinks. And then when a user clicks on one of those choices - whether in a browser or on a cell-phone - then I would next take them to a “Section Landing Page” (e.g. “Finance Landing Page”). Then on this Landing Page, where applicable, could be a sub-menu - perhaps an Unordered List of Hyperlinks - where the user could “drill-down” even farther, right? (And if my understanding is correct, then I guess each Sub-Menu item could have it’s own “Sub-Menu Landing Page”, right?)

Thanks,

Debbie

Yep, that’s what I meant. Of course, many sites have dropdowns, so it’s not for me to say they shouldn’t. But whether you do or not, I’d still say it’s good to have the setup you described above as well.

Thanks for the advice. I learned something yet again!!

Debbie