It has been predicted that the number of mobile connected devices will exceed the number of humans on Earth. The proof is in the data and yet the majority of established companies have been slow to adopt the responsive website design changes that provide the best web experience for their users, regardless of device.
For a website housing thousands of pages, a redesign of that nature is an incredibly overwhelming task if your goal is just to have a prettier website. But, we have learned first hand that a responsive redesign isn’t just about making your website look sleeker. A responsively designed website creates a far better performing site with increased traffic and ad revenue that will naturally adapt to the changing consumer landscape.
Beyond Design
Responsive website design may have the word “design” in the title but, choosing fonts, looking at color charts, and sifting through stock photos are such a small part of the process. The goals of a truly mobile optimized redesign are increased speed and functionality across devices. Mobile users have come to expect a more streamlined experience than when they are browsing at home on their desktop.
It’s also not as simple as taking the existing site and reorganizing it to make it fit within mobile constraints. Implementing responsive website design is a more technical and strategic than that; it’s essentially rebuilding and recoding an entire site with the idea of creating a new user experience. And, doesn’t that make sense? A user should have a completely different experience on their desktop than on their smartphone, and even tablet, because they are most likely engaging with your site differently on each device. It’s up to you to target and cater to their unique behaviors, capabilities and limitations across all screens.
Improved Website Performance
So, if you are considering a responsive website redesign, there are a few key things to consider that we hadn’t fully fleshed out until we were already in the trenches: layout, page performance and mobile ad management.
Website Layout
Often the first step in building a responsive site is to choose a layout or grid system. If your website contains ads, it’s important to choose a layout that supports all standard ad units in order to maintain valuable mobile ad space. We found that most open source grids predominantly accommodated a basic site structure with navigation most suitable for blogs. But, just because there aren’t any ready-to-go templates for a larger more complex, ad supported site doesn’t mean you can’t go mobile in a responsive way.
We ended up implementing a sizable amount of customization to the layout in order to provide a comparable experience to our desktop version. And given the reduction in screen space, it makes sense that the number of ads also needs to be reduced.
In fact, the whole layout website redesign process also encouraged us to take a closer look at our existing website architecture. Driving us to be more efficient, we found a way to improve and organize site architecture across all properties.
Website Page Performance
As we know, mobile users are always in a hurry; even if they’re just casually browsing, they don’t have time or patience to wait for pages to load. As such, it’s important to analyze the actual performance of individual web pages. The easiest way to do this is to set-up a third party monitoring system. The tool sits on top of your web application to monitor every request and provides a code-level diagnostic that relays information like how long it took for the user to load the page and what processes are taking the most time, both internally and externally. It makes it much easier to identify and correct pain points down to the individual page or a specific server or service.
Better Customer User Experience
Creating a faster performing adaptive site is going to generate a more positive user experience for today and tomorrow’s fluid online environment. We saw an increase in traffic, a 25 percent decrease in bounce rate, and our page views per visit grew 15 percent as a result of users being able to easily interact across all devices. Additionally, the redesign allowed for the opportunity to implement a more modern look and feel, which helps boost site aesthetics and credibility.
And while those are all positive results, they didn’t happen overnight. The best advice for any company looking at a responsive overhaul is to expect to iterate. Tweak and watch. It’s common for many established companies to look at a big undertaking and attempt to attack every element simultaneously and reveal one finished product. But, for a large website with many moving parts, responsive website design just doesn’t work like that. It’s important to start small and test, change, test… to make sure your users are positively reacting to the experience being presented.
Responsive website design isn’t focused on the latest HTML trick or the best use of imagery. It’s meant to anticipate users’ behaviours on smart phones and tablets, away from a desktop, and ask, “How would consumers use our website on the go? How can we maintain traffic and ad revenue across devices?” It’s a delicate balance between providing enough functionality, while maintaining a streamlined look and feel, and taking the needed time for testing will help you strike it.