A recent client who was HubSpot hosted had an abysmal page speed and was, therefore, losing out on SEO. I optimized the website to increase its loading speed and also I did some optimization to increase page speed in HubSpot COS. So there are a few tips that I can offer to those wishing to soup up their page speed.
Read on for those! WHAT IS PAGE SPEED? Page speed is defined as the time taken for a page to load and fully show the content on a separate page.
These are the tips for increasing page speed:
- Minify Resources
- Optimise images
- Reduce redirects and requests
- Put CSS at the top and JS at the bottom
- Use CSS Sprites
1. Minify Resources (HTML, JS, CSS)
Minify is a programming term that removes any unnecessary characters that are not required for the code to execute. Minifying your code speeds up your page loading. Minifying your code removes:
- Whitespace characters
- New line characters
- Comments
- Block delimiters
2. Optimise images
High-resolution images increase the size of the page and the page size is the main contributing factor for page speed. If we want to increase the speed of the page then we have to work on the size of the page, which we can do by reducing the size of images, doing so will decrease the load time of the page.
3. Reduce redirects and requests
URLs should not be redirected and requested because this page increases load time. To avoid putting redirection and to reduce the requests, we will have to use lesser images, links, CSS classes and JavaScript. All this will reduce the request on the page so that the page will load faster.
4. Put CSS at the top and JS at the bottom
If you are a HubSpot user, then you should know that the page created by HubSpot COS, which is linked to the page and all the CSS code should be inserted into the CSS stylesheet, by doing this the file is loaded before the page is opened. We use JavaScript for any animation on the page, which increases loading time. To improve the page's load time we should put JavaScript at the end of the page.
5. Use CSS Sprites
CSS sprinting is one of the best ways to reduce the page's request. If we are using a lot of images on any page, then we should make it in the one image in .png format, from which the page will be requested once for the image. To do spriting we have given a class of removing the image and an image by CSS spriting that class. For CSS sprite Code we used http://www.spritecow.com/
"After trying doing all this, our client's loading time has decreased by 50%!"
If these tips were helpful or you have a few more to offer, please comment down below!
If you want to increase your HubSpot COS Website's speed today, You can reach us out for the COS Fast service provided by us.
