Marketing & Web Performance: How Site Speed Impacts Metrics
There’s a real transformation happening in how businesses think about site speed. Historically, businesses that were concerned with speed were concerned with performance-specific metrics. Now, as site owners start to understand the connection between site speed and user engagement, focus is increasingly on engagement metrics like Time on Site, bounce rate, and conversion rate. Our concentration now is on creating successful users; users who can easily and quickly take action on your site and be pleased with the process. An active user is going to convert on your site, and a happy user is going to do it more than once.
The Relationship Between Marketing and Site Speed
Marketers are great at experimenting to find the best combination for conversions. But many marketers don’t yet consider speed a priority in this equation. Or, if they do, it’s at the bottom of their list.
But a well-performing site is actually crucial to improve website metrics across the board. Plus, it saves conversion marketers the time it takes to research and test what will resonate with users most, because all site visitors are looking for an appropriately fast site that meets their expectations. The proof is in the numbers.
Site Speed Impact: Traffic
Marketers want more traffic. Always have, always will. But with a slow, un-engaging site it doesn’t matter how much traffic you get; if you can’t keep visitors on-site initially, they most likely won’t return. For a website that takes more than three seconds to load, 40% of visitors will abandon a website and 80% of those visitors won’t return. In addition to this, 74% of mobile visitors will abandon a mobile site that takes longer than five seconds to load. Improving site speed is one of the best ways to maximize organic and paid traffic.
Site Speed Impact: Conversions
Every additional second added on to your load time results in a 7% loss in conversions. For example, Making Barack Obama’s campaign website 60% faster increased donation conversions 14%. Of course, the opposite example is also true: the new healthcare.gov website is such a performance disaster that it’s preventing users from completing simple tasks, dropping conversion rate metrics.
Similarly, shaving two seconds off of Mozilla’s landing pages resulted in a 15.4% increase in conversions, which meant 60 million more downloads per year. That’s just a two-second difference, so any impact you can make has the potential to improve your business.
Site Speed Impact: Engagement
Keeping a user engaged on your site has a direct impact on conversion rate and revenue, amongst other marketing metrics. A one-second delay in response time can result in 11% fewer page views and a 16% loss in customer satisfaction. Plus, 40% of online shoppers feel that the most influential factor for the to revisit a site is whether the website will load quickly. At Yottaa, we’ve seen that an optimized site can lower bounce rate 5-10%, increase Time on Site by 30%, and as a result increase conversions by 30%.
Site Speed Impact: Revenue
Here’s the real kicker: your online revenue is suffering if you’re not optimizing:
- A 7% loss in conversion (per second) means that for a site with an annual revenue of $2 million per year, a one second delay could cost $140,000 in revenue
- 46% of people who abandon their shopping cart cite slow website speed as the reason
- $3 billion is lost annually from cart abandonment due solely to slow website pages
- An extra second of page load time reduces per-user revenue 1.8%; two seconds reduces it by 4.3%
- 79% of shoppers who are dissatisfied with website performance are less likely to buy from the same site again
Where Do I Start?
Your primary goal is to get your site to load within three seconds. After that, improvements to site speed will provide incremental improvements to conversion rate and overall ROI.
Corporations like Facebook and Google have entire fleets of developers working to maintain site uptime and make consistent improvements in page speeds and overall UX design and engagement. Most businesses, understandably, don’t have those resources at their disposal.
The balance of “how much work is too much” to achieve site load speeds of less than three seconds depends on the work you’ve already done. Are there easy fixes left to do? Then do them! Are the remaining fixes costly to do in terms of engineering effort? Then table them.
If you’re using an automated optimization solution like Yottaa, it’s likely that the small amount of effort needed to further tune your site performance is worth it for your potential conversion and ROI gains. If you’re using a manual solution (hand-engineering), you may reach an event horizon where the cost/effort of implementing further performance improvements would outweigh the benefit of the increased performance (especially if you have lots of work on your plate and limited resources, as we all do).
The two main objectives in approaching performance optimization are to reduce the number of asset requests on a site and reduce the weight of the site. In doing so, your site will have fewer requests sent to the server for retrieving, and they won’t weigh down the site while loading.
Here are five of the top tactics to start optimizing your site for speed and engagement:
1. Eliminate 404 Errors and Missing Assets
Fixing bad pages or missing assets is the easiest way to get started improving performance, on desktop and on mobile. Any 404 errors are going to increase your site bounce rate, and most likely lose you traffic. You can diagnose these fairly easily with Google Webmaster Tools by going to Diagnostics and then Crawl Errors. 404 errors happen when a user visits a page that has been deleted from the site. So first, try not to delete any pages. For the most part, there’s no need to. If you must delete a page, implement a 301 redirect to your homepage, or a similar page.
If you have any campaigns running or have past campaigns still live, you’ll want to make sure any visitors you might gain from those don’t hit a dead end page with a 404 error. For programs that are no longer live but might still be accessible, you can redirect the old landing page URL to your homepage instead.
2. Optimize Images
We all want beautiful, high-resolution images on our websites. Today, there’s a greater demand for great design and large visuals, which puts greater pressure on a site’s load time and infrastructure. Luckily, there are easy ways to optimize even large images.
Lossless image compression refers to methods that involve no downgrade in image quality. These are methods that make images “lighter” (that is, fewer bytes) without making them any smaller, blurrier, or less colorful. You can also employ lossy image compression has a drastic effect on the weight of the image file. The freedom to downgrade the quality of the image allows for a significant reduction in the weight of the image – even if the perceived quality is not reduced proportionally. There are online tools you can use for this like ImageAlpha, TinyPNG, and Photoshop.
CSS sprites are a tools to combine images into one file to reduce the overall number of image requests, and are the preferred method for reducing that number. It involves bundling small images into a larger file. When the large sprite image that contains the smaller ones is fetched from the server, CSS is then used to precisely position specific parts of the image in the right places on the page while hiding the other parts from view. The result is a page that looks the same as if it had loaded each image separately, but that only required one HTTP request instead of several.
3. Concatenate & Minify JavaScript
Concatenating JavaScript reduces the number of requests by combining multiple JS files into as few files as possible. Reducing the number of requests is effective in optimizing a site because no matter how small the file is, every single request the browser makes takes at least 20 ms, and could take upwards of 100 ms or more. Concatenating files and scripts is accomplished by writing a line of code that encompasses information that was previously contained in two or more lines of code. This is a common practice that can be accomplished by a developer or using free script-based tools.
Minifying JavaScript reduces the sizes of JavaScript files by eliminating the wasted space that tends to be in most files created by a developer. This wasted space helps the developer organize the code into structured blocks, enabling them to more easily debug the code and for others to understand the code. All of the extra characters create bulk, however – bulk that collectively does nothing to improve how a website appears to the visitor. Each character of code (including spaces) factors into the weight of the file, and, as performance gurus know, every byte counts. Minification simply gets rid of the excess white space and characters automatically.
4. Reduce 3rd Party Requests
Third-party assets are among the worst offenders on today’s websites. Social media widgets, trackers, and other gadgets on your site are hosted in locations far and wide and on servers you have no control over. When those widgets have performance issues, their problems spill onto your site and drag down your performance.
The simplest way to deal with these third-party assets is to have relatively few of them. Before adding anything new, assess whether it’s truly going to drive engagement and add value, or if it’s simply a trendy or aesthetic choice. For existing widgets, the best way to maintain performance is to ensure that they load asynchronously.
Typically, third party assets are <script> tags, and the browser will put a hold on downloading all other assets until this tag has been downloaded and executed, meaning one bad asset can prevent the rest of the page from downloading for sometimes whole seconds. By forcing third-party assets to load asynchronously, you’ll prevent the possibility of your site’s download process being arrested by one problematic widget.
5. Use a CDN
When traffic volume is high, your web server can easily get so bogged down processing asset requests that it may have trouble dealing with the more important functions such as presenting the page views and processing transactions. A CDN offloads server request from your infrastructure to dedicated, sometimes global servers in multiple data centers, so that your site won’t crash or slow with heavy traffic. This is normally considered the first step in better web performance, because it effectively takes care of the back end metrics we looked at earlier and expands your infrastructure capabilities.
Next Steps
Optimizing your site for better performance may seem like a bit undertaking, but not doing so means leaving money on the table. After all, there’s little point in investing in on-site marketing initiatives that users don’t engage with.
You can start by working with your IT team and laying out to performance priorities, getting easy fixes knocked off the list and identifying bottlenecks. Another option is implementing an automated solution which will optimize your site in real-time (like Yottaa).
To learn more about performance optimization, try some of these additional resources:
