In a single session on a computer, how many times do you visit a page only to leave a few moments later because your information hasn’t loaded quickly enough? If you’re anything like the average browser, this happens fairly often. Don’t worry; you’re not just getting less patient with time. Sites are growing slower and the implications for website abandonment are startling. Today, we’re going to examine average page size, website abandonment rates, and what you can do to reduce both.
File Size and Website Abandonment
In 2010, the average website was approximately 600 kilobytes in size. With today’s download speeds, a site of this size would load in a snap, ready for user interaction within fractions of a second. However, as of May 2013, the average website has jumped to 1246 kilobytes, more than doubling in size in just a few years. While few people would shy away from downloading a file just north of one megabyte, having to make that download with every click of a link becomes an exercise in sluggishness.
Although pages have increased in size between 2010 and 2013, the average download speed has grown to compensate for larger data demands–this should solve the problem, right? Over the last few years, the average broadband download speed in the United States has nearly doubled from 5.1 megabits per second (mbps) to 10mbps. Webpages are more than doubling in size while download speeds aren’t quite making the mark. Although there’s a couple percentage points discrepancy between size and speed increases, there’s a larger concern at play: mobile browsing.
As of Q4 2013, according to Akamai, the average mobile download speed across service providers in the United States is 5.23mbps, just a hair faster than three-year-old broadband. As mobile browsing increases in prominence, we’re creating bloated websites that take nearly twice and long to load as sites did in 2010.
A Second Too Late
An extra second here and there may not seem like a cause for alarm as we examine Internet usability, but the numbers tell a different story. According to a radware study from Fall of 2013, 57% of users claim that they’re likely to abandon a page after 3 seconds of loading. An extra second or two does make a big difference to these users.
This same study of the top 500 retail websites found that the median page takes roughly 5.3 seconds to reach an “interactive” state and another 3 seconds to fully load. While users expect pages to complete in 3, the reality is that some sites take as long as 8 to completely download and display. The disparity between user expectations and reality creates frustration that breeds website abandonment among less patient shoppers.
Pain Points: From Site Bounces to Checkout Abandonment
Poor site performance can hurt your business at every turn, but it’s especially painful in two areas in particular:
- Site Bounce – According to our research, 27.5% of site bounces can be attributed to slow load times. It’s simple; people don’t want to wait. When you force visitors to wait, especially on the landing page, you run risk of increased bounce rates.
- Checkout Abandonment– Two primary motivators for checkout abandonment include a lack of trust (15.8%) and an unnecessarily long checkout process (6.5%). A page that takes long to load contributes to both of these metrics. If your checkout pages slowly materialize, consumers that are about to input sensitive credit card information will lose confidence in your site’s security. Additionally, the longer the checkout takes, the more opportunity users have to abandon.
With this evidence in mind, slimming down your website should increase buyer confidence, reduce checkout abandonment and bounce rates, and ultimately increase conversions. So, what steps can you take to get started? Before you think about redesigning your website altogether, there are a few quick tricks to try:
- Image Optimization – A quick google search shows that there are lot of options out there for reducing image filesize. One of the most popular (and our personal favorite) is TinyPNG. Using this tool will reduce the size of any .png with minimal to zero visual change. Run any essential images through TinyPNG before you upload them and see a significant increase in performance.
- Sprite Sheets – For small images that show up on multiple pages across your site, such as header buttons and logos, consider using a sprite sheet. In the most basic terms, a sprite sheet is a collection of small images made into one larger image. Above is an example of what an Amazon.com sprite sheet looks like. When you want to display a particular button, you show only the relevant piece of that single, large image. This is particularly helpful in increasing performance because requesting one larger image from a server is much less taxing than asking for dozens of little ones.
- Minify – A minifier is a tool that takes your finished code and reduces all unnecessary white spaces and notation. While this program will drastically reduce readability to human eyes, minified code looks the same to the server. Without loading any of the cosmetic notation that makes it easy to scan, it’ll load faster for your users.
- Proper Thumbnails – If your retail site displays thumbnail images of products, be sure that the thumbnails you use aren’t simply large photos scaled down in code. No matter what the value of your “width=” and “height=” values in your HTML, if your source image is huge, it’ll take just as long to load. Create new, smaller images for thumbnails–this is essential.
Removing unnecessary website heft is just one of many ways to reduce website abandonment. For more information on optimizing your traffic and generating additional revenue, contact UpSellit.
Written by Bryan Gudmundson