Page Load Time Optimization

It is a human behavior that people don’t like wait for anything. They can irritate and bounce from your website if you have high page load time so optimize your page load time to increase conversions and User Experience. Some awesome tips are given below…

1. Reduce http requests

Every element of website take time to download and responsible for page load time. Check some techniques to reduce page load time.
– Use CSS for Icon and Vector Images (ex.-email, phone icons)
– Reduce number of elements from website

2. Minify CSS, JS & HTML Code

There are many tools available to minify CSS, JS and HTML Code. Actually concept behind this technique is remove spacing between codes and reduces the file size.
https://developers.google.com/speed/docs/insights/MinifyResources

3. Enable GZip Compression

It can reduce download time and study says it can reduce page load time upto 70%. You need to add gzip compression code in .htaccess file for both site desktop and mobile site both (if you have separate mobile site).

Gzip compression checker

4. Enable Browser Cache

in this technique cookies are stored in user’s system and when user open the page second time it is opened quickly because most of the request will not be sent again on server. You have to mention expire time for all elements and files (cacheable resources). You can take 7 week to 1 year expiry depend on page content and elements changes.

5. Put JS files in Bottom (Defer loading JavaScript)

JS provide functionality for the website and People want to see your content first then they use functionality so fix all JS files in bottom. We use “onload” event to call external javascript and The external JavaScript will not load before page content is loaded.

6. Put CSS files on top

CSS file should be placed on above of the fold because people want to see your content first so load above of the fold content first.

7. Reduce Server Response Time

Time taken to send first request to server is called server request time. Better hosting can reduce your server response time. Google Page Speed Tool Provide server response time report.

8. Asynchronous Scripts

Synchronous scripts load one by one and responsible for high page load time.
Asynchronous scripts load simultaneously and help to decrease page load time.

9. Avoid Inline CSS

Big amount of inline css can make your page heavy so avoid inline css.

10. Combine CSS files and JS files

– Combine multiple JS into Single JS File
– Combine Multiple CSS into Single CSS file
This technique reduce the http requests.

11. CSS Sprite

In this technique we combine images and reduce http requests. Use small images, vector images or icons and combine them and then call every image by using css.

SEO Note: Do not add

12. Images Optimization

– Use small images as possible, small images take less time to load
– Compress all big images by using online image compression tool.
– Use only JPG, PNG and GIF file formats in Images
– Image (Media files) load after content
– Use CSS image (Ex.-email, phone icons are predefined in css)
– Remove Empty sources from images

13. Remove Broken Links

If you have broken links in the web page then page will take more time to load so find broken links or 404 error pages by using broken link checker tools and webmaster reports and fix them.

14. Use CSS images

Today, CSS technology has reached their higher level and now CSS is playing big role in the page load time. You can use css code for many small icons and vectors like email and phone icons. So you can reduce http request by using css images.

15. Remove render blocking completely

Check render blocking status in Google Page Speed tool and fix it – https://developers.google.com/speed/pagespeed/insights/

16. Optimize third party code (Reduce DNS Lookups)

Generally we use many third party scripts and CSS example – Social Media scripts, live chat, tracking code, embedded video code, Google map etc. they are also responsible for higher page load time because they increase DNS lookups.

So avoid third party tools if possible and improve website performance. The main reason behind the high load time due to third party files is that these files are called from the third party server. You can put all files in your server and reduce load time but update these files time to time.

17. Use Light Weight Font

Use light weight font style and family. Google fonts are best for this.

18. Optimize pages coming from Database

Optimize your database by indexing technique (some platforms have in-build facility like WordPress)
Don’t load DB data on page runtime, use publish technique to load db data.

19. Optimize Embedded video

Use YouTube Video in popup instead embedded video – Show an image same as YouTube video and when user click, run video in popup.
Second option is use image for embedded video and run video after user click – here is guide – http://techbrij.com/embed-youtube-video-fast-load-responsive

20. Delete unused plugins, apps, extensions

Shopify apps, Magento extensions and WordPress plugins are responsible for page load time, they are also called when page loading and increase time. If you have installed apps/extensions/plugins and they are not in use then remove them.

21. Clean Your Database

Remove all spam comments permanently even from trash and stop auto save functionality from your wordpress website.

22. Specify Image Dimensions

Specify image height and width with image for faster rendering. You can see details of without dimension images from Gtmetrix tool. Here is screen shot.

23. Avoid CSS @import

If you import second css file in your first css file then it increase page load time due to one by one loading instead parallel loading. You can check how many css import you are using from this tool.- https://gtmetrix.com/avoid-css-import.html

24. Server Response Time

A study says First byte time (also call TTFB) matters for SEO and CRO. First Byte Time (also call it server response time) should be less than 500 ms. You can check it in Google page speed tool.

There are three more tools to check this.
http://webpagetest.org
https://tools.keycdn.com/performance
http://www.bytecheck.com/

25. HTTP/2.0 Protocol

Http/2.0 protocol helps in page loading  and faster than old http/1.1 protocol. HTTP/2.0 especially handle all JS files speedily.

Test your site on this tool to know your protocol type – https://tools.keycdn.com/http2-test

Conclusion

Optimize all the above points in all browsers (chrome, Firefox, IE, Safari and all mobile browser) and all devices (like mobile, tablet, desktop) Best tools to optimize page load time…
1. https://gtmetrix.com/
2. http://tools.pingdom.com/fpt/
3. http://www.webpagetest.org/
4. https://developers.google.com/speed/pagespeed/insights/
5. http://www.zoompf.com/

Saurabh Rawat: I am SEO Analyst having 10 years of experience, Help to improve website ranking and organic traffic.