Since the early days of website development, most web designers, developers and clients have first approached a project from point of view of the desktop version — leaving the mobile experience as an afterthought. There’s no question that we are smack dab in the middle of responsive design era, in which smartphones and tablets dominate the user experience. Yet, many designers and developers continue to start with the full-size version of a website and pare it down to fit mobile screens.
This process is the reverse of what should be happening. A web project’s creation should begin with mobile considerations—then work up to a larger desktop version. Why should you approach a web design project this way? In 2014, mobile usage officially overtook desktop globally for the first time.
Here are some other reasons to approach your new web project from a mobile-first perspective:
- Mobile-first design simply leads to a better user experience. When a website is specifically made to “fit” a mobile device, users avoid unnecessary lag in viewing the site and allows them to access the content they are looking for more quickly. To build such a website successfully, start by loading the absolute bare essentials, especially when it comes to content. Any additional resources are loaded, as needed, to allow our devices to handle requests more efficiently.
- Scaling up is easier than scaling back. As a developer with a design background, I always think of the benefits of this approach with regard to efficiency during the development process. If we start with a mobile-first approach at the design phase and then scale up to tablet designs and, ultimately, the full desktop version, we have a more cohesive idea about how the entire site should act in all mediums. This allows developers to bring the designs to life with greater ease and eliminates extra time needed for guesswork and/or extra code to force certain design exceptions on different devices.
Here are a few key mobile-first principles to keep in mind when getting started:
- Determine upfront what the main purpose of the website is at the mobile level. Then, scale it up to the desktop experience. What do we think the end-user will be looking for specifically on a smartphone: a way to contact the company or request a quote? An easy way to browse upcoming events? We should deliver that content to the mobile user as quickly and efficiently as possible. A website can really benefit from limiting the content or number of pages on mobile devices, thus creating a better user experience.
- Cut the word count down. Way down. Personally, I’m a big proponent of scaling down content as much as possible on mobile devices. Many current websites have lots of pages (with high word counts), regardless of whether they’re informational or promotional in nature. This content overload can lead to a clunky experience on mobile devices where space is limited—especially in terms of navigation. And if users can’t find what they’re looking for quickly, they’ll go to another source.
Though there are certain instances and industries where mobile-first may not be the best course of action, there are many more instances in which mobile-first should be the default method of website development. I believe it to be the way to most efficiently build sites in the modern smartphone and tablet era. I’d love to hear your thoughts on the topic.