A website needs to be fast loading and responsive. As we are now in the technology world where audience likes speed. Even minor mistakes interrupt the audience satisfaction and they may leave your blog page shortly.

However many pros already published their point of view and also showed how big companies manage their website. So, small publishers can do this work too by using little methods.

Not everywhere fast internet speed exists. There are many reasons to consider web page speed. When a visitor has fast experience with your website then their changes are more to come back again.

What if 30% of the audience have a slow internet connection and we have already installed silly scripts codes, then it might not open at a specific time. Few visitors would be disappointed. We can not fix external things but can change things that are in our control.

It is difficult for some webmasters to know all the tactics that help boost website speed. Although, it may be a "Search engine optimization" factor?


Google also launched one of its product, in which webmasters can easily analyze insights of a blog page. High scores mean webpage is optimized efficiently and lower score represents there is work to be done.

To check the performance of any site, visit Google's page speed insights. This will not only show score and insights but it also suggests what type of work should be done for proper optimizations.

There are hundreds of factor affecting page load speed. Frustrating to explore it one by one using own experience. But today, there are qualified services available to work for you for free.

WordPress self-hosting and Google's blogger is a different blogging platform. In WordPress, this work can be easily done by using plugins. But for blogger platform and other small blogs professional insight is required.

Here are some steps, that may help you to increase website load speed.



Remove Unnecessary Widgets


The first step towards building a fast website, making it faster by finding out unnecessary widgets that take extra time to load a webpage.

Look into the template file and search for additional scripts and widgets. If not necessary, remove it.

You can do this work manually by editing the XML/theme file. But for beginners, it is a very difficult task. Without proper knowledge of coding and HTML, it is actually hard to find out scripts.



For Google blogger.

Go to blogger > Open layout > Look for the installed widget.

Blogger-layout

Select widgets and other types of Javascript codes that are not required. Few custom themes come with unnecessary widgets, find them.

Remove any third party HTML code or more installed widgets that you don't want the show to your visitors.

Sometimes we ignore pre-installed widgets in the template and large HTML/CSS files, it takes more time to load blog contents and may degrade overall page speed.




Image Optimization


The next thing to keep in mind, "Image Optimization". This is a great way to boost website speed. As because of large/full-sized image, it takes more time to fully load contents and may consume more internet data.

To check whether your image is well optimized or not, know image file size and quality. Image with good quality is ok but full HD images and unnecessary large-sized files may be time-consuming and important image instructions do not appear in time.

Try uploading the medium-sized image (from 50 kb to 800 Kb is enough). It will quickly appear simultaneously with contents. Otherwise, you can use image compressing software or online tools. (Find on Google search)


If you find out image size is too large or having images size in megabytes. You can compress images before adding to post.

By this simple method, improve page speed. whenever a visitor comes to a blog if it is optimized image it just takes few kilobytes to load in the browser and appear faster in comparison to a normal file.


Choosing the right Image file is the best practice for proper optimization of webpages. To learn more, try Google page insight free tool.



Use Async or Defer Attribute


Async attribute is used for loading widgets, ads scripts, additional JavaScript after the page contents. By using this little code, It controls scripts/widgets execution and other stuff to load with contents.

Note that, defer attribute will execute the script after Full HTML parsed by the browser. So, if you want to show a particular script widget after the whole body loaded then use defer attribute.

Modern browsers may only support both async and defer function.

Visitors might see blog page content quickly for what they are searching and after contents, Ads/HTML appear. These attribute tells a browser to load blog/website contents first then the whole scripts.

Without asynchronously or defer attribute, you may find that whenever someone visits a web page they have to wait for contents simultaneously with ads and large files.

The best practice for optimization is to use async tag whenever possible.

Even Adsense also provides advertising codes with async attribute.

How to add an async attribute in HTML/script code.

Want to apply an async tag in your HTML/widget code, here it is.

Example

Just Add async/defer within script code. Most of the time, Javascript require this type of function.


Red arrow showing async for html code / Adsense code/ widgets.

 Make blog faster using Async attribute



Minify CSS and Scripts


Minifying refers to remove unnecessary characters and file from the script. Even CSS can be minified and the result may surprise you because that minified code will help speeding web pages.

The browser will execute the minified file similar to the original file but it requires fewer kilobytes.

Minified CSS actually remove some characters and compress the code efficiently. It is recommended to use the minified version instead of the original file. It will work the same as the original code.


You can use online tools like - JavaScript minifier

To minify CSS - Gift of Speed

Before and after Minifying.

Minify CSS for Speed Optimization

CSS and scripts can be easily modified with the above tools, remember it is not a lengthy process. It just requires the CSS code of resources.


Use Cloudflare Speed Optimization features


With an increase in new technology and automated systems, you can use it to speed up your blog, here is how.

This method is actually an alternative to manually minifying CSS.

This way is very helpful if you don't have technical knowledge about HTML, CSS or javascript.

I am talking about a few Cloudflare features, first of all, I am going to describe about rocket loader and auto minify.

Both tools can easily speed up a website by optimizing the source code. Usually, source code is consists of HTML, CSS, and javascript, some modern sites have high-level programming languages.

These two features are free to use and most of the digital publishers can enjoy it.

If you are using Cloudflare then you will need to turn on, these are available under the speed section.

Cloudflare > Speed > Optimization > select auto minify / turn on rocket loader.

See below images :-

Cloudflare auto minify css html and javascript

Rocket loader
Turn on



Note - Sometimes, by using rocket loader, websites get broken. If that happens, turn off this feature. Additionally,  If you feel that the website is broken, simply turn off both the tools.

Never used Cloudflare before. You can easily register by going to the official website of Cloudflare. Modifications in domain nameservers are important to use Cloudflare. You can find installation steps on their official webpage.

Watch the official video to learn more about speed optimization by cloudflare.


There a lot of other optimization tools to speed up a site, but it comes with paid plans.

Thanks for reading this article, you can suggest your own methods and improved ways to optimize website speed in the comment section.

Post a Comment

Tell us more about your experience.

Previous Post Next Post