It is no secret in today’s digital age how important mobile site speed is to digital advertising. According to Google, 53% of customers will abandon your site if it takes more than three seconds to load. However, it is difficult to do anything more than pay lip service to the importance of mobile page load times without knowing how fast or slow your site is and what exactly is slowing it down.

Luckily, there are tools out there to help you understand your mobile site speed and diagnose areas of improvement, even if you lack developer expertise. Here are two helpful tools to assist you in speeding up your mobile pages.

WebPageTest.org

WebPageTest is a useful tool you can use to analyze your website’s performance. The tool tests site speed by simulating load times on a variety of mobile devices and browsers, as well as on different connection strengths.

webpagetest.org

According to Google, more than 30% of Americans access the web with their mobile devices using a 3G connection. Because of this, you should test your site at a 3G level. If you only simulate site speed on a wifi connection, you’re not checking what 30+% of your users are seeing. This means you could be losing 20% to 30% of your visitors right off the bat.

The test produces numerous metrics to analyze. One of the most important is the speed index, which is the average time at which the website’s visible contents are loaded. The metric is expressed in milliseconds, and Google recommends a speed index of 5,000 or less.

website speed index

The test provides a waterfall diagram of the load process, a video of the load time, detailed reports on processing and content breakdowns and more. It also includes a report card with a more anecdotal view of site performance. In this particular case, the page speed needs work:

speed test report card

Webpagetest.org provides technical reports to spot precise areas for improvement. To identify specific areas for improvement, however, we recommned using Google Chrome Developer Tools, which is more user-friendly. You can learn more about Webpagetest.org’s functionality and reports here.

Google Chrome Developer Tools

To access Chrome’s Developer Tools, toggle to the three dots on the top right of the browser, click ‘More tools’ and then select ‘Developer tools’.

chrome developer tools

Make sure the phone icon is selected and choose the Network view in the ribbon at the top of the page. Then refresh to run the page again.

google chrome developer tools mobile

The tool will generate a waterfall view of all the requests on the page. You can scroll through the ribbon enclosed in the red box of the screenshot below to look at XHR, JavaScript, CSS, Image, Media, Font requsts and more. At the bottom of the view is the total number of requests, total page weight, DOMContentLoaded time and full load time.

chrome load time tool

Overall, you should have a page weight of less than 1 MB and fewer than 75 total requests on a page. Cutting down on page weight will significantly improve your page load times, which will decrease your bounce rate. To reduce page weight, look for images and fonts over 100 KB and work to compress them. If there are more than 75 requests, review the JavaScript and CSS files to see if the files are necessary. Files that are not essential should be removed. Google recommends fewer than 20 JavaScript files and fewer than 10 CSS files.

With these two simple tools, you will be able to tell how strong your mobile page speed is and identify areas to make specific recommendations, regardless of your developer expertise. The recommendations will give you actionable items to show your developers, reducing the amount of time they need to investigate what is slowing down page speed. These metrics can also provide invaluable real-world insights into the mobile experience and help you prevent potential customers from abandoning your site.