Oh the heady days of 2012 – when Carly Rae Jepsen Called Me Maybe or Gotye was Somebody I Used to Know?

It was the year I started a new job, at 47, thinking it would be my final place of work before retiring from education – I was right. Just not about the date. I “retired” in 2013, unceremoniously shafted in a job I’d done well since 87.

Happy days.

That past though is a foreign country and instead of looking back through shit-tinted specs at depression and PTSD, I now have geek glasses on and know 2012 for something different.

2012 was the first year smartphone sales overtook PCs

A landmark indeed and it informs the title and focus of this blog: Mobile First.

Google first coined the phrase in 2010, as a way of telling developers to design websites with the smaller picture in mind – design for Mobile First.

Instead of designing a website for desktop and laptop, Mobile First eschews this in favour of designing for mobile first – not just in terms of responsiveness, but with CSS (Cascading Style Sheets).

Don’t click away

Apologies for the geek speak with CSS. I’ll revert to normal speak, I promise, now.

You need to be aware of differences in content too.

We all know that rich content is rewarded in terms of SEO, but should a mobile version of a website have the same depth of information? If we teleported to 2012, screen size of smartphones was still pretty low at 4.1 inches.

Now though with the S10 Plus, Note 10, Note 10 Plus and iPhone 11 Pro Max, screen real estate is higher so is Mobile First with differentiated content still important?

I personally don’t think so. I’ll happily perch over coffee on my iPhone and read web pages, The Guardian and scroll through social media and I don’t ever think “too much information on here, click away.”

Mobile First design elements

If you look at any websites I’ve designed for clients, I didn’t adopt a mobile first design strategy but I do ensure that design elements are incorporated on the mobile site:

  1. Call Now buttons
  2. Clickable email addresses
  3. Prominent social media icons in headers and / or footers
  4. Smaller slider images with clear indicators of what the site is all about
  5. Slides with CTAs
  6. Copy that sits above the fold to encourage scrolling
  7. A classic burger menu bar that doesn’t clutter the header

You can look at the home page of this site on a smartphone to see what I mean:

Your site should incorporate these elements on its mobile site.

Given that 83% of web visitors come from mobile devices, you need to put mobile design as a priority, if not first.

If you need more advice on any aspects of web design, the importance of copywriting or digital marketing, just get in touch.