While we’ve been warned since 2016 about this, finally Google is rolling out its Mobile First Index.

What is Mobile First Index?

Mobile-first indexing means Google will use the mobile version of a web page for indexing and ranking in order to assist primary mobile users find what they are searching for online.

Primary mobile refers to the fact that the majority of people using Google search as doing so from a mobile device. Essentially, soon there will be only one index for search result – so not a mobile-first index and a main index – so Google will begin to look only at the mobile web pages to index the web rather than the desktop version.

What does this mean for websites? Well, you now must have a mobile friendly or mobile responsive website in order to be indexing and ranked by Google.

What is responsive design?

Simply put, it is when a website is responsive – so the layout and/or contents of your website respond or adapt based on the size of the screen on which they are presented. Typically there are four general screen sizes that responsive design are aimed at – widescreen desktop monitor, the smaller or laptop screen, the tablet and the smartphone.

How is this different from adaptive design?

There are three main techniques for serving up mobile content – responsive design, adaptive design (which is also known as dynamic serving) and separate mobile URLs. It’s pretty easy to identify separate mobile URLs by looking at your browser’s address bar however telling adaptive from responsive can be a little trickier.

Adaptive websites detect when the reader is on a mobile device and presents a different HTML accordingly.

Responsive websites will change the layout based on browser window size, regardless of device.

If you’re not sure if your website is adaptive or responsive then you can visit your website on a desktop and see what happens when you resize your browser window. Then you can check and see what is displayed on your mobile device.

When getting your website ready for the mobile first index, here’s a checklist for you:

Refine your visuals

Creativity is great, but don’t try to be super creative and use all the design principles at once. When a user sees too many objects of differing colours and styles on a tiny mobile screen, it can make their head spin. In other words, they simply leave your site. Quality design is never loud. It’s sensible, and it guides the user through your site. Minimalism is the key to a great mobile site.

Reduce redundant content

Though the screen sizes of mobile devices have grown larger, they’re still smaller than laptop or desktop screens. It’s important not to crowd a small screen. The fewer the text and visual elements on a mobile site, the easier it is to navigate.

This is especially important for people on the go — while shopping or glancing at a screen while on the train commute.

Be thumb friendly

What’s the most important action that a user can take on your site? Is it making a purchase? Or liking a post? Or reading a specific text? Make sure that this action can be accomplished with only a thumb.

To accommodate more information on a small screen, some designers mash links and buttons right up against each other. Unfortunately, this often leads to unintended button presses and frustrates your users!

Prioritise and make your most important call to action buttons large enough so that users can click on them without zooming and having to use their pinky.

Speed things up

Mobile users care a lot about a website’s load speed. They get irritated if your pages take more than a few seconds to open. When designing for mobile, keep in mind that some users may have slow internet connections.

Quite often a page’s speed is held back by data-intensive image or video content. Optimising your images will vastly improve your page load time.