Blog

What Does Mobile-First Web Design Mean?

3 min read
in Blog, Design, Web Development
web design on mobile phone

If you have a website or want a new website, it is important to know what mobile-first web design is and what it means for you.

Over the past few years, Google’s search index has been favoring sites that have a mobile-friendly version. Since mobile phones have become the primary way people access the internet, this really isn’t a surprise. However, this past July, Google took another step toward increasing mobile internet searchability by predominantly using the mobile version of a website for indexing. In short, if your site isn’t mobile-friendly or your primary content isn’t mobile-accessible, your site will purposely be pushed lower in search results. This is true whether the site is being searched for on desktop or mobile.

Designing mobile-first is important when creating a website. In the last 5 years, the number of mobile phone users worldwide has gone up by nearly one billion users.

What is mobile-first design?

Mobile-first design is a design strategy. In practice, it means designing a website on the smallest screen possible and working up to tablet and desktop screens. From there, progressive enhancement allows designers to add features and functionality as the intended display grows in size. This additive approach ensures that content stays central to the design rather than taking a backseat. Designers start this process keeping all screen sizes in mind. Mobile users aren’t just using phones. They could be using a tablet or even a small-screen laptop.

In the past, website design began with the desktop version and then a corresponding version was built for mobile devices. In some cases, this was even done as a separate website. However, the most successful websites use one website that adjusts automatically for screen size.

Is desktop design still important for my website?

Utilizing a mobile-first approach doesn’t mean you should ignore desktop. If done properly, your developer will use coding known as media queries to enhance your desktop version along the way. For some businesses, a desktop design may still be more important. For instance, if your primary target audience is businesses rather than consumers, they’re probably accessing your site from their desks. Just bear in mind that those sites are still going to be indexed based on their mobile design.

Even though your specific site may be used by more desktop users, it needs to have a mobile-first design.

Content is king with a mobile-first design.

We say this so frequently it’s almost cliche: Content is king. Nowhere is this more obvious than with a mobile-first design. We have seen many websites that focus on flashy actions or animations at the expense of delivering proper content. Unfortunately, those sites are no longer the sites that receive the attention of search engines. The decline of desktop computer users, coupled with the increase in mobile phone users, has reinforced the concept that content must always guide the design process.

What content is best for mobile-first websites?

The answer to this question really depends on the purpose of your website. Are you looking to sell a product? Maybe you want people to fill out a contact form. Or maybe you’re providing information as part of a public service.

Whatever your goal is if there is a call-to-action that should probably be very visible on the top of your site’s pages. Putting the “Contact Us” button at the bottom of your homepage creates a poor user experience in mobile since it requires the user to scroll more than they are likely to.

Beyond the call-to-action, make sure the top of your page is free of unnecessary graphic embellishments. At the very least, keep them to a minimum. Mobile users are looking for information first. Save your pictures and graphics for users who are looking for them.

How can I make my existing website mobile-friendly?

If your existing website isn’t mobile-friendly or doesn’t function well on mobile devices, there are still a few options available to you. Many modern websites are built on a content management system (CMS). Most of these CMSs handle mobile-first design very well. You may want to have a qualified web developer review your site to see if it can be modified rather than replaced.

If you’re using WordPress for your CMS, the solution may be very simple and not cost very much. It’s possible that using a technique known as graceful degradation will allow your site to compete better in a mobile world. Each situation is different. It’s best to contact a developer with experience in this arena.

Meet the Author

Jason is a co-founder of ThirdSide. When he’s not building websites, making graphics, or meeting clients, he’s hanging out with his family doing family things or hanging out with performers doing performer things.

He has a Star Wars obsession that some consider to be…unnatural.

Previous post:

Next post: