Topic Archives

Navigation

Learn about different web and mobile styles, including horizontal, vertical, and responsive menus, and improve your navigation design skills and the UX of your website.

The Hamburger & Mega-Menu Combination Design Trend

The Hamburger & Mega-Menu Combination Design Trend

Inspiration

Hamburger icons are everywhere. They carved a niche for themselves without any intention to leave us anytime soon. Hate it, love it – just deal with it. Much like the…

Out of the Way: Corner Navigation in Web Design

Out of the Way: Corner Navigation in Web Design

Inspiration

Corner navigation has been with us for a while. It is a small trend that has emerged from the popular perimeter navigation. However, unlike its predecessor, it looks less massive…

10 Innovative Navigation Examples in Mobile App Design

10 Innovative Navigation Examples in Mobile App Design

Inspiration / Web Design

Mobile navigation designs come in many different shapes and forms. While it would be more intuitive and easy to understand for users if all navigation systems followed the same structure,…

How to Create a Vertical Slide-Out Menu with CSS Transitions

How to Create a Vertical Slide-Out Menu with CSS Transitions

Web Design

In this tutorial, we’re going to create a vertical slide-out menu using CSS3 transitions. The menus will be place on the left-side of the screen with the main links hiding…

How to Add Mobile Navigation to Your WordPress Theme

How to Add Mobile Navigation to Your WordPress Theme

WordPress

Let’s look at one method for adding an attractive and functional mobile navigation system to your WordPress theme.

The Beauty of a Simplified Navigation

The Beauty of a Simplified Navigation

UX Design / Web Design

The beauty of simplified navigation in web design, and how it improves the overall user experience.

The Complete Guide to Prioritized Navigation

The Complete Guide to Prioritized Navigation

Marketing / UX Design

Implementing prioritized navigation to guide users effectively through your website, enhancing usability.

How to Animate a CSS-Only Hamburger Menu and Icons

How to Animate a CSS-Only Hamburger Menu and Icons

CSS

Hamburger menu icons have become a staple in many websites and web apps, and whether you like them or not, they are becoming a familiar and recognizable UI action button….

How to Create Responsive Off-Screen Menus with CSS3

How to Create Responsive Off-Screen Menus with CSS3

CSS

In this tutorial, we’re going to create some slide and push menus using CSS3 transitions. The menus will be hidden off screen at first, and will transition into view when…

Exploration of Single Page Navigation Systems

Exploration of Single Page Navigation Systems

Inspiration / UX Design

The navigation of most books is linear. You start at the beginning and flip pages until you reach the end. Perhaps reference books are slightly different, and (for those born…

20 Examples of Fullscreen Responsive Menus for Inspiration

20 Examples of Fullscreen Responsive Menus for Inspiration

Inspiration / Web Design

We’ve covered responsive navigation a number of times over the last couple of years, from off-canvas reveals and nested accordions, to the simpler <select> drop-down menu system. There really are…

30 Fantastic Examples of Fixed Navigation Menus in Web Design

30 Fantastic Examples of Fixed Navigation Menus in Web Design

Inspiration / Web Design
123