How to Boost Your Blog's Loading Speed?

Nowadays, If someone want his/her blog go popular, then it is important that he must choose a SEO Friendly, Fast Loading and Good Design template. But Good Design need extra HTML, extra Graphics that make the template poor in loading speed. So today, I am here with a set of tricks that will surely help you making your template fast.

Their are multiple reasons for choosing a fast template because many sites and search engines like Alexa, Google, Moz and many others use Site's or Blog's Loading Speed to rank it. So, If you want to get higher rankings, You have to choose or make your template load faster. You can check your template's Page Speed score by going here and check your site. If your score is below 70, then you need to follow this article. Score above 70 is best. If your score is above 70, then you don't need to follow this article because you are good to go!

Also Read - Top 5 Best Free Blogger Templates For Your Blogger Blog

Here, I have mentioned three ways by which you can make your blogger template load faster. I have mentioned ways like Compressing, Putting Scripts from External Links to internal and much more. Let's Start Boosting Your Blog's Loading Speed.

1. Compressing Your Blog's Template

Yes. I found this way very helpful and now I want to share it with you. This way of compressing is not like compressing a file using zip or rar. Its about removing meaningless spaces and comments that are present on every template under */---*/. Well, there are some disadvantages of this way like, after compressing your template, your template HTML will become unreadable. So you might feel difficulty when editing your template.

I am going to show this trick by using a simple tool. Their are variety of tools are available on internet. The name of this tool is 'HTML Compressor' which automatically compress and remove meaningless things from your template. Steps are Following:

• Go to HTML Compressor Website
• In another tab, Go to Blogger Dashboard > Template > Edit HTML
• Now, Copy all your template code and paste it on the big box at HTML Compressor that you previously opened at another tab.
• You will see some options in sidebar. In the first section (Code Type), It is x/html in default. You need to change it to Blogger by clicking on it and choose Blogger.(as shown in picture)

• Click on Compress Button
• Now, Wait for few minutes and You will get your compressed code. Copy that code and then paste on you blogger template editor and click on Save Template.

What Will It Do?- Now, You might think that what will it do? So, It reduce your blogger blog's template size that reduce your blog page loading time.

2. Host all External Links on Internal

Do you know What is External Links and Internal links? External Links are links which are completely different from Your Blog's URL. Like, www.google.com is an external link for us, While, www.bloggerguiders.blogspot.com/search/label is an internal link for us. 

Now, How will it help you? Do you ever seen url in your blog's template HTML like Bellow?

<script src='http://www.blablabla.com/Anything_Can_Be_Here' type='text/JavaScript'/>

If yes, Then it might increase your blog's load time. Try opening this and copy all the code and paste it under <script> to </script>.

Like If we take an example of Smile Icons, then the code was:

<script src='http://yourjavascript.com/17719552144/emoticons.js'/>

You need to open the url under src and copy all the code from that url. Now, paste it under <script> to </script> like below:

<script>
function addSmiley(dummy)
{var d=[],i=0,def=['post-body','entry-content','comment-body'];for(i=0;i<def.length;i++)
{var content=document.getElementsByClassName(def[i]);for(var j=0;j<content.length;j++)
d.push(content[j]);}
for(i=0;i<arguments.length;i++)
{var content=document.getElementsByClassName(arguments[i]);for(var m=0;m<content.length;m++)
d.push(content[m]);}
for(var i=0;i<d.length;i++)
{d[i].innerHTML=d[i].innerHTML.replace(/\:\)/ig,"<img style='border: 0; padding:0'  src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>")
d[i].innerHTML=d[i].innerHTML.replace(/\/hihi/ig,"<img style='border: 0; padding:0' src='http://farm1.static.flickr.com/148/409434711_7c32198636_o.gif'/>")}}
function addLoadEvent(func){var oldonload=window.onload;if(typeof window.onload!='function'){window.onload=func;}else{window.onload=function(){oldonload();func();}}}
addLoadEvent(function(){addSmiley();});
</script>

Got Confused Where to Put this Script? On Head or Body?

Actually, When I got to know this trick, I was also confused that where to put this script and then I learned that If you found the script src code under <head> section, then your need to paste the script (which you copied and pasted under <Script> to </script> ) under <head> section.

3. Use Compressed Images with Alt Tags

I have also mentioned the alt tags steps in this post. Now, the new term is, Compressed Images. Do you know? What is Compressed Images or how to compress it? Actually, Compressed Images are those images that are of the size you want to place. Like If the image is 413 X 629 cm, and you want to show it small (113 X 329) then, You can compressed it and make it 113 X 329 cm because you don't want that big image. You can compress your images here.  Big Images surely increase your blog's load time, So don't forget to compress your images before posting or uploading it on your blog post.

From The Editor's Desk

Now, Its end. Do you liked my post? Just give us reward by your sharing and commenting. If you felt that I miss a way, then Kindly Comment It bellow and I will add it to my to-do list and will surely write about it in my coming posts in future. Thanks for reading and giving your time on Blogger Guiders. Have a Good Day!

Share this post