The “mobile first” intranet (part 1)

Have you heard the web design term “Mobile first”? It’s a concept where you start with the smallest screen size you want to deliver content to, and then you work your way up. Combined with Responsive Web Design this philosophy gives you both a) a good focus on what’s most important on your intranet site, and b) a device agnostic intranet, working “automatically” on every modern device.

aba-cover-6_a810ec60-d08b-4203-bc4e-0386e8935602_100x@3xThe term was coined by Google CEO Eric Schmidt and got it’s bible when Luke Wroblewski 2011 published the book “Mobile first“.

For years, most web teams have designed products and information for desktop and laptop computers. For these teams, mobile was an afterthought if even a thought at all. […] But things have changed so dramatically over the past few years that starting with the desktop may be an increasingly backward way of thinking about a web product.
Luke Wroblewski, Mobile first, p 1.

Mobile first thinking is really relevant when building a web site on internet. The majority of internat usage today is through a mobile device. Intranet usage is some years behind, mostly due to a higher number of distributed company computers than company smartphones and tablets. But the trend is more and more mobile devices exist within the organisation. And you can bet on almost every employee having a private smartphone in his/her pocket, creating a BYOD lanscape the intranet can benefit from.

Mobile first is a really good way to explore what the most important content and functions are on the intranet. The screen on an iPhone 8 is only 20% of the desktop screen, meaning you have to get rid of 80% of the stuff!

Losing that much screen space forces the team to focus. You have to make sure that what stays on the screen is the most important set of features for your customers and your business. There simply isn’t room for any interface debris or content of questionable value. You need to know what mattes most.
Luke Wroblewski, Mobile first, p 19.

“Interface debris”—I love this quote!

The great thing about this is that the same focus is just as relevant on the desktop! The end-user prioritization doesn’t change with more screen space.

It’s important to forget an old myth. It’s the belief that content should be restricted, dumbed-down or eliminated for mobile users based on their goals and intent. Users need and expect full functionality on their mobile device, because they could be using it anywhere, for any reason.
Drew Thomas, Why Responsive Web Design Has To Win Out

But enough said about this. Let’s use the Mobile first approach on the intranet!

First lesson: There are some basic web stuff you need to apply on every page, some best practice you should always adhere to.

A page should always have some kind of start (a masthead in web lingo) and an end (a footer). In-between you have a main area. I have also reserved some space above the masthead, for special announcements. Later I will explain why I think that area is the right place for this.

basics iphone


And there you are. This the basic components on a page, on any page on any device. This is how our mobile intranet begins. This is our canvas where we should put the most important things.

Part 2: Masthead and Warnings


3 thoughts on “The “mobile first” intranet (part 1)

Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s