Beyond Responsive: Taking a multi-screen approach to mobile web design

So, you’ve been listening to what experts have been saying about mobile web design, and you’re ready to upgrade your site accordingly. Where do you begin?

Give Them What They Want

It’s best to start by reconfirming the purpose of your website – which is to attract and delight new and existing customers, right? What do they want? What do they need? First, let’s talk about what they don’t want. According to a report by the marketing firm, Blue Hornet, “70% of consumers delete emails immediately that don’t render well on a mobile device.” Your customers don’t want to struggle with their mobile viewing experiences. They don’t want to have to do extra work to be able to view a certain web page or email.

What Do They Want?

Per Google, “74% of mobile users are more likely to revisit a site that works well on mobile.” Google also reported that, “67% of mobile users were more likely to buy products or services from a mobile-friendly site.”

Today’s consumers want a mobile user experience that is simple and convenient, fast, flexible, and fluid. They want instant access to relevant information, and they don’t want to have to work too hard to find it. They want the ability to search on multiple screen types, without having to worry about sacrificing the quality of their viewing experience. 

Above all, they want (and expect) a user experience that matches their lifestyle. If you can’t deliver that, then they will find another business that can. 

What Makes a Good Mobile Experience?

The factors which affect the quality of a mobile user experience are many, but some of the most important ones include:

1.    Fast Loading Pages.

If it takes too long to load the pages of your website on a mobile device, you can absolutely expect your visitors to leave. Today’s consumers are nothing if not impatient and resourceful. If your website doesn’t give them what they want, when they want it, they will go elsewhere to get it.

2.    Intuitive Navigation.

There is almost nothing more frustrating than being unable to find information on a website that claims to be the best source of that information. Whatever your main product or service is – be sure it’s easy to get to information on how it works and how to buy it. After all, that’s why your customers are there in the first place. And, consider what they’re looking for when they access you on a mobile device: location, hours, prices, directions. 

3.    High Quality Content.

Having content on your website just to have it there is not the best way to reel in customers. To attract today’s consumers, less is more, and this is especially true when it comes to the mobile experience. Be sure to have only the best content published on your site wherever possible. Everything else is just wasting space (and likely slowing down the mobile user’s page load speed), so get rid of it.

4.    Relevant Content.

Providing easy access to the most relevant information is critical in delivering a great mobile experience. Not only must your content be excellent, but it must be as relevant as possible to both the user and the screen they are viewing your website on. For example, a desktop user may be looking for information about your products and services, while a mobile device users may be looking to call or visit your local store. 

5.    Consistency and Flexibility

Your website should be as consistent as possible across the many screens upon which users may view it. If there are certain tools which don’t work well on a mobile screen, then you’ll need to provide an alternative tool, and/or provide the option of switching to a desktop version for increased functionality as necessary. With today’s website viewers jumping back and forth between screen types, you can no longer get away with skimping on the quality of one experience vs. the other if you want to stay in the game.

What’s the Best Solution?

There are a variety of solutions to capturing the mobile consumer through strategic mobile web design, some of which include:

1.    Responsive Design

When a site is built to be responsive, this simply means the site content scales and reorganizes for various screen sizes, accordingly. By using a single HTML code base for all device platforms, it allows for the content to resize itself based on the screen being used. Responsive design is a great solution for providing a good mobile experience for users.

It keeps all content on the same URL, which makes it easy to share and link to content across various platforms. It provides a streamlined experience, allowing the visitor to utilize features across multiple screens. It does, however require a considerable amount of planning to ensure that the experience across all devices is of the same quality. While it’s certainly a better solution than a non-responsive web design, it certainly isn’t the only solution.

2.    Dynamic Serving

When using the dynamic serving method, the web server detects the type of device being used, and displays a custom experience to accommodate that specific device. This method allows developers to present a custom experience for each type of user, fast loading pages, and easy changes for the developer, and keeps all users on the same URL.

However, it can be complicated to keep content for each custom page up to date at all times. Plus, the difference in experience from a smartphone to a desktop may confuse your viewers, especially if they are drastically different.

3.    A Separate Mobile Site

Another way to serve your mobile audience is by creating a mobile site that lives on a completely different URL than your desktop site. Mobile visitors are redirected to your mobile URL site, which is optimized accordingly. This site will only be shown to mobile users, while those using tablets, TV’s, and desktop computers will only see the original version.

While changes can be easily made to this type of mobile user solution, having multiple URLs can cause page load times to increase, and, if not done correctly, can make it difficult for Google to find and understand the relationship between your desktop vs. mobile website.

4.    Mobile-First/Multiscreen Approach

By going beyond responsive design, and instead using a mobile-first or multiscreen approach to mobile web design, you have a better chance at delivering the highest quality viewing experience for multiple screen types. This requires some planning and research to find out what specifically users might search for while using different devices.

For example, a developer might consider showing vs. hiding certain content on a smartphone device vs. a desktop screen, depending on what users are more likely to be looking for. By keeping different types of users in mind when designing your website from the beginning, you’ll deliver a more consistent and quality mobile user experience.

Why Tailor to Mobile Users?

A Google and Mobile Marketing Association Survey reported that, “53% of American consumers use their smartphones to access search engines at least once a day.” Mobile users are not going away. Therefore, it is critical to carefully consider their experience when designing or redesigning your website.

And, by going beyond responsive design, and designing for mobile first, your sales and marketing teams will have an easier time creating and executing campaigns to effectively reach your target audience — regardless of what device they may be using on any given day.