A fast loading website is a good website. In terms of both SEO and user experience. Google PR algorithm take into consideration time spent in downloading a page. Also, the bounce rate, that is, how many users left your blog as soon as they visited, without navigating to another article on your blog.
When, page takes time to load user leave your page. Increasing bounce rate.
After minifying JS it almost becomes unreadable. Still you don't have to worry about it, because you don't need to read them at all.
NOTE- Online JS Minifier(s) won't compress all of your JS or jQuery codes. Because Blogger replaces some special characters like " into equivalent HTML entity or codes like " which would throw errors like -
Google Webmaster tools lets you see the time spent downloading a page. Because you are on Blogger platform, so you will get the webmaster data without even verifying you blog.
When, page takes time to load user leave your page. Increasing bounce rate.
Minify JS and CSS in Blogger
Minified JS is must. In blogger platform, you have to play with codes to tweak your template's/theme's looks. But even in that case, you'll find yourself playing with HTML and CSS not with JavaScript.After minifying JS it almost becomes unreadable. Still you don't have to worry about it, because you don't need to read them at all.
NOTE- Online JS Minifier(s) won't compress all of your JS or jQuery codes. Because Blogger replaces some special characters like " into equivalent HTML entity or codes like " which would throw errors like -
Unexpected operator &
If you are non-technical publisher then, all JavaScript are placed in-between script HTML tags.
<script type='text/javascript'>
//<![CDATA[
YOUR JS Codes are placed here
//]]>
</script>
So, now you know where your JS codes are.//<![CDATA[
YOUR JS Codes are placed here
//]]>
</script>
- Cut all the codes in-between //<![CDATA[ and //]]>.
- Use any online JS minifier to generate minified code.
- Copy minified code and paste it from where you took those codes (in-between //<![CDATA[ and //]]>).
How to know if it is jQuery?
By the time you will minify some JS codes, you will realize that there are no $ signs in simple JavaScript code. In jQuery, the $ if the short hand of jQuery function used to select different tags and attributes from DOM or Document Object Model.
Also, some special characters are converted into equivalent HTML entities, like " sign will be converted into " that's why the online minify tool will show an error.
Normally, I won't do that or else it will become very hard to tweak CSS. Other way round, is to copy your CSS into any file. If, you are not planning to tweak any style codes then feel free to minify CSS.
Optimizing CSS
Similarly, CSS you can aslo minify CSS. There are a number of online tools available. CSS is placed in <style> and </style> tags. But remember when doing so, don't kill the sequence in which they appear.Normally, I won't do that or else it will become very hard to tweak CSS. Other way round, is to copy your CSS into any file. If, you are not planning to tweak any style codes then feel free to minify CSS.
Optimizing Images in Blogger
Having low size images would help your blog load faster. But reducing the size of images all way down will kill the quality of the image. So, first crop the image and then work on quality reduction. Sometimes, the crop will reduce enough size.
- One simple way out is by keeping only required part of the image. See how I reduced image of width 981px to 622px. So, reduce image size without loosing quality.
How to know time spent during downloading a page?
time spent in downloading a page |
Google Webmaster tools lets you see the time spent downloading a page. Because you are on Blogger platform, so you will get the webmaster data without even verifying you blog.