Navigation menu is a key element for any website. All design tricks and visual manipulations will be useless if a visitor won’t find the necessary information and leaves the site fast. Navigation menu is one of the most popular ways of conducting people to that info.

For many years, people saw menus as a simple bar in the header that guided visitors through the site’s categories. The latest trends show that navigation menu design has changed and nowadays menus are not the same they were yesterday.

Use of Keywords in Navigation Menu

Prominency is a key concept in navigation design. To make navigation menu clear and visible, tabs are grouped into blocks that are created in one size and style. Such blocks are usually lined up and placed in a prominent part of the site.

Most menus are based on words. It’s a set of keywords or labels that are simple and easy-to-understand for most visitors (Home, Contacts, Shop, Blog etc.) Many sites use these standard labels or their synonyms in association with the page information. Today sites start using so-called “speaking” labels that include explanation texts. Such explanations make keywords more prominent and easier to perceive. They make sure the visitor will find exactly what he or she needs.

Image Mechanics

imagemechanics-speaking-navigation-menu

 

Another popular trend is addition of icons and pictograms to the menu tabs. The idea is the same as with “speaking” labels – to make the menu functions more clear, prominent and… fun. Nice attractive icons make menu a playful design element that makes site browsing a pleasing act. “Speaking” labels may be used in combination with icons to attract attention to the tabs and make their contain more comprehensible.

IUVO

iuvo-icons-navigation-menu

Into the Arctic

 

 

into-the-arctic-navigation-menu-design

 

The only restriction: such icons and images should be clear and “speak” unambiguously about the content they link to. This example below shows not the best use of icons for the menu, because they don’t offer a clear recognition of the site category where this icon leads.

Carbonmade

carbonmade-symbol-navigation-menu

Menu Position on the Site

Menu position also changes today. Most websites are still placing the navigation blocks at the top of the screen, above the header. However, the responsive design trend requires more flexible menu position. That means navigation menu tabs in any part of the screen make it possible using menu on any type of device.

The Bullitt Agency

bullitt-agency-navigation-menu

Modern designs include navigation menu positioning in center what makes it prominent for visitors and draws their attention. Left- and right-side positioning is also popular. It makes navigation menu not only functional but emphasizes the style of menu as a design element.

Website Template with Center Navigation Menu

center-navigation-menu-design-50461

The Expressive Web

expressive-web-navigation-design

Treme

ocs-collage-navigation-menu

Reblogged from www.motocms.com

Tags: ,

Chat plugin