Why You Need A Mobile-Forward User-First Strategy

Fol­low­ing all-device best prac­tice will pro­vide users with a sim­ple jour­ney and pre­vent frus­tra­tion.

Nichola Stott By Nichola Stott from theMediaFlow. Join the discussion » 0 comments

For some kinds of dig­i­tal activ­i­ty there’s a grow­ing par­i­ty in terms of what kind of device we’re using to per­form the activ­i­ty. Web search, for exam­ple, has “piv­ot­ed” in 10 coun­tries includ­ing the U.S., accord­ing to Google. In ecom­merce we’re slight­ly less keen to hand over the plas­tic with mobile pur­chas­es being more like 30 per­cent of device activ­i­ty. “Mobile first” isn’t an evo­lu­tion­ary con­clu­sion for all sec­tors. We need a con­text check…


While “mobile-first” as a con­cept has been around for some time, arguably first coined by Luke Wrob­lews­ki as far back as 2009, it’s impor­tant to point out that “mobile-first” shouldn’t mean “desk­top is an after-thought.” Every dig­i­tal prod­uct should be con­sid­ered against the user con­text. In most cas­es, that means mak­ing the user expe­ri­ence on a smart­phone and desk­top com­put­er equal­ly great. But there are still dif­fer­ences and con­text con­sid­er­a­tions.

Despite announce­ments from Google that more search­es take place on mobile as opposed to desk­top in 10 coun­tries, includ­ing the U.S. and Japan, this doesn’t extrap­o­late to all oth­er activ­i­ties or sit­u­a­tions.

In this epic study by Kris­tine Schachinger for Search Engine Land, which draws on a num­ber of high­ly cred­i­ble device and con­tent con­sump­tion stud­ies, Schachinger urges cau­tion on extrap­o­lat­ing mobile growth to mean desk­top usurpa­tion rais­ing the fol­low­ing points, among many:

  • com­Score data shows only 29 per­cent of web search­es on mobile in Q4 2014 in this U.S. Dig­i­tal Future report.
  • Mobile isn’t nec­es­sar­i­ly tak­ing a big­ger piece of the pie – more like all of the pies are get­ting big­ger.
  • There’s a huge dis­par­i­ty in desk­top ver­sus mobile con­tent con­sump­tion based on con­tent type.

All these points and more lead Schachinger to con­clude that while “mobile is vital­ly impor­tant to any online dig­i­tal effort,” a huge intro­spec­tion piece that takes account of “user intent, socioe­co­nom­ic sta­tus and iden­ti­ty demo­graph­ics” is need­ed before brands and mar­keters take action.

While much of the research and per­spec­tive above is U.S.-focused, the UK mar­ket expe­ri­ence and data stacks up, too.

In June Econ­sul­tan­cy pub­lished a thor­ough com­pendi­um of their and oth­er mobile-retail data stud­ies. While the mes­sage is entire­ly pos­i­tive and in gen­er­al the con­cern is many dig­i­tal busi­ness­es neglect the mobile expe­ri­ence, this doesn’t there­fore mean that user-expe­ri­ence should focus on a mobile phone screen, touch and pinch, and neglect larg­er screens and com­mon desk­top oper­at­ing tools (key­board short­cuts, a mouse, and oth­er such periph­er­als).

Business vs. Consumer Activity

Up until such a time as aug­ment­ed real­i­ty or holo­graph­ic com­put­ing is the modus operan­di for the office, it stands to rea­son that busi­ness to busi­ness prod­ucts need to design for a work­day ergonom­ic. At my dig­i­tal mar­ket­ing agency, this means two screens min­i­mum, pos­si­bly three for tech­ni­cal ana­lysts. [Note the design­er on the left with (prac­ti­cal­ly) a home cin­e­ma.]

Screens at theMediaFlow

My anec­dote is per­son­al though it pass­es a com­mon sense test. Still, I thought I’d approach Majes­tic, which is pos­si­bly one of the widest-used orig­i­nal data sources across the whole of dig­i­tal mar­ket­ing, to ask Dixon Jones how their vis­i­tor-by-device-data stacked up. Majes­tic vis­i­tors by device

