Pixel Pixel use Cookies.

We use cookies to enable essential services and functionality and to collect data on how visitors interact with our site. By clicking Accept Cookies, you agree to our use of all relevant cookies.

Certain cookies are unfortunately fundamental to the operation of the site and are thus required - you can find out more by viewing our Cookie Policy.

You can manage your preferences at any time via our Cookie Preferences manager.

Manage Preferences

Manage Cookie Preferences for Pixel Pixel

You can find out more about by checking out our Cookie Policy

  • Essential

    Unfortunately certain cookies are essential to the operation of our site and are a condition of its use.

  • Performance

    Collects anonymous data about how visitors use our site and how it performs.

  • Support

    These cookies assist us in providing a great service every time. They may include CRM or feedback tools.

Get in touch
Featured image for Mobile First Websites

Mobile First Websites

Posted on 13th February 2020 at 9:56am by Mike Earl in Mobile

The web development industry is continually evolving. Most of the time, these evolutions are small permutations on a previous best practice or method of application.

The web development industry is continually evolving. Most of the time, these evolutions are small permutations on a previous best practice or method of application.

But, every once in a while, something happens which causes every web development agency to seriously rethink how they handle projects. One of the most significant examples of such a change recently is the meteoric rise of the mobile phone. In 2009, only 0.7% of all global web pages were served on mobile phones.  Compare this to Q3 2019, where 51% of worldwide website visits were via mobile devices! This increase has led to a 'mobile first' approach to development.

So, what exactly is the mobile first approach? Well, it's the theory (of sorts) that as more and more of the world uses mobile devices to settle pub disputes over whether Neil Armstrong was indeed the first man on the moon, web developers should 'follow the crowd' and develop for the mobile devices first. In contrast to traditional development, where you would develop for desktop sizes first. With this paradigm shift comes a magical technique called the Media Query.

Media Queries are a way to define a device size (usually width) and then change the layout and feel of a website if the device is below that size. For example, where a smartphone screen has less horizontal room than a standard desktop, the typical 50/50 image left, text right layout is going to look a little cramped. With a media query, we can tell the browser to stack that section on smaller devices.

But Media Queries aren't the only thing mobile devices have caused to change. The famous 'burger navigation' button is a direct response to small screens not being big enough to display most standard navigations appealingly. Incidentally, some desktop websites have now adopted the burger navigation for a sleeker design.

Fixed headers are also a direct result of more of the planet using a mobile device for their daily surfing. Scrolling through long web pages can feel like an arduous task. So, having to then navigate back up to the top to access a different page is something that most people won't do, resulting in users dropping off the site at that stage. The solution to this was to scroll the header (and subsequently the navigation) with you for easier access.

There is a myriad of other things which the arrival of mobile devices has changed about the web development landscape that we don't have time to discuss in this blog. One thing that it's safe to say, however, is that the mobile first approach is here to stay! It's not a UI/UX fad that is going to pass. And, with over half the world's internet usage being handled through a mobile device; creating websites in a mobile first fashion is something that more and more developers are going to adopt.

We love what we do! You will too. Speak to us