Having a Fast Loading Website Helps UX and SERP Rankings
Websites these days are all about the user experience. We want our information to be delivered quickly, and we want it delivered seamlessly.
Help the User, Get Rewarded from Google
So what does that mean for a website with lots of images and advertisements that take too long to load? Leaving a user waiting 5, 10, or even 15 seconds as the information on the page jumps up and down, and images sl-o-o-w-l-y fill the screen? It means an incredible amount of lost opportunity.
Search engines have begun to take page load speed into consideration as one of the factors for page ranking. Plus, since users typically expect a web page to load within 2 – 3 seconds, any delay beyond that is said to cause a 7% drop in conversions, an 11% drop in page views, and a 16% drop in customer satisfaction. Yet, many mobile websites today take an average of 22 seconds to fully load. Slow-loading sites mean lost customers and a potentially negative impression of your site or company.
But, you say, my site seems to load okay for me. Isn’t that good enough? How bad could it really be? Well, think about this. Your site might look fine on an upgraded internet connection, but it might be pretty terrible for Bob, who’s just getting by with spotty service and slow speeds. And really, do you want ‘just okay’ as the best option anyway?
Fortunately, you can optimize your site’s speed by implementing some simple, best practices, since one of the biggest causes of slow download times has to do with the images you use and how you use them.
Eliminate Heavy Images
A heavy image, one that’s too large and bulky, takes longer to show up on your page, which means a visitor to your site is stuck waiting and watching for that image to load. How do you fix the problem?
- Reduce the file size. Stock photo sites like Shutterstock offer downloads in several size options. Make sure you download the photo in the smallest size appropriate for the space on your site. If you’re working with your own images, compress them using a plugin like Imagify or Smush, or if you’re working with images in Photoshop, use the save for web option.
- Make sure the size of the image matches the box. If you’re putting a 4000 x 8000 pixel image into a box that holds a 200 x 400 pixel image, the web browser will download the larger size and then reduce it to fit the smaller box. This means extra time before your viewer sees the image. Make sure you scale your image yourself.
- Reduce the quality of images. Save images at a lower quality without sacrificing user experience. Lower quality means quicker downloads. Play with different quality settings until you arrive at one that allows for a faster download and still looks good.
- Use the right type of file. For the web, you want to use JPEG, PNG, and GIF files. These are file formats that compress the image without a great loss of quality. Stay away from Tiff and Bitmap files. These offer high quality, but unfortunately are bulky in size, causing very slow download time.
Think About How the Web Works
With a little understanding of how content is delivered across the web may, you might be able to tweak the speed in which your site is delivered.
- Consider using a content delivery network. A Content Delivery Network, or CDN, can be useful if your site has a wide reach. By storing photos on a CDN in Europe, for example, users in Europe will see your site load faster because the data is stored locally and doesn’t have to travel as far to get to their device.
- Incorporate image caching. Using image caching when developing your site allows for temporary file storage on the user’s browser, so the entire site doesn’t have to reload every time they visit it. This means less wait time for your user.
Optimize the Way You Use Other Visual Elements
In addition to the images scattered throughout your website, consider that visual elements like banners can cause slow load times.
- Choose HTML5 banners. If you’re using banner ads or similar visuals on your site, creating HTML5 banners instead of GIF animations will improve your speed. HTML5 banners are simply smaller in terms of file size used to make the magic happen. And this translates to faster loading. An added plus? HTML5 handles file compression a bit better than GIF, so you’ll end up with a better-quality product.
As you move forward with your website design, you’ll find that incorporating the above tips can significantly improve the UX for your site, translating to an increased ability to get your message heard and convert visits into sales revenue. Contact us to learn how we can help you create a site that gets meaningful results for your business!