Device type Majestic

Image Source: Piwik Ana­lyt­ics Majestic.com data

So there’s that.

In the con­sumer pub­lish­ing indus­try, how­ev­er, we might expect a much clos­er gap in terms of vis­i­tor device. I approached Mal­colm Coles, dig­i­tal media direc­tor at the Tele­graph Media Group, to see if I could obtain the equiv­a­lent data and in this case we can see a prac­ti­cal­ly equal dis­tri­b­u­tion:

The Tele­graph vis­i­tors by device – week­day evenings

Telegraph visitors by device

Image Cred­it: Mal­colm Coles/Telegraph Dig­i­tal Media

This Majes­tic ver­sus The Tele­graph data isn’t exact­ly like-for-like as The Tele­graph data is for week­day evenings; how­ev­er what this does show is a stark con­trast between vis­i­tor-device by con­text. As if we need­ed more proof.

All Devices Are Evolving

Evolution

I take issue with a blan­ket notion of mobile-first when it is tak­en to mean “desk­top-last” or desk­top replace­ment main­ly because this ver­sion of the future seems to con­fuse progress in tech­nol­o­gy with Dar­win­ian nat­ur­al selec­tion. The mobile phone isn’t an emerg­ing evo­lu­tion­ary change to the desk­top, with its low­er sur­vival prob­a­bil­i­ty but instead web-enabled mobile devices are new­er tech, there­fore will nat­u­ral­ly grow as per­cent­age con­tri­bu­tion to absolute vis­its but that does not mean you get to lose your desk­top UX mar­bles.

As mobile web usabil­i­ty has improved in gen­er­al, par­tic­u­lar­ly screen size and touch­screen, then it stands to rea­son that the absolute num­ber of vis­its by mobile device will increase over time and the per­cent­age con­tri­bu­tion there­fore – that’s basic maths. But there will be a lev­el­ing out until there’s a step-change, a device inno­va­tion, holo­graph­ic com­put­ing in the work­place or some­thing – who knows?

Common Mistakes

While every brand and busi­ness should put the mobile user expe­ri­ence front and cen­ter, there are sev­er­al com­mon mis­takes to avoid which all seem to stem from a fail­ure to look at the data and his­to­ry for the site in ques­tion. Exam­ples include launch­ing a sec­ond web­site with­out any form of pri­or­i­ty cas­cade for dynam­ic serv­ing, sub-domained abbre­vi­at­ed ver­sions of a web­site with­out any form of search treat­ment (such as strate­gic noin­dex or cor­rect use of canon­i­cal tags) – all of which can cause poten­tial dis­as­ters for organ­ic search traf­fic.

I reached out to mobile SEO expert Aley­da Solis of Orain­ti to ask her for the most com­mon pit­falls she has seen.

Busi­ness­es devel­op a mobile app first, before enabling a mobile web­site, just to real­ize that their mobile users were wide­ly dis­trib­uted across plat­forms, that they are just tar­get­ing a minor num­ber of them with the app… and that they are only offer­ing func­tion­al­i­ties that could be well addressed with a mobile site,” Solis said. “Some­times the app is def­i­nite­ly need­ed. How­ev­er, you need to research, assess, and val­i­date that need instead of just launch­ing apps because ‘we live in a mobile app era.’ ”

So how do we get it right? What does a good dig­i­tal agency or mar­keter do to dri­ve growth?

Context UX

Any dig­i­tal prod­uct approach to device has to be:

  • Spe­cif­ic to the dig­i­tal prop­er­ty in ques­tion.
  • Based on that prop­er­ty data and his­to­ry.
  • Com­pared against sec­tor spe­cif­ic trends (i.e., if fash­ion then con­trast site-spe­cif­ic data with the wider indus­try).

As an exam­ple of the above – look­ing with­in the retail chan­nel alone there’s a huge dif­fer­ence in web search activ­i­ty on mobile device by cat­e­go­ry, with fash­ion by far at the top with up to 65 per­cent of search­es on a mobile device com­pared to say 28 per­cent in home improve­ment accord­ing to Econ­sul­tan­cy.

