So you made it through the busy holiday travel season and are gunning for a great 2015.
The US (and SOME elsewhere around the world) economy is looking up, wallets are opening for travel, and the online travel website continues to popularize.
NB: This is an analysis by Peter Blum, vice president of product management at Instart Logic.
One of the best ways to improve on your bottom line is to improve your site performance. And that means radically improve performance on mobile devices.
Forrester Research is forecasting that mobile phone and tablet commerce will more than triple by 2018, going from $8 billion in in travel and food services in 2013 to $28 billion in that category five years later.
This was evidenced in 2014, when for the first time, people spent more time surfing the web on their phones and tablets versus laptops or desktops.
We all know that the quickest way to lose a customer, in general and to your competition, is with a slow mobile site.
"Websites that load too slowly" was the top complaint in the latest survey by Forrester of what problems drive European and North American mobile users away from mobile web sites.
Improving on mobile has several challenges: responsive web design makes it harder to cache images on the edge of networks; unpredictable "last-mile" bandwidth and connection speeds can create bottlenecks; and customers expect big, bold images on their Retina-class devices.
Understanding that problems with performance have an impact on your bottom line is the first step to better web application delivery. Here’s a framework on how to think about mobile web performance in order to achieve best results.
Adaptation
- Based on what we know about the user, which elements can we avoid sending?
Responsive web design and mobile browsing can result in over-downloading, forcing the entire desktop site down to a customer’s device.
The device, then, needs to parse the website and make it fit to it’s screen viewport. When rendering decisions are made on the device, it will force the entire site to download, but only render a certain portion, which causes a major performance gap.
Travel sites that get adaptation right, prioritizes their large image and multi-tabbed search box on its landing page, and lets the remainder of the page load after, to maintain user engagement.
By adopting a four-tiered architecture, you can enable your development teams to empower your customers to deliver a high quality of experience across all device types, exceeding customers’ expectations.
Sequencing
- What is the optimal order for elements on the page based on what the user can see?
- What can be loaded based on what the user will need next?
Perceived site performance is arguably more important for users than any sort of site delivery metrics and performance benchmarking.
If your customer can’t discern whether an image is fully loaded or not with their naked eye, does it matter?
The priority in sequencing on some sites will always be to load the key elements on the very top of the page first, with the less important elements loading subsequently.
Furthermore, anticipating your users’ path on your site helps to deliver a high QoE.
Compression
- What extraneous information can be squeezed out?
- Which format, size and pixel-density image should be rendered based on users constraints?
Compression is closely related to adaptation and sequencing: it is device dependent and also has awareness of the user’s network.
Using standard compression formats – GZip, WebP, and JPEG-XR depending on browser type – can reduce download time by up to 30%.
Newer algorithms can slice an additional 50% load time off the already compressed images by properly classifying the image (i.e. as a beach, building or face) and determining the minimum amount of data needed to maintain a great user experience.
Consolidation
- What web assets can be bundled together to reduce the number of round trips?
If you make too many requests against a high-latency network, it adds too much time to overall page load speed, and you’ll end up losing your users’ attention.
Part of any successful web performance strategy is to reduce the number of “round trips” that a site must make from the users phone or tablet back to the origin server.
Because web browsers by default load serially and not in parallel, round trips can quickly bog down site performance. Often JavaScript, CSS and other snippets of code required to customize a site are good candidates for consolidation.
Images, too, can be bundled.
Streaming
How can we modulate the quality of a media experience based on the user’s connection?
Before video streaming became common, watching videos online was incredibly painful. When streaming was introduced, that changed.
Publishers were able to modulate the quality of media experience based on the user’s connection and device. The good news is that streaming of images and HTML is also possible.
HTML and image streaming can radically improve perceived user experience by alleviating the blank screen, slashing wait times to first interaction, and allowing users to far more quickly start to use a mobile website.
Conclusion
With trends pointing toward and increasing use of mobile, and therefore, responsive web design, your pages are only going to get heavier and heavier.
The only thing you can do to keep your customers’ attention, and their business, is to improve on your web performance.
If you start with this framework and dive deeper into the details with your teams, you should be able to quickly build a deeper understanding of how to speed up your site performance, what the technological limitations are to date, and which new technologies you need to be trying to maintain edge over competitors.
NB: This is an analysis by Peter Blum, vice president of product management at Instart Logic. It appears here as part of Tnooz’s sponsored content initiative.
NB2: Website performance image via Shutterstock.