Before there was CSS, I remember using Macromedia Dreamweaver to create dropdown menus and hover behaviors. Dreamweaver would include the necessary Javascript commands and the menus would just work.
Then, with CSS and tools like Suckerfish dropdowns, code became cleaner and menu creation became easier. However, it was only ordinary dropdown menus until the trend of rich interactive submenus started.
Oracle
These content rich dropdown navigation structures gave submenu a new purpose, a new life. The submenu pictured here became more than just a list. It opened up the opportunity for website owners to highlight an important item within the menu itself.
Cisco
Other than images, some dropdown navigations even built in tabs . Most likely used in this scenario to better categorize websites with humongous and deep information structures.
But it didn’t stop there. Developers are now pushing the limit of the dropdown navigation by incorporating login actions into them. As I was saying, rich content is now housed within the dropdown relative to its content. The example above displays such a connection for its partners.
Dunkin Donuts
Dunkin Donuts only recently launched its new website and they too have incorporate this rich content dropdown navigation. As you can see, they’ve placed their store locator directly inside the dropdown menu.
Plus, they didn’t stop at only having the login inside the dropdown navigation. You can even create a new account within the submenu panel now. Phew!
Is this too much of a good thing?
I can understand incorporating logins and forms into the dropdown can free real estate space in the website. However, I feel squeezing too much rich content in a dropdown panel makes it too cluttered. Especially when the designer or developer isn’t careful with the breathing space.
To be honest, Dunkin Donut’s incorporation of the account creation and login form is the limit for me. The near-unavailable gutter space between the 2 forms make it look like a single item.
Share a website you know with this type of dropdown navigation.