Approaching Responsive Web Design from a Marketing Perspective

Posted August 6, 2016 by   in Content Marketing, Digital Marketing, Marketing Strategy, Responsive Web Design, Search Engine Marketing, User Experience, Web Design Strategy


With the scare of “Mobilegeddon” last year, it became a priority for every organization to make sure that their website was mobile-friendly and/or responsive to not be penalized by search-engine giant, Google. However, what most organizations fail to do in the process of make their websites responsive is to strategize how the website will look on certain devices so that their conversion rate can either increase or at the very least, remain the same.

There are a few simple steps to take to begin the process of strategizing the website in all its forms, so that not only does it look great across all platforms, but also keeps conversion rates climbing.

research

Although there are statistics that let us know just how many people are using desktop, tablets and mobile devices to browse websites, those numbers should not dictate which device your organization should optimize the website for. All websites are unique in that they have separate audiences, which have different behaviors when browsing and interacting with a website, so following a strategy that is not based on data from your organization could lead to unsatisfactory results. Instead, do some research in Google Analytics to find the acquisition, behavior and conversion data for your organization’s website. This information could completely change the strategy behind tackling the responsiveness of the website, whether it’s focusing on Desktop or even developing a new mobile app.

prioritize & plan

Before your organization can begin developing a strategy for the responsive view for each device, you must prioritize each element on every page based on the goals of said page, which will most likely be different for each. This is most likely done in the initial stages of the design, but it is important to revisit when developing a plan to make the website responsive. Here are a few things to think about while prioritizing and planning:

Navigation / sitemap

Most websites simply dump all of the pages of the sitemap into what’s called a hamburger menu for tablet and mobile size, but there’s more that can be done with the navigation for those viewports. First off, try to come up with a navigation list for the hamburger menu that is precise and not bloated to get users exactly where you want them. Next, try to identify 2-3 of the most important pages that you want to user to visit; those can be added as small navigation tabs underneath the header, so that the user doesn’t need to sift through many pages to find what they’re looking for. If your main goal is to have users call your organization, add a phone number link next to the hamburger menu in the mobile view for one-click calling and faster conversions.

Conversion Points/CTAs & CONTENT HIERARCHY

We’ve identified how to create an effective landing page and the most important thing to remember when creating landing pages is the order of the elements when viewed on tablet and mobile. While the “fold” on tablet and mobile is significantly smaller than on Desktop (especially iMacs), conversion points and CTAs as close to the top of the page as they can be without confusing the user; of course, having the form at the very top is ideal, but without content to reel the audience in, it might actually hurt the conversion rate.

Taking this idea a step further for the mobile view, try to identify any element or piece of content that can be stripped out and/or hidden, or at the very least, shown at the very bottom of the screen. There has to be a content hierarchy for mobile versions of every page or the user can get lost and even worse, leave the site entirely. Not all elements of a page should be created equally.

Button Placement

A general rule of thumb (pun intended) for any responsive website is to increase the size and text buttons for tablet and mobile devices. You want the user to be able to click the button, and let’s face it, there are some fat thumbs out there. Having tiny buttons might mean the user gets frustrated because it’s too small to click and therefore, doesn’t convert.

a/b testing

Of course, there are no rules or guidelines for coming up with a strategy for responsive web design, so conducting A/B tests is imperative to knowing what works for your organization’s audience when it comes to different devices. If your organization is marketing-minded, it should always be a goal to continually improve the user’s experience across all platforms, which in turn, will increase your website’s conversion rate.