Too many marketers still assume mobile strategy is only critical for consumer-centric businesses. Some pigeon-hole smartphones and tablets as devices just for entertainment, leisure and social activities. But B2B mobile usage is intensifying. A study from Google revealed an impressive 9 per cent growth in the use of mobile devices throughout the B2B purchasing process.
But mobile users aren’t easy to please. 64 per cent demand websites load in under four seconds. As marketers, website speed (or performance) is critical to our success – but can often feel out of our control. Below are key optimisation strategies that you can discuss with your production team: taking back control and ensuring your website performs well.
1. Mobile-first design
Mobile can’t be an afterthought. It’s far easier to design with smaller screens in mind from the outset, and scale up the experience for larger screens. Mobile-first design helps you pinpoint the content, visuals and technology needed to instantly grab your visitors’ attention.
2. Set a performance budget
This is a target for the final website’s speed and size e.g. 500KB for a homepage. Designers, developers and marketers must collaborate from the start to ensure that all design elements and features can be delivered within the budget. For instance, they’d need to consider whether the benefits of heavy features (like carousels) outweigh their potential impact on users with old devices and slow connections.
3. Code to reduce strain on devices
Boost performance by decreasing the processing time and power required from devices to load your website. Without drilling into the technical details, here’s a selection of optimisation techniques your developers should consider:
Prioritise above the fold – the rule of thumb for content visibility also applies to code. The code used to load the top part of the page should come first. Google Analytics can reveal typical user journeys allowing you to pre-load areas they’re likely to go to next.
Enhance from a core experience – developers can establish and deliver the core functionality (or content) of your website for all users, then add enhancements for users on devices that are likely to be faster (a technique called progressive enhancement).
Reduce feature testing – test libraries that are incorporated into code can take up far less space if they are customised to test for just the capabilities required.
Avoid plugins where possible – popular features (like carousels and lightboxes) can be implemented quickly via plugins. But, as plugins have to work in multiple scenarios they are often bloated. With a few lines of code, developers can achieve the same effect.
Optimise images – pictures can’t speak a thousand words if they don’t load for your users. There are plenty of ways to squeeze down file sizes, without losing quality: from compression tools and using the correct image format, to customising the quality between the subject (high) and background (low) of an image.
Incorporate CMS optimisation – optimising images for launch won’t help much if subsequent images, uploaded via your content management system (CMS), slow down your site. It’s important to ask your developers to pre-configure your CMS with as much automated optimisation as possible.
4. Increase your server’s efficiency
Network connection has a stranglehold over mobile devices. It impacts the speed your server can communicate with users’ devices to load your website. Speed can vary radically between networks, with users dipping out of 3G and 4G range while on the move. Weak WiFi networks can even slow down asset loading, depending on how close users are to the access point. Agencies can’t change this – but they can make your server more efficient so less bandwidth is required to load your site.
Cache static content – files that aren’t regularly updated should be stored on users’ browsers, so they don’t need to be downloaded again on return visits.
Pre-render pages – if dynamic content (e.g. user account information) features on your website, it needs to communicate with your database before being displayed. It’s much faster to do this on the server than in the user’s browser.
Use a content delivery network (CDN) – these store static content (like images and fonts) on a network of global servers. They can speed up loading times, by detecting the location of a user and delivering assets from the nearest server. For one of our clients, this tactic alone saved 48 per cent of bandwidth.
4. Test at every opportunity
Testing throughout production is the only way to simulate the user experience and resolve performance issues. The best resources include:
Google’s Pagespeed Insights – offers a visual analysis of your page speed, for desktop and mobile, suggesting optimisation techniques to improve specific sections of your website.
WebPageTest – allows you to test how live web pages perform in different countries and at different network speeds. You can review performance data or see a video of how your page loads.
But simulators aren’t enough. To gain a true picture of the user experience you need to test on real devices – both new and ageing, not just on your powerful office network but on mobile networks and congested public WiFi.
There’s no doubt performance optimisation is a complex subject. But, it’s one we can’t ignore. The speed your website takes to load has a major impact on conversion rates, especially for mobile.
These tips should arm you with the questions you need to ask the designers and developers working on your website. Better still, ask these questions when selecting your designers and developers, to ensure they’re attuned to target-driven, optimised website development.
