Clicky

close
  • Why V3B
  • Blog
  • Reports + Guides
  • Webinars
  • Contact
  •  Facebook
  •  LinkedIn
  •  Twitter
  •  Google +
  •  YouTube
V3B
  • Menu
  • Why V3B
  • Blog
  • Reports + Guides
  • Webinars
  • Contact
    • Guest Post Guidelines

Five Tips to Create the Perfect Mobile Responsive Website

By Shelly Kramer,

May 18, 2016
Five Tips to Create the Perfect Mobile Responsive WebsiteWhether you’re in marketing or IT, there’s likely just one word that’s your primary area of focus—and it’s got to be “mobile.” And if it’s not your key focus point, it’s likely it’s in the running for the top three. Whether you’re talking about devices or the generations that love them, mobile is much more than a buzzword—it’s an everyday part of how we search, how we learn, how we spend, and how we communicate.

I’m going to assume that your business has a website, but is your site and every landing page or marketing campaign you launch created with a mobile-first mindset? Is it fully optimized for mobile viewers who want dialed-down graphics, easily honed-in content, and quick-click functionality on their varying-sized smartphones and tablets? If you’re not there yet, let’s talk about why mobile first in everything you do, especially your business website, is critical and key in on five specific tips that will help ensure your website is delivering the best possible results—for you and your customers.

Why Mobile Responsive?

There are two ways to look at a mobile responsive website: From a development perspective and from a design perspective. The two are related and often combined, but I’m going to separate them for the purpose of this discussion—you’ll see why in a minute.

Development Perspective. Web developers often utilize grid layouts as they’re building sites. In fixed grids, display dimensions are pixel-based—that means proportions could be skewed, or excessive scrolling necessary, depending on what mobile viewing device is being used. Responsive sites operate on percentage-based fluid grids, meaning the coding calls for the layout or content to respond automatically to the screen size of the device in your hand. It’s great for online publishers because it can nix the need for numerous versions of the same site. It also helps decrease maintenance issues, and leaves mobile browsers more satisfied with their time on your page.

Design Perspective. From a design perspective, the needs of a mobile user are different than those of someone browsing on a desktop. Mobile users are in the moment, and you have limited space (and time) to give them what they need: A clearly defined call to action, hard-hitting content, and well thought-out graphic elements. (Oh, and don’t forget the white space. Never forget the white space!) Mobile users want what they want when they want it (and that’s never more true when someone is searching on a device) and they want success without having to work too hard—that’s mobile responsive design in a nutshell.

Tips for Mobile Responsive Success

Below are five design tips to help you create a great mobile responsive site:

  1. Be selective when choosing page elements for the top of your mobile site. If the banner, header, or key image at the top of your desktop site is large, be sure and scale it back for your mobile viewers. If you forget this step, you could push your content, calls to action, or other key items below the fold. Remember—out of site, out of mind. Keep your best elements visible from the get-go.
  1. Keep it clean. A great mobile site favors utility over graphics—unless, of course, the graphic elements add to that utility (think colorful navigation buttons). You want your page to be memorable, yes, but it’s hard to get the full effect of a graphics-heavy page on a small screen, especially when you factor in all that scrolling. It’s also important to keep in mind that too many graphics can mean uber-long load times—and nobody has time, or the patience, for that. The key is to keep your design clean, digestible, and easy to use on the fly.
  1. Consider rollup navigation. Do you know that little icon at the top of many well-done mobile sites, usually near the top left of your smartphone or tablet? It’s called rollup navigation, or a dropdown menu—and it’s definitely something you should consider using. These handy little buttons provide a starting point for your mobile viewers and allow them to go exactly where they want without having to search. It’s like a little teleporter: About page? Product page? Search function? Teleport them to their destination with as few clicks as possible. 
  1. Maintain your brand identity on every screen. We’ve been talking about what to change when going from a desktop to a mobile display of your site. What about things to keep the same? Always maintain the brand identity of your business, regardless of screen size or output media. Consider how the final design flows on a big-picture level—does it help further your business objectives? Does it feel cohesive? Viewers might be on a different version of your site, but they still want it to feel like yours. You can achieve that seamlessness with consistent branding.
  1. Focus on calls to action. Is the goal of your site to get more people to opt-in? Do you want them to make a purchase, download an asset, register for an event, or make a reservation? Whatever the focus of your company, give the mobile browser the chance to take action at every opportunity. Mobile viewers aren’t known for spending a ton of time browsing sites on mobile—that’s the point, right? To get what you need conveniently and quickly, literally from the palm of your hand? Abundant calls to action can help. Also, adding click to call functionality to your site can make a mobile searcher’s dreams come true.

The Takeaway

Here’s the deal—thinking mobile first isn’t an option when it comes to your business, it’s table stakes. Consider this: The Nielsen Norman Group reports that the average mobile session duration is 72 seconds. With such a limited window to connect with your customers, you can’t afford to give them a clunky, non-optimized experience. You could have the best product or content in the world—you could have exactly the product they are looking for—but many mobile viewers won’t make it past the first non-optimized screen. Can your business afford to lose those potential customers?

Additional Resources on this Topic:

Report: Mobile Visits to Retailer Websites on the Rise
Will Taking Your Site Mobile Help your Ranking?
Google’s Plan to Accelerate the Mobile Web Will Go Live Early Next Year

 

Photo Credit: estudioempresarial via Compfight cc

Shelly Kramer
Shelly Kramer

Shelly Kramer is a Principal Analyst and Founding Partner at Futurum Research. A serial entrepreneur with a technology centric focus, she has worked alongside some of the world’s largest brands to embrace disruption and spur innovation, understand and address the realities of the connected customer, and help navigate the process of digital transformation. She brings 20 years’ experience as a brand strategist to her work at Futurum, and has deep experience helping global companies with marketing challenges, GTM strategies, messaging develoment, and driving strategy and digital transformation for B2B brands across multiple verticals. Shelly’s coverage areas include Collaboration/CX/SaaS, platforms, ESG, and Cybersecurity, as well as topics and trends related to the Future of Work, the transformation of the workplace and how people and technology are driving that transformation. A transplanted New Yorker, she has learned to love life in the Midwest, and has firsthand experience that some of the most innovative minds and most successful companies in the world also happen to live in “flyover country.”

Tagged:how to design mobile responsive websitesmobilemobile first website designwebsite design best practiceswhy you need a mobile first mindset for your website

Popular Posts

  • Instagram Phishing: How to Prevent It and What to Do If It Happens to You
  • Experiencing Twitter Analytics Problems – This May Be Why
  • The Hanna Andersson Story: When Losing Customers is Okay
  • Email Tips: Clean Up Your Inbox With A Google Apps Script
  • 7 Keyword Search Tools for Twitter

Recent Posts

  • 10 Places to Turn for Marketing Inspiration
  • Why Paying Attention to Your Customers’ Social Initiatives Matters
  • Boosting Your Brand Through Social Media Marketing
  • Four Types of Social Media Alerts to Create
  • Finding the Balance Between Physical and Digital Sales and Marketing

Our Family of Companies

  • Why V3B
  • Terms and Conditions
  • Privacy Policy
  • Guest Post Guidelines
  • Contact
© 2022 V3 Broadsuite. All rights reserved.
All content published by V3B is determined by our editors 100% in the interest of our readers, independent of advertising, sponsorships, or other considerations.