Retail Category Searched For by Device

Image Cred­it: Econ­sul­tan­cy

How To Put Mobile-Forward User-First

Instead of a blan­ket mobile-first pol­i­cy, we advo­cate a mobile-for­ward user-first approach. The­Me­di­aFlow UX design lead Anna Youngs rec­om­mends mobile and desk­top users should be pre­sent­ed with the same key infor­ma­tion, to pre­vent any frus­tra­tions when search­ing for con­tent.

By focus­ing on ver­ti­cal rhythm and the struc­ture of the lay­out, the flow of infor­ma­tion should be con­sis­tent on all devices, cre­at­ing a visu­al hier­ar­chy. Accord­ing to Youngs this can be achieved by using a base­line grid to ensure sen­si­ble spac­ing between con­tent, and visu­al clar­i­ty.

Struc­tur­ing the infor­ma­tion archi­tec­ture to have con­tent hier­ar­chy will enhance com­mu­ni­ca­tion. The human brain inter­prets visu­al infor­ma­tion much faster than words,” she said. “There­fore, pow­er­ful imagery high up in the con­tent hier­ar­chy could improve com­mu­ni­ca­tion. Con­sis­tent visu­al styling, such as the same col­or call-to-actions and rel­e­vant state change alerts, will also add val­ue to the expe­ri­ence.”

Doing It Well

For a great exam­ple of all-device best prac­tice take a look at Japan­ese cloth­ing brand Edwin. When view­ing the Edwin store across all devices, the assets and styling stays con­sis­tent. There aren’t any nasty sur­pris­es. The desk­top web is clean and mod­ern, and does­n’t look like a stretched mobile site that has been designed to be mobile-first.

Edwin website

Desk­top

The desk­top Nav­i­ga­tion is aligned to the left of the screen with four sim­ple icons that present the user with menu, search, favorites, and shop­ping bas­ket. This pre­vents over­crowd­ing of the head­er, which uses artis­tic, vin­tage feel­ing prod­uct images, which work well with the sim­ple dark gray and white styling.

When viewed in mobile the same options are vis­i­ble at the top of the page. By con­sid­er­ing the dif­fer­ence between land­scape and por­trait the menu is moved into the most appro­pri­ate posi­tion­ing for the user, enabling reach­able but­tons if accessed on a mobile device.

Edwin mobile site

Mobile

When viewed on mobile, the head­er image col­laps­es, and the prod­ucts are moved high­er up in the ver­ti­cal con­tent hier­ar­chy. The user is pre­sent­ed with the prod­ucts pho­tographed on a white back­ground, before they even need­ed to scroll or search.

The abil­i­ty to favorite, before click­ing through to the prod­uct, is a clever way of allow­ing the user to “browse” before pur­chase. Much like when you are brows­ing on the shop floor, the shop­per may not want to com­mit straight away and gives them the abil­i­ty to browse their options.

Summary

This is the essence of user-first design. Think of it as device encom­pass­ing. You want to cre­ate a sim­ple jour­ney to the site objec­tive, whether that’s buy­ing jeans or read­ing about Syr­ia. You want to make it feel like the same expe­ri­ence from device to device.

Nichola Stott

Written by Nichola Stott

Managing Director, theMediaFlow

Nichola Stott is managing director of theMediaFlow; a multi-award winning digital marketing agency combining technical excellence with creativity and a strong focus on SEO. Nichola has worked in digital communications for almost 20 years, with experience in global communications, investor relations, design and more recently before founding theMediaFlow; as head of search partnerships at Yahoo!

Inked is published by Linkdex, the SEO platform of choice for professional marketers.

Discover why brands and agencies choose Linkdex

  • Get started fast with easy onboarding & training
  • Import and connect data from other platforms
  • Scale with your business, websites and markets
  • Up-skill teams with training & accreditation
  • Build workflows with tasks, reporting and alerts

Get a free induction and experience of Linkdex.

Just fill out this form, and one of our team members will get in touch to arrange your own, personalized demo.