Showcase of Creative Navigation Menus: Good and Bad Examples
">no commentsA collaborative post on Smashing Magazine, published April 19, 2011
Good navigation is the main cornerstone of an effective website. In practice, however, it’s often a tough challenge to come up with a meaningful, unambiguous way to organize, arrange, and display content to users; and it’s often not much easier to find a visually interesting solution either. The wide adaption of JavaScript libraries like jQuery is making it increasingly easy to add various kinds of sleek animations to navigation design. For instance, many recent promo websites are essentially single page websites with an array of animation effects used to make navigation a smoother and richer user experience.
We need to be very careful and cautious when using these dynamic effects in our designs. A simple, calm navigation is usually much more user-friendly than an evolved, dynamic one. Users want to use the website, not be baffled by the weird and hardly usable navigation. But that’s not to say that a creative navigation should be avoided at all costs; in some contexts, an interactive menu does make sense, especially when it comes to promotional websites such as online campaigns, portfolios or advertising — on these sites, interactive navigation can lend some dynamics to an otherwise dull and boring experience.
Below we present some interesting examples of website navigation menus — they are not necessarily very usable, but they are certainly inspiring and original and thus you could build your designs upon the ideas presented below: use them, tweak them and improve upon them. We also discuss the potential usability problems of each of the techniques presented in this post. Before using a similar technique in your design, please make sure that it fits the context of your design. Test, validate and verify that the technique would actually make sense in your website. Approach these techniques with caution. Let’s take a look at some interesting ways to present navigation menus content for both smaller promotional pages and deep informational websites.
Read more →
