We have been talking since the end of 2015 about the menu design for our website or blog. It has become one of the fundamental elements of it and therefore it is trend. This does not mean that we neglected before, but maybe we were not giving the importance it deserved.
In fact, its design has changed in recent years. While previously the top drop-down menus dominated, now new styles that make it more special are incorporated.
The main reason for the decreased use of the drop-down menus is the increasing use of mobile devices. We seek a more comfortable design and in many cases these menus are maintained independently of the device through which we are accessing. The desktop menu is important, yes, but we design thinking a lot about other mobile devices.
Thus, no one can doubt that now it is one of the most important elements of a web or blog, because navigation starts from it. It is one of the first things we see (or should do) so its position and display on the header is fundamental.
In addition, the websites and blogs are increasingly flexible and we can experiment much more with the design. We rank fonts and we design headers perhaps more carefully, therefore the menu cannot be as one element more but as the item it is.
So today we will see some templates for WordPress with original and creative menus navigation that follow WordPress best practice and use the nav HTML5 tag 😉
Verse
In this case as in the previous template, we also have the hamburger menu, but showing some differences. On the one hand, we can also have a more traditional top menu drop-down but with some design elements that make it original, and on the other hand the burger menu displayed to the left occupying the screen.
Christopher
In our template for WordPress Christopher we found a drop-down menu, but in this case horizontally. The different elements appear thus occupying a smaller area and almost without overlapping slider images.
Mango
This theme is no longer available
The hamburger menu is a trend. At this point it is no surprise. It is one of the friends of the responsive design that has spread to the desktop dimensions. However in the case of this template, we can highlight two elements that make it different and original.
On the one hand the menu design, in which each line has a different dimension to the previous, and on the other hand the effect, in which after pressed, the menu takes up the entire screen (similar to what we did with the sidebar in our template for WordPress Paulie or Silvio).
In this way the menu is present, but totally in keeping with the design of the template. We know where it is and what to do if we want to use it.
Celestial
Celestial is another template where we have a burger menu too, but in this case after clicked, the menu appears on the right of the screen, moving the contents of it to the left.
The difference in Verse is that in this case the content shows without overlapping shifts so depending on what we need, we may be looking for a solution or another.
Lore
In this case we have a more traditional hamburger menu. It appears in the strip that is normally destined to the menu and if we click, it shows the different elements of the menu occupying the same space.
With this we obtain the intended bar menu does not show too many items, being very present how to access.
Swiftly
This theme is no longer available
Finally here we have this menu always to the left of the screen, scrolling vertically when we scroll. This, as you can see, only occurs in the desktop versions, since because of space, in mobile versions the menu appears at the top of the screen.
