Designing for Mobile First

When creating any website, consider the various device types and screen sizes that users may be accessing it from. From my experience, mobile users are currently making up 60-70% of website traffic. This is where responsive design comes in – it’s a framework that allows a website to automatically adjust to the user’s device.

There are various tools available to help create responsive designs, such as Bootstrap, Foundation, and Bulma. Many of the common CMS platforms offer a form of responsive design out of the box for less technical website creators.

When designing a website, it’s essential to take a mobile-first approach. This means designing templates and content types with mobile devices in mind, and testing them on a variety of display sizes. However, it’s important to keep in mind that graphics, breakpoints, copy, and buttons may not always line up perfectly. Therefore, it’s essential to test and improve the design as necessary.

Agency Secret: Require that mobile designs be part of any mockups you get! Don’t settle to just review a desktop version of any creative, it only shows that your partners are being lazy. Mobile is harder, but when it’s the majority of your users, don’t settle.

Optimize the following for mobile:

  1. Load speeds: Large images can significantly impact a website’s load speed, especially on mobile devices.

  2. Button size: Make sure buttons are large enough to be easily tapped with a finger. Avoid small buttons, especially in pop-ups.

  3. Hover states: These may not be intuitive for mobile users, so consider the user experience when designing hover states.

  4. Mobile navigation: Navigation should be easy to use on a mobile device, with simple finger interactions.

  5. Checkout: Keep the checkout process simple, with minimal pages, auto-completion, multiple payment options, and a guest checkout option.


Need Help Prioritizing eComm Projects?

I’ve spent years with major brands analyzing and prioritizing enhancements to eCommerce stores. Book a quick conversation with me and let’s see if I can help prioritize your business!


Key Takeaways

Wrapping it up, designing for mobile first requires a responsive design framework, testing and improving the design for various display sizes, and considering the specific needs of mobile users such as load speeds, button size, hover states, mobile navigation and checkout process.

Also, don’t settle for just a desktop mockups! Get the mobile designs and ensure you’re supporting most of your users.

Recent Blog Articles

The Cultural Imperative: Bridging the Gap Between AI and People

AI adoption does not fail because of technology. It fails because people are not brought along with it. While infrastructure enables AI, culture determines whether it is actually used. Industry research consistently shows that the vast majority of AI failures stem from execution issues such as employee resistance, confusion, and lack of structured adoption, not…

Continue Reading

The Strategic Foundation of AI: Moving From Hype to Value

For Artificial Intelligence to transition from an experimental technology to a driver of competitive advantage, organizations must move beyond ad-hoc adoption. Strategy is the compass that ensures AI initiatives align with business goals rather than just technical possibilities. A robust AI strategy is not merely about selecting tools; it is about defining the organizational vision,…

Continue Reading

eComm 101 – Promotional Pitfalls

This section outlines the things to be wary of in the world of e-commerce promotions. If you read the article on promotional best practices, these are the counter points that you need to consider. There are some serious downsides to promoting incorrectly. That is why testing and reviewing the performance of your event is so…

Continue Reading

Case Study – Experience Design

In our continuing exploration of how operations supports creativity, I wanted to dive into a recent restaurant experience. Here, the food, the experience, the brand itself, are all thought of as creative expressions, but I would propose that operations are paramount to conveying this. Case in point for this exploration, the first impression and greeting.…

Continue Reading