Did you know studies show you have 5 seconds to capture the attention of a website visitor before they will leave?
If your website takes 5 seconds or more to load you are in pretty bad shape. It’s simple math.
Search engines also recognize the importance of fast loading websites. Google gives ranking preference to faster loading websites.
The bottom line is that faster loading websites outperform slower sites in every aspect of performance measurement. Even though internet speeds are increasing every year, we are still not to the point that website loading time is not an issue.
So what can a website owner with limited technical skills do to increase load time? Here are some tips:
1. Test Your Site.
Before you can make any corrections to increase speed site you obviously need to know where there is room for improvement. The good news is that there are a plethora of free tools you can use to identify areas for improvement. PageSpeed Insights by Google is a great place to start. Simply give them your website URL and click “Analyze”. Google will return a list of items that are slowing down your website. Don’t be overwhelmed if some of the terminology seems foreign to you. Google immediately offers plenty of articles and tutorials that show you exactly how to resolve the problems. There are many other websites that will offer free feedback on your website’s loading times. If 4 out of 5 review sites present the same issue then you at least know where to begin.
2. Keep images to a minimum and compress them.
Images contain a lot of information in them and can take up a lot of data transfer time. The larger the image, the longer it will take to load. It should come to no surprise then that a web page with one or two images is going to load significantly faster than a web page with ten or more. When designing your website try to keep this in mind. While images can often help support the message you are trying to convey to your visitors, they can also have an adverse effect if they are not used properly.
Another tactic to use to increase website loading time is image compression. Image compression is reducing the size of an image or graphic file without diminishing the quality of the image. Again there are plenty of free tools that can help you to accomplish this. Compressjpeg.com and tinypng.com are two free sites available online that will compress your images for you.
Simply upload your images to their website and they will return a compressed image that you can then download for use on your website. They use smart compression techniques so your images do not lose any of their quality… at least not to the naked eye. Once you have all of the compressed images compressed, all you need to do is replace those image files on your website.
When it comes to actual image types, JPEG, GIF and PNG are the recommended file types to use. Images that involve a lot of color are best suited to be JPEG. If the colors can be flatter, then GIF is the way to go. For those images that need to have a transparent background then PNG is really your only option. Just make sure that you avoid any BMP or TIFF image formats. These two contain too much data and any of the first three file types can achieve the same image results in a much smaller file size.
Another option to decrease image load times is to use a Content Delivery System (CDN). Simply put a CDN reduces that actual physical distance between a website visitor and the images, videos and other large files that are on your web page.
Imagine someone visits your website from California, but your website is sitting on a server placed in New York. Each image, video or PDF download must physically travel across the internet from NY to CA. As these flies travel they will be passed on by multiple servers along the way. The larger the file, the longer it will take.
A CDN keeps copies of your large files stored on servers all across the country (or the world for that matter) on strategically placed servers to reduce the actual distance. So now imagine that the same California website visitor can receive those large files from a server located in Los Angeles. Those files can be delivered much quicker which equates to a faster loading web page.
While you might incur a cost to use a CDN, it can actually make quite a large impact on your load time and overall website stability. If your website has a lot of traffic, using a CDN benefits everyone by using multiple servers to load your website. It reduces the amount of work that your main website server has to do which increases speed and reduces the risk of your website crashing. According to a leading CDN company, Incapsula, websites using their CDN on average are 50% faster and consume as much as 70% less bandwidth. YouTube is also a CDN in of itself and is commonly used to host and deliver website videos.
3. Time for the technical stuff
While the jargon and the implementation for these tactics might seem daunting if you have minimal technical know-how, the concepts for them are pretty straight forward. Even if you require some assistance from your webmaster with overcoming these hurdles, it is a really good idea to know how each of these are affecting your website load times.
a. Minimize CSS & JavaScript
Simply put the CSS code files for your website control the look and layout of your website. The Javascript files control functionality. When a website first loads, it is going to need to look at the CSS files to control how everything looks to your visitor. One of the major mistakes that web designers make is not combining all of this code into one CSS file. Each time a web page needs to load a CSS file precious milliseconds are used. If a website needs to load multiple CSS files, then those milliseconds can really start to add up.
There is another technique that can be used to help speed up CSS loading time and it is called “Inline CSS”. Inline CSS simply means that the code is put directly into the web page rather than into a separate file. While it is good organizational practice to keep your CSS in an external file, there are certain situations where inline CSS can help. Content on your page that is “above the fold” is the first content your visitor is going to see. If your above the fold content is loading slowly (background images for example), then inline CSS can help increase the loading time for these page elements.
Javascript files follow the same principles as CSS for the most part. Again it is a best practice to keep all Javascript in one external file to help reduce load times. There are often times however when Javascript must be included directly on the web page. In these cases, it is best to place the Javascript code at the end of the web page code if possible. Since Javascript controls the functionality of your website it is not imperative to have that functionality available to the visitor before the page finishes loading.
b. Optimize your website for mobile devices
If your website is not mobile compatible, then you really want to make this a priority. We have an excellent article that can help you determine if your website is mobile compatible. Now is the time to get ahead of the curve! A website that is not mobile friendly will certainly slow down load times, but will also frustrate users visiting your site with a bad user experience.
Many websites are already seeing the majority of their traffic coming from mobile devices. These devices often use 3G or 4g networks when surfing the internet. These mobile networks are nowhere near as fast as your home internet connection. Therefore, you might want to take a long hard look at what content needs to be delivered to website visitors using mobile devices.
Do you have large background images or videos that automatically play when your web page loads? You might want to rethink that! Both of these can dramatically slow load times on mobile devices. Videos especially take a long time to load and can actually make your website visitors angry for using their valuable mobile data plan time. Never have a video automatically play for your mobile visitors! You should also deliver smaller image files for background images on devices with smaller screen sizes.
c. Reduce the number of plugins on your website.
Many of us use WordPress or some other content management system (CMS) to run our websites. These CMS platforms offer a ton of easy-to-use plugins to install nifty features on our websites. Unfortunately, many of these plugins offer additional features that we will never use.
It is best practice to really investigate the plugins used on your website to ensure you are using them as efficiently as possible. Make sure you deactivate any plugins that are unnecessary or aren’t being used. While they can be great to accomplish tasks quickly, you also want to make sure they aren’t sucking up bandwidth by running unnecessary code in the background.
d. Implement website caching
While a lot of this is done automatically there are still some options you can implement on your own to help improve web page load time. The cache is simply a temporary storage on a visitor’s computer where images, CSS & Javascript files and other elements can be temporarily stored. The next time that visitor comes to your website, some of the heavy lifting won’t need to happen. Those larger files are already cached in their computer.
One trick that can be implemented is adjusting the expiration date for your cached files. Each file that gets cached includes an expiration date. When that date expires the file will be removed from the cache. While it is possible to set cached files to “never” expire it is best practice to set your expiration date for one year or less. Setting your cache expiration date for more than one year violates the RFC guidelines.
If your website was built using WordPress, then you might want to check out the W3 Total Cache plugin. It does a tremendous job and gives you multiple options to optimize your website caching capabilities.
e. Reduce all HTTP requests.
In layman’s terminology an HTTP request is any time a visitor’s web browser fetches a file from a web server it uses HTTP (Hypertext Transfer Protocol). Every request takes time to happen. This is why we suggested combining all of your CSS & Javascript files into one individual file. HTTP requests are also used to fetch images, videos and even the web pages themselves. Reducing the number of requests is a great way to reduce your overall load time.
One way that HTTP requests are often misused are through broken links on your site and also 302 redirects. Every time a visitor clicks on a broken link on your website or in a search engine the web browser needs to ask the server where the visitor should be sent. More often than not visitors are directed to a 404 error “Page Not Found” web page. Not only is the visitor not landing on the page they intended, but more time is wasted trying to get them to where they wanted to go.
Another bad use of HTTP requests are 302 redirects. A 302 redirect is a temporary solution to send visitors to another page. For example, let’s say you created a new About Us page on your website and are changing the URL from www.yoursite.com/about to www.yoursite.com/about-us. Search engines have the first URL indexed and will show that URL in search engine results. When a visitor clicks on the first URL the web browser first tries to pull up that URL only to be told by the server to send then visitor to the new URL. This takes a lot more time than you might think.
The better practice is to create what is known as a 301 redirect. A 301 redirect is a permanent redirect that can send the visitor to the new page much faster. In addition, 301 redirects pass between 90-99% of link juice (ranking power) to the redirected page. The best option of course is to avoid redirects all together if possible. Really think about the structure of your website before you build it and try your best to avoid URL name changes.
There are of course more technical techniques you can implement to increase the speed of your website load times, like compressing web pages using gzip or investigating the server response times from your hosting provider. These are usually issues reserved for websites that see a tremendous amount of traffic. If you are like most of us trying to operate an average website, then the tips and tricks we just covered should get you started on seriously improving your website’s load time.
