...

View Full Version : Compress html and css documents to conserve bandwidth?



Andy92
01-28-2007, 10:15 AM
Hi there,

Is there any way to cut down the size of html documents and css documents, so that they have all the same code in them but they are smaller, so it can save more bandwidth from being used?

Like instead of...



body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 65%;
color: #333333;
background-color: #1F1F1F;
margin: 0px;
text-align: left;
}


Could i compress it to...



body {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 65%;color: #333333;background-color: #1F1F1F;margin: 0px;text-align: left;}


And can i do the same for html documents?

Is there any website which will compress files for you?

:thumbsup:

croatiankid
01-28-2007, 10:34 AM
Here's something that should save you a bunch: you can use just "font:" to specify all the font properties, including line-height. The scheme goes like this:

font: size/line-height weight fonts
or, for example:

font: 65%/75% bold arial, tahoma, sans-serif;
if you don't want to specify a line-height, just omit "/line-height" like
font: 65% bold arial, tahoma, sans-serif;.
you could also remove all the whitespace (most css files don't need them, unless you use some certain rules like content:after), but this would save you very very very little space. you can also, in the example above, use just "background:" instead of "background-color:".
Also, when specifying a dimension (in border, padding, margin, width...), you can use 0 as a length as well as a unit. This means instead of saying margin:0px; you can use margin:0;, since it doesn't matter what unit you use, 0 is 0.

So you should get in the habit of using shorthand CSS properties, search the net for it (something like "shorthand css file size..." w/o the quotes.)

As far as html goes: you could remove all unneccessary whitespace, omit the HTML and BODY tags (according to specifications, you can do it and still have a valid document. this is an advantage of using HTML doctypes: you can omit certain tags. for example, my site (http://www.croatiankid.com/) omits them, yet is perfectly valid HTML 4.01 Strict (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.croatiankid.com%2F).

if you have repetitive code, you could make it a variable in javascript, and then just have JS echo the variable where you need it, but I wouldn't do this since not all people have JS enabled.

If you'd give us your whole CSS we'd be happy to compress it to the max using shorthand properties.

BTW how are things at GTG? :)

_Aerospace_Eng_
01-29-2007, 03:19 AM
This site is pretty good at compressing CSS.
http://www.cdburnerxp.se/cssparse/css_optimiser.php

rmedek
01-29-2007, 03:02 PM
For what it's worth, I've found that the benefits of code readability far outweigh the few kbs saved when optimizing a file; especially since CSS is generally cached. That said I still tend to use CSS shorthand; I just don't go through all the extra trouble of stripping whitespace and formatting.

neomaximus2k
01-29-2007, 06:51 PM
For what it's worth, I've found that the benefits of code readability far outweigh the few kbs saved when optimizing a file; especially since CSS is generally cached. That said I still tend to use CSS shorthand; I just don't go through all the extra trouble of stripping whitespace and formatting.

I totally agree with this, so long as you optimise it as much as possible as in move from tables to DIV and use CSS correctly then that will be enough



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum