Let’s throw in some numbers first:
- One second delay in page load time can cost a webpage 11 per cent of views. (Source: HubSpot)
- 53 per cent of people will leave a mobile page if it takes longer than 3 seconds to load. (Source: Google)
There are countless such facts and statistics that underline just how important it is to have a fast website.
In fact, post-2018 Google Speed Update, if your website loads slowly, Google will rank it lower on SERP.
Meaning: you need a jet-quick website. Period.
Now, as simple as it may sound, it is easier said than done. At least for those who use Blogger (BlogSpot).
Table of Contents
The Blogger vs. WordPress Battle
Yes, Blogger is better than WordPress on many fronts. But even the biggest fans cannot argue that the CMS, from Google, has some evident drawbacks.
One is, you cannot install a third-party plugin on it and let it magically speed up your website, as is the case with WordPress.
Also Read: List Of Powerful WordPress SEO Plugins For 2018
With Blogger, it’s all DIY, which is quite a pain for those who lag in HTML, CSS, and JavaScript. But that’s an entirely different topic altogether.
Here, I am talking about Blogger. And website speed.
While inbuilt templates of Blogger are pretty lightweight that load fast, the problem comes with the third-party downloads.
You install a new Blogger template by getting swayed with its look— only to realize later that its speed totally sucks.
Your Blogger website is too damn slow. What do you do now? Or a handier question is…
Read More:
- Free & Paid Platform To Launch Your First Blog In 2018
How To Speed Up Your Blogger Website/Blog?
There are many strings you can pull to optimize your website and boost its speed by twice as much.
HOW?
Shoot your Blogger’s dashboard and follow these 5 steps:
(BUT hold on! First, go to Google’s PageSpeed Insight and analyze your website, as to where it stands now. After you’re done implementing these steps, you can re-analyze the website to measure the evident increase in its loading time.)
Note: Before doing any of these, ensure you have a backup of your existing template/design.
Reduce The Images Size
Large image files are the biggest killer of website’s speed, increasing the total page size significantly. So, the first step here is addressing this elephant in the room.

The smaller the image size, the better it is. But to give a general idea to measure the result with, you must aim to keep per image less than 30KB.
Thankfully, reducing the size of images are fairly simple and straightforward.
First, only use those images that are
small in size. Avoid the high definition (HD) ones.
Second, resize the image to adequately fit it in your post in its original length and breadth.
Third, compress them using Tiny JPG. If the image still looks large in KB, re-compress it using Compress JPG.
Tips:
- Don’t edit the image, like increasing its brightness and contrast. It will increase its total size.
- Expect the images to be a bit blurry. Relax. Unless your website is image-centric, this shouldn’t be much of an issue.
Just reducing the images’ size on your website will immediately boost its speed.
Yes, really! After implementing this step, go to Google PageSpeed Insight. You will see the difference yourself.
Get Rid Of CSS And JS Bundles
Blogger comes with pre-existing CSS and JavaScript bundles irrespective of the template you’re using. They look like…
https://www.blogger.com/static/v1/widgets/3841957138-widget_css_bundle.css
https://www.blogger.com/static/v1/widgets/3401484092-widgets.js
These codes are entirely unwanted if you’re using a custom template. So, with no purpose, they need to be get rid of.
However, since default and in the Blogger’s backend system, you cannot delete these bundled codes. So, to overrule them, you need to make some changes in your code.
Here we go…
(I) Click on the ‘Theme’ section of your Blogger’s dashboard and then go on to ‘Edit HTML’.
(II) (A) This step will remove the bundled CSS
In the code section, pop a search box using “CTRL + F”. And then type to find <b:skin> and </b:skin>.
Cut all the codes you see between these skin headers. Now again use “CTRL + F” command keys to find </style>.
Paste all the codes you have cut from inside the skin tag right above the </style> tag.
Now, “CTRL + F” to find </head>. Paste the following code right above this head tag…
<style type="text/css&quo
t;>
<!– /*
<b:skin><![CDATA[*/]]></b:skin>
(B) This step will remove the bundled JavaScript.
“CTRL + F” to find </body>. Delete </body> and replace it with…
<!–</body>
–> </body>
THAT’S IT. You have successfully removed the unwanted, render-blocking CSS and JavaScript codes from your website. Kudos!
Slow Loading Fonts And jQuery

