Increase conversions, customer engagement, and online sales by boosting your mobile site speed with these tips from Google and Moz.
Mobile phones continue to be the most used form of web browsing, increasing in popularity every year. In fact, 52.2 percent of worldwide web traffic came from mobile phone use in 2018. While building dozens of responsive websites at Parallel Interactive, we’ve found that mobile site speed is the most important factor to consider when developing an engaging user experience that converts.
Lead with Mobile Site Speed
If a slow mobile site drives customers away, a fast site can help attract and retain them. The good news about speed is that It’s an easy thing to treat in the short term, but without making it a long-term priority, your mobile site speed will significantly degrade over time.
Keep Your Site Lightweight
The complex, customized designs of the past have been replaced with simple, minimalist designs. It’s easy to get caught up in making the most eye-catching mobile web design, but this can make your site gets slower and slower if you keep adding more and more design elements.
On a mobile screen, websites often become too crowded, so it’s important to keep everything simple and decluttered. We recommend eliminating the steps and clicks that your customers have to take in order to keep them on your site and shorten the conversion funnel. You should also only include one call-to-action on each page to reduce the amount of code on the site and improve your user experience.
Optimize Your Images
To reduce your image load times, review Google’s suggestions for image optimization including prioritizing the importance of images on your site, substituting for text/CSS when possible, choosing an efficient image format, and compressing/resizing images. You can also introduce browser caching to automatically get rid of unnecessary or outdated clutter from your site at regular intervals.
We recommend taking the time to review the images on your site and delete all unused media files. Make sure your images are no larger than they need to be and reduce file sizes to 300 KB or smaller. Your images should also be in the right file format, such as JPG or PNG, and compressed for the web.
Pro Tip: Marketers and developers can easily install a WordPress plugin like Smush that automatically compresses and appropriately reduces the size of the images uploaded in your web content.
Minify Your Code
Cut Down on Redirects
Redirects come in handy for SEO, but just like code, redirects have limited uses. You can’t add redirects all over your site and expect it to perform well. Redirects on your site trigger an additional HTTP request-response cycle and delay page rendering. When you click a link, the server provides content for the page found at that link. But if there’s a redirect, there’s no document at the link, so the server has to find the page where the document lives and retrieve it. This process has to happen for each file on a page, meaning every image, CSS, and script has to go through each redirect, significantly slowing down your site.
Load Above the Fold First
Google recommends pages should load and be interactive in 3 seconds or less on mobile devices. It’s important to start displaying content as quickly as possible because the faster your pages load, the less likely visitors will bounce or close the page due to slow loading.
Customers see the above-the-fold content before they start scrolling, so why not load this first with lazy loading? By implementing lazy loading, your site needs to do the minimum work required to speed up. Structure your HTML so the initial response from your server sends the necessary data to render the above-the-fold content of the page immediately and then load the rest as needed.
Accelerated Mobile Pages
Another way to increase your site speed for mobile is to add Google’s Accelerated Mobile Pages to your site. AMPs are mobile web pages that can be pre-cached so they appear near-instantly when clicked. Telefonica (one of the world’s largest private telecom companies) wanted to increase conversions to their site while decreasing transformation costs. Adding AMPs to their website improved load times by 70 percent – from six seconds to two seconds – boosting site interest by 31 percent.
BMW is an example of a site that used AMPs along with Progressive Web Apps to invoke the same feelings of speed, performance, and reliability as their products. These state-of-the-art technologies create a secure web experience with quick response times even during poor network conditions. The reaction to BMW’s site upgrades was dramatic; the amount of people who clicked from a BMW.com to a BMW sales site increased from 8 to 30 percent.
Lighthouse is a website experience tool built by Google to measure Progressive Web Apps, accessibility, performance, SEO, and more. Add your URL to Lighthouse in Chrome DevTools, and then it runs a series of audits to generate a report with a score and improvement indicators. Since Google announced that mobile site speed and user experience are top SEO ranking factors, you need to fix these issues immediately. Check out how Yoast SEO used Lighthouse to test their site.
Test Your Site
In order to create the best mobile experience possible, you need to have an idea of how your site is currently performing. We recommend conducting a mobile site speed audit with Google’s PageSpeed Insights or Test My Site tools to understand current industry benchmarks and how your site compares. Test My Site provides you with 3 tools as a starting point for improving your site speeds including custom page fixes, a free site speed report, and industry benchmarks/impacts.
To test your site on the tool, follow these simple steps:
Milliseconds can earn millions on mobile and in a new world where mobile is overcrowded with web possibilities, it’s one of the best ways to set your business apart from the competition. Test your site in as little as 60 seconds and start improving your mobile site speed today.