Page loading speed is very important for both usability and SEO. The fast loading time will provide better user’s experience. Based on research, people will leave your site if your webpage loads slower than 3 seconds. Moreover, Google considers page loading speed to be one of ranking factors in the search ranking results. Here are the 11 tips to help you optimize your website for fast loading.
1. Avoid Landing Page Redirects
Why you need to avoid redirect? Redirects will produce an additional HTTP request to your server which make a delay in page rendering.
example.com → m.example.com
In this example, when user visit
example.com on their mobile, the server redirect them to
m.example.com. This will make slow mobile experience. Solution is to use responsive web design, no redirects are needed.
2. Enable Compression
When you enable GZIP compression, it can reduce the size of the transferred response by up to 90%. All modern browsers support and automatically negotiate gzip compression for all HTTP requests.
Rememver, always keep the original versions of your scripts, because it is easier to modify your scripts when you want to update them later.
4. Optimize Images
Your images should be optimized to reduce their file size without significantly impacting their visual quality. When you saving image for your website in Photoshop make sure that you use Save for Web and Devices feature and try to choose between JPG, PNG and GIF file formats.
Usually, flat color image is better optimize to save PNG format.
You can also remove unnecessary image metadata such as geo information, camera information and so on.
This will also reduce the size of the image. You can use this tool ExifTool to remove those information.
5. Use a Content Delivery Network
A CDN is a collection of web servers distributed across multiple locations to deliver content more efficiently to users. Deploying your content across multiple location servers will make your pages load faster for the users. Here are the three well known CDN services:
6. Place StyleSheets at the Top
The webpage will load from top to bottom. Putting CSS at the top will make the style load at the very beginning. This ensure the visitors will see what we intended them to see.
We do not want users to see un-styled page when viewing the sites.
8. Reduce HTTP Requests
9. Use Image Sprites
Image is the most important element in web content. We use a lot of images in our website such as icons and logos which would produce a lot of requests to the web server.
For the solution, image sprite is implemented. Image sprite is a collection of images put into a single image and then use CSS to position those image. This will reduce a lot of requests and make page load faster.
11. Leverage Browser Caching
You can take advantage of browser caching. Web browser will store a local copy of your files and assets so it can be reused for return visitors. This make the page load faster. You can leave it up to the browser to handle the caching for you, or you can tell the browsers what to do by modify your .htaccess file.