If you have installed a third-party Blogger template, you’re likely using a custom font. These custom fonts render block a website, slowing its loading speed by a large margin.
The good thing is even this problem has an easy fix.
Use Google PageSpeed Insight to find out about the render-blocking elements on your website.
(If you have purchased or downloaded the template from the likes of Sora Templates and Gooyaabitemplates, you will find Google Font, Font Awesome and jQuery playing culprits here.)
Remove these Render Blocking items from your website one-by-one. Delete them!!!
Now, “CTRL F” to find </head>. Copy the following code and paste it directly above the closing head tag…
<script type=’text/javascript’>
(function() { var ad = document.createElement(‘script’); ad.type = ‘text/javascript’; ad.async = true; ad.src = ‘//ajax.Googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js’; var sc = document.getElementsByTagName(‘script’)[0]; sc.parentNode.insertBefore(ad, sc); })();
//<![CDATA[
//CSS Ready
function loadCSS(e, t, n) { “use strict”; var i = window.document.createElement(“link”); var o = t || window.document.getElementsByTagName(“script”)[0]; i.rel = “stylesheet”; i.href = e; i.media = “only x”; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || “all” }) }
loadCSS(“//fonts.googleapis.com/css?family=Open+Sans|PT+Sans+Narrow”);loadCSS(“https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css”);
//]]>
</script>
In the above code, change the ones in red with your own render-blocking Google Font and Font-Awesome links.
Once done, save the template. And voila, you’re done with this problem.
Remove ‘Quick Edit’ Icons
Small these icons may look, they eat a great deal of space. So, even if you find them handy, it’s best to get rid of them. It’s fairly simple.
“CTRL + F” to find…
<b:include name=’quickedit’/>
<b:include data=’post’ name=’postQuickEdit’/>
And DELETE all the instance of these codes you come across.
Note: Every time you add a widget, that widget would come with this ‘Quick Edit’ option. So, remember to repeat the above process of deleting the code after you’ve added a widget on your website.
Async Parsing JavaScript
To add to the functionalities of your Blogger, you would need to add third-party codes.
For instance, if you want the Sharing widget, you would have to add ‘AddThis’ JavaScript code in your website. Or, if you want a commenting system, you will have to add the codes of Disqus in the backend of the website.
Now, these extra lines of codes are of high-utility. So, even when they slow down your website, you wouldn’t want to delete them!
In such case, you can use the asynchronous directive, which looks like async=“async”.
When your website loads, different elements load simultaneously or very subsequently in their proper order. What ‘async’ code does is it tells the browser to load every other element first and then, at the very end, trigger the JavaScript that the ‘async’ command is used for.
It simply is the opposite of ‘Sync’, meaning it shouldn’t load in sync with other elements. It must wait for others to load first and then parse.
You can use this directive on all your external JavaScript to ensure your HTML loads first.
Your external JavaScript would usually look like…
<script src=“code” type=’text/javascript’></script>
All you have to do is add async=’async’ in this single line like this:
<script async=’async’ src=“code” type=’text/javascript’></script>
This line will ensure all the important components of your website loads first and only then these JavaScript parses.
CONCLUSION
These are 5 very simple steps that you can pull to seamlessly boost the loading time of your website in as less as 15 minutes.
After you’re done, go back to Google’s PageSpeed Insight and see how well-optimized your website is now.
If the website still lags, follow the recommendations you see on PageSpeed Insight. Remember though, you cannot ‘Leverage Browser Caching’ as the optimization suggestion would return.

So, aside from this, follow the rest of the recommendations the report offers.
Today, having a jet-fast website is essential. There’s no two-way to it. So, even if the process demands more of your effort and time, it’s imperative that you give that.
Now go ahead, follow the above mentioned 5 steps and see the result. If you encounter any problem, mention in the comment section below.
Also Read: How Using Lazy Load Can Make Your WordPress Website Load Fast?

i have listen blogger website is not getting ranked in google…?? is that true
It’s not true, I have seen many blogger blogs which are ranking on 1st page. Ranking is totally depends on compition in your niche and how well your Site’s SEO is…
I have hosted javascript external, but it’s not speeding up my site. Huge page size came from mostly on javascript. That’s why I removed them internally and place external by uploading to some server. What should I do do this?
Hie, Mark.
I am not a developer. But I believe hosting script externally is a bad move. It will slow down the website. Because now, to load it, several trips would have to be made to different domains. To that, it might also very well be that the script library itself is bad and creating troubles.
Hope this helps! 🙂
Thanks great for guide
Glad you liked it, Hienle.
Thank you very much for sharing such information with us.
Thanks for shared. i think can problem load image size large
👍👍👍
good info for blog speed increase
<style type="text/css&quo
t;>
<!– /*
This code not working
I failed dealing with CSS
<style type="text/css"><!– /*
use this.
Thanks for sharing, your post has helped me discover ways to speed up my blogspot site.
Glad to know, you liked it…
very very helpful content. Thanks for sharing.
Very useful information thanku
(II) (A) This step will remove the bundled CSS – Giving error on copy pasting
In the above code, change the ones in red with your own render-blocking Google Font and Font-Awesome links.- What is there in Red? What to replace please explain.
It’s good
Very good
<!– /*
Not working
Good yeah.. 👍
i need to lazty loade font-awesome url in blooger
Thank u Asif ! Amazing information dear!
Thanks for your instructions.
it is very useful for page speed. Beginners will found it useful.
nice article bro..It works but only 10-15% it has increased in my site.infact, ok.keep doing the great work
Thanks for sharing your instructions.
it is very useful for page speed.
Working thanks
sir if i do above steps then it don’t affect on my websites another pages
No, It won’t affect your blog and other pages. But make sure to take a backup before following this process.
Lazy load blogger with image can resoved?
Thank you sir, I have visited many websites, just to see how to increase the blogspot speed and finally I found the best one.
Glad to hear that…
Thanks bro . I applied your java script trick and its working.
Thank you very much for sharing this. Found your answer on quora and came here, it was worth the time. Is there any way that qill help me to reduce image size without reducing the quality greatly?
Use any image compressing tool there are a lot of tools that can reduce the size without affecting the quality of the image.
awesome article keep rocking……….
In your mentioned methods, I have used my website, due to which the speed of my website has increased a bit.
Thank you very much for sharing such information with us.
Thank you very much for sharing such information with us.
nice article bro..It works but only 10-15% it has increased in my site.infact, ok.keep doing the great work
good info for blog speed increase
Thank you very much, my site is now loading
Superb very useful information. Thanks for sharing ….
Best Seo Tip thanks alot
Thanks for important information I was just looking for it
Not all points worked for me… only 1st is working in my case.