Build Online Store! | Penguin Panda Series - New! | 4 Rules To Make Money | SEO Settings | Facebook Popup 1, 2, 3 | Mashable 1 , 2


Wednesday, June 8, 2011

Compress CSS and HTML To Speed Up Site Load Time Part 1


Pin It

imageWith new developments coming forward these days in the Web Development field, many new opportunities are now available to further optimize your page, while avoiding heavy JavaScript and difficult coding for newer people. Using Compression is one of the main ways. Let’s get onto the techniques, shall we?

 

 

 

Note:
Please save all of your files in a folder just in case you ever need to edit them. Keep all the compressed files which we will make, in a separate folder such as a publish folder.
If you have a Blogger account just download your template from the box above the editor.

CSS Compression:

Decreasing page size will ultimately reduce load time and make your webpage more SEO friendly. The first step is to compress your CSS. I would recommend keeping one copy for later editing, and one copy for compression. Go to CSS drive, and select whichever options you want for compression (I recommend Super compact, and strip all comments). After you have submitted your CSS, either put it into an embedded style sheet, or use an external style sheet, whichever you prefer.



HTML Compression

 

Lastly, we are going to compress our html. Go to Text Fixer and paste your entire html markup there. After it is compressed, you may paste it into the blogger editor, or into your webpage file. This will remove all comments, spaces etc. However, for editing purposes, I would still recommend keeping a separate copy in case you need to change your template.

Part 2

To read the remaining part of the tutorial guide kindly click the link below,

If you find any other good/better services, or have any questions or concerns, please leave a comment below! That’s it for part 1! I hope you have fun improving the load time and speed of your site or blog(s)!  :>

Anims


About the Guest Author:

Anims is freelance web designer and enjoys playing around with and learning coding in his free time. He likes to write about Web Technologies such as HTML, CSS and SEO.


If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you Subscribe to our regular Email Updates!

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »


Thanks for making this possible! Kindly Bookmark and Share it.
Technorati Digg This Stumble Facebook Twitter

6 comments:

Comment Page :
Amit M B on 2:30 PM, June 08, 2011 said... #

Good Post Anims, I would recommend external stylesheets for faster page load time because the css file will be cached in the browser and it does'nt have to download the css file again when you visit other pages,right?

Amit M B on 2:32 PM, June 08, 2011 said... #

Mohammad, I got the new blogger design yesterday and i am very dissapointed with it. It does not have the most important button, i.e edit HTML :( :(

samsexy98 on 3:04 PM, June 08, 2011 said... #

@Amit M B
Yup there is no Edit HTML. I too got it 2 days ago.

Use blogger.com instead of draft.blogger.com :)

Anims on 7:11 PM, June 08, 2011 said... #

Correct thinking Amit: It would also save space when you upload your website to your hosting service, because rather than having a copy of the CSS for every webpage, you only need one, which every webpage refers to. That is why I use external stylesheets for my pages. Even for blogger, when I had a blog, I hosted my stylesheet on Google sites.

dreamer on 1:36 AM, June 09, 2011 said... #

Hello, friends I have made a blogspot blog(http://techbirds.blogspot.com/) recently with the help of HTML code. Now I am thinking how can I speed up my blog. Your article helped me. Thanks for your nice post.

you all are invited to my blog- http://techbirds.blogspot.com/
The blog is under construction.Please give some good advice.Thanks

zyandashand on 9:27 PM, January 09, 2012 said... #

tq for the nice info..my blog become much lighter after doing all the method above..tq

Confused? Feel free to ask

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.

Note:
1. To add HTML CODE in comments then please use our HTML Encoder
2. You can always Test the tutorial on our HTML Editor
3. Please do not spam Spam comments will be deleted immediately upon our review.

Regards,
Mohammad

 

Recent Posts

Join Me On Facebook

8600+ Followers

Join The Team!

Licensed Under CC

Recent Comments

Follow Me On Twitter

2601+ Followers

My Blogger Tricks (MBT) © 2012. All Rights Reserved | Contact |