Countless research papers and benchmarks prove that optimizing your website speed is one of the most affordable and highest ROI providing investments you can make in your radio station website. Here at Skyrocket Radio, we do all we can at the server and CMS level to ensure your sites are loading fast as possible.
Why Speed is Important
Lightning-fast page load speed amplifies visitor engagement and retention. In turn, this can mean more online revenue for your station. Every second delay in page load decreases customer satisfaction by 16 percent, page views by 11 percent and conversion rates by 7 percent according to a recent Aberdeen Group research study. It’s also important to note that Google now uses website speed as a ranking factor.
In a nutshell, having a slow website will negatively impact the following:
- Traffic and page views
- Conversions
- Sales
- Brand image and perception in the mind of your visitors
So What is Page Speed?
Page speed is the length of time it takes a web page to be downloaded from the hosting server and displayed onto the requesting web browser. Page load time is the duration between clicking the link and displaying the entire content from the web page.
The critical principle in maximizing website performance is to focus on page speed optimization from the ground up. Performance optimization plugins, server-side scripts, and final tweaks have minimal – however noticeable – impact on page speed and load times. Yet, some developers and online business owners tend to overlook page load times in their website development and design strategies.
How Slow is Too Slow?
Most studies show that 1 in 4 visitors would abandon the website if it takes more than 4 seconds to load. 46 percent of users don’t revisit poorly performing websites. Website owners have a mere 5 seconds to engage visitors before they consider leaving. 74 percent of users accessing the mobile site would leave if it takes longer than 5 seconds to load. Strangely, visitors would rather spend excessive time browsing for information on a fast-loading website full of irrelevant information than waiting a few seconds for the right website to load.
Steps You Can Take
So now that you know how important page speed is, let’s work to optimize it. Images are a key component of every website. According to HTTP Archive, images make up for more than 60% of data loaded on web pages. So, image optimization is extremely important and perhaps the lowest hanging fruit, if you are looking to speed up your website.
1. Resize Your Images
This is a must have. Resize your images to exactly what is required on your website before uploading it to your page or post.
For example, you have a 2000x1000px image for a news article. On your website, however, you need to display a much smaller image of 800x400px. It’s very important that you scale down the original image to these dimensions BEFORE sending it to the browser. A resized image is much smaller than the original and will load much faster.
Incorrect resizing of images is likely the biggest area of optimization required on most websites. Unfortunately, most content authors tend to overlook it. When images are not resized first, the resulting excess of image data can result in slower websites and bloat of your hosting space.
There are many image editing programs available. One popular example, of course, is Adobe Photoshop. However, if you’re just starting out a free program may be a better choice. Here are a few that are free to use:
- Photoshop Express
- GIMP
- Windows Live Photo Gallery (comes pre-installed on many Windows computers)
- Preview (comes pre-installed on most Mac computers)
- Pixlr
2. Optimize Your Images
The next step in speeding up your image heavy website is to choose the right format and quality for every image on your website.
JPG, PNG and GIF are the most common image formats being used and are each suited for different use cases. There is another relatively new image format called WebP that combines the best of these image formats, is 30% smaller in size and is supported on almost 75% of the modern browsers. Given the huge performance benefits, you should deliver your images in WebP format wherever possible. On the other browsers, you can continue to deliver the original image format.
Image quality is a measure of how the image looks visually. There is a direct correlation between image quality and image size. Higher quality results in higher image size and, as a result, a slower website.
Different image compression methods take advantage of the limitations of human eye to distinguish between small changes in color information to compress images. As a standard, a quality level of 40 to 60 (on a scale of 100) is usually a good trade off between image size and quality. Each image is different though. Depending on the use, some images can be compressed as low as 0 and still be usable. Here is an example of the same 300x290px image showing different levels of compression with their corresponding file sizes.
[su_row][su_column size=”1/3″ center=”no” class=””]
[/su_column] [su_column size=”1/3″ center=”no” class=””]
[/su_column] [su_column size=”1/3″ center=”no” class=””]
[/su_column][/su_row]
[su_row][su_column size=”1/3″ center=”no” class=””]
[/su_column] [su_column size=”1/3″ center=”no” class=””]
[/su_column] [su_column size=”1/3″ center=”no” class=””]
[/su_column][/su_row]
The images are almost similar visually but have different file sizes. As you can see, this image doesn’t start losing visual quality until between 40% and 20%. We are not suggesting that you compress all images down to 0%, but specific uses could justify it. Feel free to download these images so you can see the file sizes for yourself.
3. Avoid Image Hotlinking
Image hotlinking, also known as “inline linking” is the act of linking to an image on another person’s website, instead of loading the image on your own server. On the surface, this seems like an act that will save you server space and a lot of bandwidth, especially if you have a high-traffic site, but it can actually make your website really slow if the website that hosts the image you hotlinked is experiencing a downtime or is slow.
Whether it is images inside your content or banner images for your ads, be sure to host all images on your website rather than linking to them elsewhere.
4. Minimize Your Ads
Tempting as it may seem, selling too much real estate on your radio station website drastically degrades its performance. Too many ads or slow loading ads will drive bounce rates and many of those visitors will never return. The financial losses that come with that scenario outweigh the monetary benefits of handing over vast website spaces to advertisers.
External ad services like Google Adsense mean that you’re calling an external source to supply the ad. The more calls you have, the more you wait and the higher the load is on your own server.
According to one research study, the cost of generating revenue with a banner advertisement is almost 33 percent of additional latency. Intrusive pop-up ads further aggravate visitors into abandoning websites at even higher rates.
Nevertheless, online advertisement is the primary source of income for many online businesses. The key is finding an optimal balance between a number of ads that increase revenue and limiting them as much as possible for your visitors.
5. Use Caching when possible.
When you visit a website there are certain elements that are stored in the cache, which acts as temporary storage. This means that the next time the user visits the site there will be less time spent rendering all of the on-page elements. This helps to shave time off your website’s loading speed.
– Server caching – on the server
– Site caching – on the visiting computer
– Browser caching – within the browser
Conclusion
We have covered all the major techniques around image optimization and performance improvement. After implementing the above suggestions, you should test your website speed to see if there’s a difference. Here are our recommendations for testing your website speed:
Pingdom Website Speed Test: With this tool, you should aim to get a reduced site load time as well as a reduced number server requests. This tool also compares your website speed to other websites online.
GTMetrix: This tool analyzes your website speed using Google Pagespeed Insights and Yslow and gives you a rating from A to F. It also offers suggestions for improvement.
Webpage Analyzer: This tool gives you information on your page size and website download time, and it offers suggestions on how to improve your site load time.
Google Pagespeed Insights: You should aim towards a score closer to 100. It also has a mobile speed test tool that you can use.
WebPage Test: The closer your score is to 100, the faster your website is.
