By Dean Burney
Dec 14, 2012

Getting to the Bottom of Navigation

Every good web designer is familiar with the conflict of innovation vs convention.

For example, everyone knows that logos go on the top left, search boxes on the top right, interior page navigation typically sits on the left, advertisements on the right, etc. Unfortunately, this flies in the face of the natural instinct of a designer to try new things and push the envelope. Conventional layouts may not always be the most elegant, or in many cases, not even the most logical - but user habits lead to intuition, all of which drives the all important site conversion.

Thankfully, our industry was turned on its ear a few years back with the rise of smartphones and tablets. The inability to predict the size of a device and its associated interface has spawned a host of challenges for the web designer, but even more opportunities. For example, the movement toward responsive design is producing a mini-boom in our industry as companies around the world scramble to adapt or even recreate their online experiences to accommodate all the newly shaped devices that crop up on a seemingly daily basis.

The recently launch of Microsoft 8 and hybrid touchscreen tablet/desktop devices, such as Surface and the Lenovo ThinkPad, is opening the doors even further. Now you have to think about a design that not only works for either keyboard or touch devices - but potentially both at the same time. This gives everyone in the design world a lot to think about.

One of the many things to think about is navigation.

Mobile opened the door to the bottom navigation. The top is the only place your hands never reside when operating a phone or tablet. It only made sense to put the core navigation in a place that allowed you to easily hold it and operate it at the same time.

So where should navigation live on devices that support both? My vote is for the bottom.

For years I have felt that a fixed-position bottom navigation, on a purely logical basis, actually makes a lot more sense - even for someone on a traditional desktop. Considering the importance designers and web strategists place on directing the user to a primary call to action on the homepage, why begin that experience with a list of buttons that distract from the core message? Wouldn't it be better if navigation was something that happened after the key selling points are communicated?

Similarly, on interior pages, when reading from top to bottom, I'd personally rather look for the next place I want to go in the direction my eyes are already moving. Thus those little flyout links that happen at the bottom of sites like the NY Times that seem to get me every time. In the past, that level of thinking was always sacrificed, and justifiably so, due to conventions. Yes, a bottom nav may make a lot of sense, but if people don't look there for it, it might as well not exist. However, today, smartphones, tablets, and all the associated apps are starting to change the thinking.

If you look closely, the bottom nav it is starting to crop up here and there, and It just doesn't seem as weird anymore, does it? Check these out:

  • http://www.moma.org/
  • http://gum.uk.com
  • http://www.aspectphotography.net
  • http://www.khailiew.com/

Look to the future, and think about sitting at a desktop with a touchscreen monitor. Imagine continually moving your arms up and down to reach a navigation bar.

Sounds exhausting.

I'd rather lift my hands ever so slightly from my keyboard to quickly touch a navigation link without blocking my own view. I'm not advocating everyone run out and redesign their sites to use a bottom nav. Desktop touch and hybrid desktop/tablet devices will certainly struggle somewhat to take hold. Most mainstream sites, as they always do will also stubbornly cling to the tried and true conventions for fear of upsetting the apple cart. All I’m saying is the bottom nav option should, at long last, be part of the conversation.

Give it some thought, you might be onto something big.

(202) 223-8656