Best practices; one huge stylesheet or multiple smaller ones

**Matt** · Jul 20 '05, 11:24 PM

Re: Best practices; one huge stylesheet or multiple smaller ones

Laiverd.COM wrote:
[color=blue]
> Currently working on a site that requires multiple different styles for all
> kind of things (tables, link colors etc.) and am suddenly ;-) wondering what
> would be the wise approach: have all these different styles in one huge
> stylesheet, or separate into smaller css files and include only those that
> are necessary. Target audience alos includes dialup visitors. Would anyone
> be willing to share his/her opinion on this? Looking for the pro's and cons
> of either approach.[/color]

Assuming several small files, with only the necessary files LINKed into
the HTML page:

* Easier to maintain because they're all seperate
* Harder to maintain because you can get conflicts between files

* Slower to download several small stylesheets (lots of connections)
* Not wasting time downloading unnecessary rules

I chose to use one large stylesheet. Then, I used Gzip compression on it.
The uncompressed stylesheet is 10046B, the compressed one 2561B. Most
browsers get the compressed one.

--
Matt

-----= Posted via Newsfeeds.Com, Uncensored Usenet News =-----
http://www.newsfeeds.com - The #1 Newsgroup Service in the World!
-----== Over 100,000 Newsgroups - 19 Different Servers! =-----

**Sam Hughes** · Jul 20 '05, 11:24 PM

Re: Best practices; one huge stylesheet or multiple smaller ones

"Laiverd.CO M" <share_your_kno wledge@someserv er.com> wrote in
news:410cff75$0 $62352$5fc3050@ dreader2.news.t iscali.nl:
[color=blue]
> Currently working on a site that requires multiple different styles
> for all kind of things (tables, link colors etc.) and am suddenly ;-)
> wondering what would be the wise approach: have all these different
> styles in one huge stylesheet, or separate into smaller css files and
> include only those that are necessary. Target audience alos includes
> dialup visitors. Would anyone be willing to share his/her opinion on
> this? Looking for the pro's and cons of either approach.[/color]

If your site's main page would only need a few of the files when split up,
then yes, go for it.

You might want also to look into ways to make the CSS file more efficient,
and less verbose. Try to remove any redundancies.

How many bytes could you save simply by removing superfluous whitespace?
By removing all line returns, all unneeded spaces, and all semicolons that
occur before a right curly bracket, I reduced my css document's filesize
from 1620 to 1314. That's a savings of 19%!

**Stan Brown** · Jul 20 '05, 11:24 PM

Re: Best practices; one huge stylesheet or multiple smaller ones

"Sam Hughes" <hughes@rpi.edu > wrote in
comp.infosystem s.www.authoring.stylesheets:[color=blue]
>How many bytes could you save simply by removing superfluous whitespace?
>By removing all line returns, all unneeded spaces, and all semicolons that
>occur before a right curly bracket, I reduced my css document's filesize
>from 1620 to 1314. That's a savings of 19%![/color]

Maybe, maybe not. IMHO what matters is download speed, and I'll bet
the cycle of HTTP request and serving up the content has enough
"fixed cost" that your 306-byte "variable cost" is no more than
statistical noise.

While I agree with you about removing _extra_ white space, CSS is
source code and as such needs some white space to be readable (and
therefore maintainable).

--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA

http://OakRoadSystems.com/

HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/

**Sam Hughes** · Jul 20 '05, 11:24 PM

Re: Best practices; one huge stylesheet or multiple smaller ones

Stan Brown <the_stan_brown @fastmail.fm> wrote in
news:MPG.1b7801 9be869b75098c7f a@news.odyssey. net:
[color=blue]
> "Sam Hughes" <hughes@rpi.edu > wrote in
> comp.infosystem s.www.authoring.stylesheets:[color=green]
>>How many bytes could you save simply by removing superfluous
>>whitespace? By removing all line returns, all unneeded spaces, and
>>all semicolons that occur before a right curly bracket, I reduced my
>>css document's filesize from 1620 to 1314. That's a savings of 19%![/color]
>
> Maybe, maybe not. IMHO what matters is download speed, and I'll bet
> the cycle of HTTP request and serving up the content has enough
> "fixed cost" that your 306-byte "variable cost" is no more than
> statistical noise.[/color]

Yes but when the same is done with a 10-kilobyte file, the savings are a
little over six times as substantial, but possibly more or less,
depending on how the OP spaces his CSS. The point is that _in_general_,
manically slashing and burning whitespace in a CSS document can
substantially lower file size.
[color=blue]
> While I agree with you about removing _extra_ white space, CSS is
> source code and as such needs some white space to be readable (and
> therefore maintainable).[/color]

It is possible to "compact" the CSS file and save it as a different name
before uploading it to the web server, keeping a perfectly readable copy
around for changes. And compaction could be automated.

Personally, I don't do it, because it's not worth it for me, and I don't
like serving inelegance.

--
Accessible web designs go easily unnoticed;
the others are remembered and avoided forever.

**Stephen Poley** · Jul 20 '05, 11:25 PM

Re: Best practices; one huge stylesheet or multiple smaller ones

On 2 Aug 2004 21:27:09 GMT, Sam Hughes <hughes@rpi.edu > wrote:
[color=blue]
>Stan Brown <the_stan_brown @fastmail.fm> wrote in
>news:MPG.1b780 19be869b75098c7 fa@news.odyssey .net:
>[color=green]
>> "Sam Hughes" <hughes@rpi.edu > wrote in
>> comp.infosystem s.www.authoring.stylesheets:[color=darkred]
>>>How many bytes could you save simply by removing superfluous
>>>whitespace ? By removing all line returns, all unneeded spaces, and
>>>all semicolons that occur before a right curly bracket, I reduced my
>>>css document's filesize from 1620 to 1314. That's a savings of 19%![/color]
>>
>> Maybe, maybe not. IMHO what matters is download speed, and I'll bet
>> the cycle of HTTP request and serving up the content has enough
>> "fixed cost" that your 306-byte "variable cost" is no more than
>> statistical noise.[/color]
>
>Yes but when the same is done with a 10-kilobyte file, the savings are a
>little over six times as substantial, but possibly more or less,
>depending on how the OP spaces his CSS. The point is that _in_general_,
>manically slashing and burning whitespace in a CSS document can
>substantiall y lower file size.[/color]

With disk sizes as they are now, you'd probably have to save hundreds of
kilobytes to make it worth saving on file size. What I presume you are
thinking of is saving on transmission time. AIUI most server/browser
combinations nowadays support gzip data compression. And large numbers
of consecutive space characters happen to form an ideal target for data
compression. So "manically slashing and burning whitespace" is probably
a complete waste of time.

--
Stephen Poley

404 Not Found

http://www.xs4all.nl/~sbpoley/webmatters/

Best practices; one huge stylesheet or multiple smaller ones

Best practices; one huge stylesheet or multiple smaller ones

Comment

Comment

Comment

Comment

Comment