The Mobile-First Generation: What Does It Mean

An actual example from a Singaporean Tech Company

If you grew up alongside the rise of the Internet, you’d probably envision the desktop experience. A big screen, mouse and keyboard interface, and a scroll wheel characterize the way desktop users access and interact with the Internet, and so desktop-first design was adopted in response. Desktop-first design has static design elements that do not scale or rearrange themselves based on the size of the window or the device, and may feature sidebars that showcase all relevant information at a glance, drop-down menus, and similar space-heavy, information-heavy pieces of the design puzzle.

 
pexels-photo-256401-1

 

This sounds wonderful and attractive to desktop users, but unfortunately it leaves mobile users with the short end of the stick! The static nature of desktop-first design means that mobile users will be stuck with the same expansive desktop interface, but on their tiny mobile displays, meaning they’ll have to zoom and pan around just to get things done.

The current trend, and one that many businesses and web developers should be following, is mobile-first design, and today we’ll explain just why this is a critical choice for you.

Why mobile-first design?

How big exactly is the mobile market, that mobile-first design is now the main trend to be pursued? Well, as it turns out, pretty big: in Southeast Asia, more than 90% of Internet users are on mobile! Alongside this figure, Southeast Asians spend more time on mobile internet than any other demographic – an impressive 3.6 hours a day. Singapore in particular has the highest smartphone adoption rate in the world, at a remarkable 85% of the population owning at least one.

These figures extend to major web activities, not just general browsing. eCommerce in Southeast Asia is a tremendously mobile-first industry, with 72% of all eCommerce traffic coming from mobile browsers. Meanwhile, 89% of Southeast Asian Facebook users are mobile as well, which often means that the sales funnels and websites that a social media user sees will also be viewed on a mobile device.

 

pexels-photo-744461

 

So imagine going desktop-first and leaving this huge 90-plus % user base to fend with unwieldy web design that looks terrible on the devices they spend hours and hours every day on. You’re going to lose prospective customers and clients left and right—after all, 28% of Singaporeans would look for a site that has a more mobile-friendly interface if faced with this scenario.

On top of all this, Google also penalizes websites that don’t have mobile-friendly design, which will hurt your rankings on search engines and ruin all the good work that your SEO has been trying to do.

It’s clear then that mobile-first design is a key element of modern web design, and it has to be leveraged in order to ensure that you don’t lose any traffic to the biggest Internet-using market around.

What does mobile-first look like?

Mobile-first design is characterised by certain principles that make it optimised for viewing on a small-screen device.

Responsive design refers to websites whose elements scale and move automatically to fit aspect ratio, screen DPI, and size of the viewing device. Every device gets the same HTML pages delivered when they load the page, with the appearance responding to the device’s needs. You can see responsive design in action on desktop by going to a website and zooming in to, say, 300-400% using your web browser’s zoom feature. You may notice sidebars and menus disappearing and being hidden behind a hamburger menu, and text is scaled up to fit the entire screen.

 

pexels-photo-54284

 

Not all websites will make use of responsive design. Some sites will serve separate HTML pages upon detecting the type of device accessing them, which is known as adaptive design. Still others, like Facebook and Wikipedia, instead have a separate URL for mobile devices, for example m.wikipedia.org and m.facebook.com—this is called separate or m(Dot) design.

Many mobile sites also make use of progressive enhancement, in which all users are served the most basic and core webpage content, such as articles or videos, above anything else. This ensures that everyone gets a good experience no matter what device they’re using, and particularly is advantageous for mobile users with less powerful, less fully-featured browsers. As the website detects greater browser functionality, such as JavaScript, CSS, and even WebGL, more and more features can be provided to the user.

The essence of mobile-first design is scalability and adaptability. Where desktop-first design simply assumes that users can see everything and pushes a single design on them, mobile-first ensures that users are provided with the best access to the information they need.

Catch Part 2 of our piece on the importance of mobile-first design and what its impact is on your marketing strategy, here.

NEED HELP WITH ANYTHING DIGITAL? TALK TO US.

 

Posts by topics

Related Content

There’s no way to tell for sure what kind of content goes viral. There are many guides offering tips to create viral material. While these ensure your content stands a chance at that elusive viral hit, through structured pointers aimed at pushing ...

Read More

Good Content, Hooks. Things We Can Learn from Viral Sensation S-Hook Ahlian.

Jan Mascarina
written by

Jan Mascarina

09 October 2018

One of the biggest tech events of the year, Apple’s Keynote 2018, saw the announcement of 3 brand new iPhones; the iPhone XS, iPhone XS Max and iPhone XR which continues in the new direction the iPhones have taken since last year’s iPhone X and the ...

Read More

Why do people still buy iPhones upwards of $999 today?

Jan Mascarina
written by

Jan Mascarina

04 October 2018

On this month exactly 8 years ago, Construct Digital first opened its doors, hired its first staff, and spoke of one dream - to be the agency for agencies, doing good work through their vision. Today, after growing to 3 regional offices, with staff ...

Read More

Introducing The New Construct Digital: New, Bold, Now.

Jan Mascarina
written by

Jan Mascarina

17 September 2018