Mobile first web design for information architecture

When people think “mobile first web design” then often thoughts of single column layouts and a simple interface spring to mind. What I really love about a mobile first approach is how it helps to organize the structure of your website and each page within the site.

Thinking mobile first design has enormous benefits for your information architecture. It forces you to think of just those really important elements, and it forces you to ensure that you get those correct. Let’s take a look at what I mean.

Mobile first web design navigation

Unless you want your users to scroll through dozens of navigation items(you probably don’t) then thinking mobile first forces you to really look at what sections and pages within your site are of primary importance.

Let’s look at a few questions you might consider for any specific page within your site.

• Does this page need to have a link from the primary navigation or can it be a link from within a primary page?
• Can this page be filtered into a section with other similar pages?
• What would the section be for this specific page?
• Does this page warrant a link from a secondary navigation unit?
• Will a secondary navigation unit be of consistent content on each page or will it be dynamic depending upon the current section/page?

Thinking mobile first for your website navigation will help you to structure all viewport navigations better. You will dedicate time and effort to ensuring that your site structure is correctly formatted for the viewer and gives them easy access to those areas of importance.

A side note to consider:

What you think is important is not the deciding vote, what really is important needs to win. Let me explain…

At our Boston web design company we always sit down with our clients to discuss how we will create a page structure and navigation structure for their site visitors. The discussion usually kicks off with our client giving us their opinions on what pages need to go into what sections, this is great information but really looks at the issue from the wrong viewpoint. We need to deliver a navigation and site structure that makes sense to their visitors not the client, the two are not necessarily the same.

We like to use card sorting as an exercise to give information on possible site structure. Using this technique you will be surprised just how different the results often are when comparing the client data and their customer data.

Okay, back to the mobile first website design approach

Ask yourself these two questions:

1. You have a canvas that is 960px x 700px, what content goes onto that page for your website?

2. You have a canvas that is 320px x 480px, what content goes onto that page for your website?

Now, never ask yourself question one again Think mobile first, the content that is important enough to be placed into that mobile environment is the same content that is important enough to be placed in a larger viewport. This also helps dramatically with your content strategy, more on that in an upcoming article…

Your next website project will have a lot more focus if you try a mobile first approach to web design, give it go.