Since 2007 the mobile revolution has hit every aspect of our lives. It has changed the way we communicate, shop and entertain ourselves. It has even changed the insurance industry.
We can now use apps and mobile websites in all parts of the insurance process. This includes research, quote comparison, purchase, payment and management of our policies.
A lot of pixels and ink have been spent telling agencies they need to embrace mobile. The good news, most agents have. The bad news, they're not doing it right.
It's the number one question we get when helping agencies further their online presence. Should my insurance website design be adaptive or responsive?
What is an adaptive website?
Adaptive websites change according to the device you are using.
This mobile website design looks at characteristics that identify the user's device. Then, it displays the appropriate version of the website accordingly.
Adaptive websites are touch friendly when viewed on non-desktop-sized screens. So search engines index, accept and mark well-designed adaptive websites as mobile friendly.
There are a few drawbacks of using an adaptive website strategy.
First, you must create two separate websites for the mobile and desktop experience. You can do this by creating a subdomain (example: m.yourwebsite.com) or subfolder (i.e: www.yourwwebsite.com/m/) with your websites.
Second, you need to maintain an up-to-date list of device characteristics. This list helps your website determine which version to display.
Finally, you will be creating duplicate content since it will be on both your mobile and desktop websites. This means you run the risk of search engines down ranking you for duplicate content. (Good news. You can overcome this by correctly using canonical tags.)
What is responsive design?
The current rage in insurance website design is responsive design.
Most web designers prefer this tactic. It's easier to deploy one website that meets the needs of both desktop and mobile users.
Responsive websites let you tailor your insurance website design for multiple screen sizes. It's a single website and design for mobile, tablets and desktops.
This website design overcomes the three major drawbacks of adaptive designs. But, it has its own challenges.
First, mobile devices have limited screen real estate. Large amounts of content work well on a desktop but causes a scrolling nightmare on mobile.
Second, it's hard to develop navigation menus and calls to action that work on mobile as well as they do on a desktop.
Third, textual and graphical elements might not work as expected when scaled up or down.
Finally, a responsive design loads the same graphics for mobile and desktop. But, the two devices have different bandwidth and speed considerations.
HTML5 and CSS3 improvements have alleviated these concerns by cutting bandwidth usage. This includes srcset and the lazy loading of assets. (Lazy loading means only loading an image when it's on screen.) However, most websites are not yet properly using these advanced techniques.
Adaptive insurance website design on left, responsive design on right.
So which one is better for my agency?
ITC's Insurance Website Builder platform supports both responsive and adaptive designs. We have more than 4,200 unique insurance agency websites on our platform. Our analytics of more than four million unique visitors to those websites in 2016 tell an interesting story.
The answer to the above question depends on the goal of your website. If your goal is to inform and educate your visitors hoping it will lead to an inbound phone call, then a responsive website is the way to go. If you want your website to generate leads and provide 24/7 client service, then go with an adaptive website.
Responsive Design Insights
Responsive designs perform better for content driven websites. These are websites that drive education and thought leadership through many blog entries.
Visitors on responsive websites stayed five times longer than they did on adaptive designs reading an average of two articles per session. Beyond that, adaptive websites outperformed responsive sites in every other aspect.
Adaptive Design Insights
There are several key factors that determine a website's performance... time on site, number of pages visited, bounce rate, page load speed, and goal conversion.
When comparing adaptive and response designs, we looked at these standard metrics. But, we also did a deep dive of the journey visitors took using flow diagrams and heat maps.
Session Duration and Pages Visited. In 2016, users spent 11 percent less time on adaptive websites while visiting 19 percent more pages.
In a weird quirk of mobile usage review, when it comes to mobile websites, quicker is better. Mobile users want to find the relevant information and move on. Touch friendly websites give visitors this quick, direct experience.
In contrast, user behavior on responsive designs revealed a pattern of searching. The users scrolled around opening menus looking for something... often never finding it before they exited.
Bounce Rate. Continuing on the duration and page visit findings, we next looked at bounce rate. Bounce rate is the percentage of visitors who looked at a website and left unable to find what they needed.
Users of responsive websites bounced nine percent more often. Again, this is due to the differences between a curated adaptive mobile experience and responsive designs doing double duty.
Speed of Site. Using a typical 4G mobile connection, adaptive websites loaded an average of 280 percent faster. This is largely due to responsive websites having assets that are 385 percent larger for viewing on a desktop.
Keep in mind we did these tests and analytics against our Insurance Website Builder hosted websites, which use advanced techniques like lazy loading. When viewed on a desktop device, our responsive websites load twice as many images as it does on mobile. This is because of the larger screen and assumed unmetered bandwidth.
During this study we also referenced other external insurance agency websites. These external websites did not use these bandwidth saving methods. As a result, they often took 10 seconds or more to load megabytes of data on a mobile device.
Goal Completions (the Money Maker). I've always said it. The real measure of a website is not the number of pages visited by a large amount of visitors but the submissions.
Since we only build websites for the insurance industry, we have a specific set of goals we track... quote, service and contact requests.
Across all goals per visitor, adaptive websites outperformed responsive sites 6 to 1. When looking only at the ratio of quote submissions per visitor the margin widened to 10 to 1. Meaning visitors on adaptive websites were ten times more likely to submit a quote. The one exception was people making contact submissions, where both designs performed identically.
We explored this anomaly further and found the reason adaptive websites perform better. It all has to do with the data that insurance agents collect within their website forms.
Collecting the correct information from a consumer is a delicate process. The more information you can get, the better qualified the lead.
But, there are a few fields that can stop the buying process cold. Think Social Security number, driver's license and other hard-to-reach information.
Mobile devices present a new challenge, the on-screen keyboard. Have you ever typed in a VIN number using a virtual keyboard? Jumping back and forth between the letters and numbers gets old quick.
Guess what happens when you combine this with asking too many questions. Consumers are quick to abandon the process. This is where a key tenet of responsive design falls short.
In the majority of responsive designs, you ask the same questions on mobile as you would on a desktop. Adaptive websites don't ask the same questions on both devices. They will ask limited questions with mobile friendly entry and leave the full set for desktops.
From our research it seems adaptive websites are best for the insurance industry. They provide a better user experience culminating in more leads for the agency.
If I have a responsive design, how can these insights help me?
The evidence leans towards adaptive websites being the best choice for agencies. But, what if you have or like the look and feel of a responsive insurance website design? What can you do to maximize your website's performance?
Here are 10 things that can assure your responsive design performs for your agency.
1. Test your website's speed and asset size. Larger websites cause slow load times and sluggish performance. It's an overall poor user experience on any computer. Mobile devices and their limited connections will only compound the frustration. You can make images smaller, use less images, and only load them when needed.
2. Make sure your call to action is front and center as the page loads. If the visitor has to take any action to find their next step, it might be the back button.
3. Have an easy-to-use navigation menu when resized on a mobile device. You don't need every option, just the important ones.
4. Keep important information one swipe away. If information requires many swipes, you might be asking for an exit.
5. Keep forms short. If at an event a prospect only has time to hand you his business card, you now have enough information to contact him. Why should be your website be different?
6. If you do have long forms, hide the less important questions when your responsive design reconfigures itself for a mobile device.
7. Make sure entry fields are touch friendly. Make Yes or No buttons toggle switches.
8. Use native HTML5 input controls as able. Yet...
9. Make date entry fields three drop downs: month, day and year. This is one time I advocate against the usage of HTML5 input controls. Why? The Android date selection widget is notoriously difficult to select past years. Forgo it altogether, and use the widely accepted three drop down option.
10. Watch your analytics. Do you see users exiting your website at a certain point? If so, you might want to find out if it is a content issue, visitor expectation issue or a user experience issue.
Consider these discoveries when deciding between adaptive and responsive insurance website design. Responsive designs perform better for content heavy websites. But, a well-designed adaptive website will outperform responsive designs in form submissions.
We derived the results of this study through analysis of more than 4.4 million unique visitor entrances in 2016 to more than 4,200 North American insurance agency websites. We only considered entrances to the default home page for this study. This represents 67 percent of total entrances to participating insurance agency websites. We excluded visitors of adaptive mobile websites using non-mobile browsers from the dataset. The study required visitors to submit a quote, customer service or contact form to be counted as a goal completion. Measurement tools include internal tracking for form submissions, Google Analytics for load timings and visitor tracking, and Crazy Egg for heat map tracking.
The Insurance Website Builder platform supports both adaptive and responsive designs. We optimize both experiences to maximize your return on your website investment. Request a free consultation, and learn what design works best for you.
About the Author
As president, Laird Rixford is responsible for sharing the vision and direction of the company with its customers, vendors and affiliate companies. He oversees the direction for each of ITC’s products and the company’s sales and marketing department. An expert in insurance technology and marketing, Laird is a recognized public speaker and has presented at industry events across the United States.Follow on Twitter More Content by Laird Rixford