Skip to main content
Joe Handles ItJoeHandlesIt

Design

Why Mobile-First Design Isn't Optional Anymore

More than 60% of your visitors are on a phone. If your site was designed on a desktop first and "made responsive" later, they can tell.

Open your website on your phone right now. Don't refresh. Don't tilt to landscape. Read the home page the way a customer would read it standing in line at a coffee shop.

How much do you have to pinch and zoom? How long does the hero image take to appear? Is the phone number a tap-to-call link, or just text you have to highlight and copy?

If anything in there made you flinch, you're not alone. Most small business websites were designed on a 27-inch monitor and made "responsive" as an afterthought. That used to be okay. It isn't anymore.

Mobile is most of your traffic

Across small business websites, mobile usually accounts for 60 to 75 percent of all visitors. For service businesses — restaurants, contractors, salons, anything someone searches for while out and about — it's often more than 80 percent.

Google has been ranking sites based on the mobile version of the page since 2019. If your mobile experience is worse than the desktop version, that's the experience Google is using to rank you.

Mobile-first is a discipline, not a checkbox

Designing mobile-first means you start with the smallest screen and the slowest connection, then add things only when you have room and bandwidth to spare. The result is a site that loads fast, reads cleanly, and works the way a thumb actually moves.

Specifically, that means:

  • Touch targets at least 44 by 44 pixels so a thumb can hit them without zooming
  • Type that's readable at arm's length without resizing — usually 16 pixels minimum
  • Phone numbers as tap-to-call links, not text-only
  • Forms with the right input types ("tel" for phones, "email" for emails) so the right keyboard pops up
  • Images sized for phones, not scaled-down desktop heroes
  • Single-column layouts that stack instead of cramming three boxes side-by-side at 320 pixels wide

What you don't want is a "mobile version"

If a designer offers to build you a separate mobile version of your site, run. That was the 2010 approach, and it consistently produced two half-good experiences instead of one great one. The right answer is one site that responds to whatever screen it lands on.

How to tell if yours is doing it right

Run your site through Google PageSpeed Insights on the Mobile tab. Look at the Largest Contentful Paint, Cumulative Layout Shift, and Interaction to Next Paint scores. If they're red, your visitors are feeling it.

Every JoeHandlesIt website is designed mobile-first by default. Sub-second mobile load times. Tap targets that work with thumbs. Forms that pop the right keyboard. We don't ship sites that fail PageSpeed because we know what your customers see when they arrive.

Want this kind of thinking applied to your website?

Tell us about your business. We’ll take it from there.