How to Build Fast Loading Web Pages
Having a fast loading website is essential for bloggers in today’s world. Traffic now is mostly mobile, which has added to the urgency people expect to get to content.
In our experience working with publishers, we have learned several things about the balancing act of banner ads and fast pages. Any site running banner ads is going to load slower than one without, that’s just the way it is. That said, users are becoming more savvy, and generally more accepting of ads, with each passing year. In a pay-to-play type mentally, users understand that they’re accessing information and entertainment online for free and in exchange, there might be some ads surrounding the content – “surrounding” being the key word. It’s when the ads are blocking content that sends users over the edge.
When we’re working with SHE Media Partners on ad implementation and speed optimization, half a second on a fast loading page doesn’t is barely noticeable to a user. Google claims that a site’s page speed is only a small factor in their search algorithm and that only the slowest of the slow are demoted from search results because of it. That may be true, page speed may not be a direct factor in the algorithm, but user experience signals (bounce rate, exit rate, time on site, pages per session) also factor into the equation. Slow load times can result in poor user experience and that would impact engagement metrics.
Tips for fast page speed
1. Compress Your Images
Images are the number one reason we see slow load times. Uploading large image files directly to your site without compressing them will result in several extra seconds of load time. If you’re using WordPress, there are several great options for image compression plugins. Many of our partners recommend Imagify and Smush.
Read more on how to optimize your images here.
2. Ad Layout
For both page speed and user experience, don’t go overboard with the number of ad units per page. You also need to beware of ad formats that don’t follow Google’s best practices such as pop-up interstitials and video auto play ads. For SHE Media Partners, we manage the types of ads shown on our side so you’ll never have to worry about which ads are allowed and which aren’t. Partner or not though, you do likely control the number of ad units on the page. There isn’t a hard number to give that works for all sites, it depends on page layout and amount of content. Just make sure the user isn’t bombarded with ads each time they read your content.
3. Browser Caching
Each time a user clicks on a link to your site, calls are made to gather those files and display them to the user. Depending on your code, this can take some time. Common file types are images, CSS, javascript and HTML. Now imagine your code lives in a storage unit downtown. Without browser caching, each time someone goes to one of your webpages, you have to drive downtown to retrieve the files it takes to display your site. Think of browser cache as a miniature storage unit that is set up much closer to your home so you no longer have to drive downtown to get it. That would speed the delivery up quite a bit, right?
Web browsers have supported caching almost since the very beginning of the web for one very simple reason: it works. In its most basic form, caching means telling browsers how long to remember assets that they have downloaded from your site to avoid the need to retrieve the same file again within a certain time frame. Caching is especially valuable when you are monetizing via ads. Think of the many assets (images, scripts, html documents) that make up your pages. If half of those files are cached in between pageviews on your site, then by caching you have just decreased download times by 50% after the first page load.
If you’re using WordPress, try the W3 total cache plugin or WP Super Cache.
4. Plugins
Last we checked, 35% of the Internet is built in WordPress. There’s at least a billion websites, you do the math. We’re big fans of WP around here, but plugins do slow down load time. If you are using WordPress.org, make sure to audit your plugins regularly and deactivate any that you aren’t using. Upload new ones only when it will truly improve your revenue or performance. If you’re able to accomplish the same thing by hard coding and it’s not too complicated, do that instead of adding another plugin.
5. Minify the HTML
In this instance, to minify means to remove unnecessary or duplicated data without impacting how a browser processes the HTML. In order to do this, you’ll need to audit your code to remove any parts you no longer need, any duplicate code and shortening code if you can. Less code means faster load times.
6. Defer javascript loading
To defer the loading of anything, means to postpone til other elements of the page have loaded. Data shows that as long as users are delivered the content they’re looking for first, they’re less annoyed that other elements of the page take time to load in the background. Javascript files are typically large and bulky so by deferring their load til the end, this will allow the content and other parts of the page to load faster.
These six techniques will help speed up your pages for a better user experience. This will be more of a factor once Core Web Vitals has launched, start preparing today!
