Re: [WSG] Ways to minimise CSS file
I guess I used couple of IDs for layout of background graphics. The header section has the most. I could however use lesser image slices and that would require lesser CSS id but that also means that the image per slice would be bigger. A question here but not sure if it is off topic..what is the per image size that you would not exceed for backgrounds? With Regards, Jaime Wong ~~~ SODesires Design Team http://www.sodesires.com ~~~ ---Original Message--- From: [EMAIL PROTECTED] Date: 4/03/2004 12:17:56 PM To: [EMAIL PROTECTED] Subject: Re: [WSG] Ways to minimise CSS file JW wrote: enough hmm) but somehow still not very please with the overall file size. I heard about using php but just not very sure about the details. maybe some of you might know? PHP is a server side (well, mostly) programming language. Normally used to create HTML markup, but it can be used to create CSS or generate images on demand. Well planned and written CSS is a better solution than using PHP to send the user dynamically generated stylesheet(s) based on the page they are viewing. It means less CPU load on the server. An exception may be if you have several themese and a theme switcher, but even then, Javascript can do that for you without having to learn a new language (although for me, Javascript would be the new language I'd have to learn *grin*). -- /--\ |Adam Carmichael, A+, 2xMCP (Windows 2000), Cert IV Helpdesk Admin | |[EMAIL PROTECTED] /( _,-,_ )\ _| |_ /,|| | |#1 Computer Services \`/ \'/ _| |_ || | |BSD/UNIX Cisco Network Engineer\ /,\ /,\ / | | _||_ | \--/ * The discussion list for http://webstandardsgroup.org/ * * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Ways to minimise CSS file
Jaime,
x-tad-biggerI have been thinking if there are any ways to minimise CSS files as my css files are growing bigger and bigger.There are so many different ways to write the CSS codes but which way is the most efficient way so to save space but still looks neat./x-tad-bigger
x-tad-bigger /x-tad-bigger
x-tad-biggerI haven't been able to find a writeup on this in the net. Anyone has any suggestion?
/x-tad-bigger
I guess its a matter of taste.
Because whitespace is in essence ignored, you can add formatting as you please.
A couple of very common formats are
p {
color: red;
font-size: 1em;
}
p {
color: red;
font-size: 1em;
}
p {color: red;
font-size: 1em;}
I kind of like the properties on separate lines, and even tabbing them in to make them more obvious
Now, at the risk of sounding promotional, Style Master, which I am one of the developers of (by the way, it is Australian, for what it's worth, don't let the .com address fool you :-) has a Format Style Sheet feature.
You simply format a dummy rule in the options/preferences window, then you can apply this to any style sheet. Style aster will automatically format your style sheets as you go, when you use its editors.
BTW, we've just upgraded Style Master to 3.5. It's for Mac and Windows, and you can get more information here.
http://www.westciv.com/style_master/
And even though my partner at westciv, Maxine, will kill me (don't tell her ok) for WSG members here is a little special offer.
Get Style Master for US$49.99 instead of $59.99, but only here
https://order.kagi.com/cgi-bin/store.cgi?storeID=WC3
and only for a limited time (until Maxine finds out :-)
thanks,
john
John Allsopp
:: westciv ::
software, courses, resources for a standards based web
style master blog http://westciv.typepad.com/dog_or_higher/
http://www.westciv.com/
Re: [WSG] Ways to minimise CSS file
Jaime - Moving to descendant selectors really helped me minimise the amount of classes and ids I ended up using - which saves line space. You could also divide your stylesheet up into different files - one for navigation, one for layout, one for headings etc etc - then link (or however you do it) them all in. Cheers James BTW, is it possible for you to remove that blinking Incredimail icon from your emails (or send them as plain text - not html)? it's very difficult to read your posts with that going off in the corner. I think it breaks the 2hz to 55hz rule :D JW wrote: I have been thinking if there are any ways to minimise CSS files as my css files are growing bigger and bigger.There are so many different ways to write the CSS codes but which way is the most efficient way so to save space but still looks neat. I haven't been able to find a writeup on this in the net. Anyone has any suggestion? With Regards, /Jaime Wong/ ~~~ *SODesires Design Team* http://www.sodesires.com http://www.sodesires.com/ ~~~ http://www.incredimail.com/redir.asp?ad_id=309lang=9 /IncrediMail/ - *Email has finally evolved* - * Click Here * http://www.incredimail.com/redir.asp?ad_id=309lang=9 * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Ways to minimise CSS file
James Ellis said: You could also divide your stylesheet up into different files - one for navigation, one for layout, one for headings etc etc - then link (or however you do it) them all in. I would have thought that from a general performance perspective, splitting the CSS into too many files would be a bad idea, since each one is going to require an extra HTTP Request/Response to download. That extra traffic will cost you bytes (and time), so if you need all that CSS on the page, you may as well have it all in one file. I normally only use separate files where I have a unique set of definitions for an area of my site. i.e. all files have general.css print.css, some areas also include blog.css (guess which ones :) Just a thought. Beau -- Beau Lebens Information Architect [EMAIL PROTECTED] Dented Reality - www.dentedreality.com.au Information Architecture, Usability, Web Development * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Ways to minimise CSS file
JW wrote: enough hmm) but somehow still not very please with the overall file size. I heard about using php but just not very sure about the details. maybe some of you might know? PHP is a server side (well, mostly) programming language. Normally used to create HTML markup, but it can be used to create CSS or generate images on demand. Well planned and written CSS is a better solution than using PHP to send the user dynamically generated stylesheet(s) based on the page they are viewing. It means less CPU load on the server. An exception may be if you have several themese and a theme switcher, but even then, Javascript can do that for you without having to learn a new language (although for me, Javascript would be the new language I'd have to learn *grin*). -- /--\ |Adam Carmichael, A+, 2xMCP (Windows 2000), Cert IV Helpdesk Admin | |[EMAIL PROTECTED] /( _,-,_ )\ _| |_ /,|| | |#1 Computer Services \`/ \'/ _| |_|| | |BSD/UNIX Cisco Network Engineer\ /,\ /,\ /| |_||_ | \--/ * The discussion list for http://webstandardsgroup.org/ *
Re: [WSG] Ways to minimise CSS file
On Thursday, March 4, 2004, at 02:53 PM, Adam Carmichael wrote: Beau wrote: James Ellis said: You could also divide your stylesheet up into different files - one for navigation, one for layout, one for headings etc etc - then link (or however you do it) them all in. I would have thought that from a general performance perspective, splitting the CSS into too many files would be a bad idea, since each one is going to require an extra HTTP Request/Response to download. That extra traffic will cost you bytes (and time), so if you need all that CSS on the page, you may as well have it all in one file. A few hundred bytes at the _very_ most. Considering that most of the time you won't be loading blog.css, screenreader.css, projector.css, print.css and whatever else, you will be saving that transfer time and data easily. In a world of 56K modems even, 300 bytes (let's say you're sending a LOT of http headers [and for a stylesheet why would you?]), would still take under 0.04 seconds to transfer and in a world of broadband, that's even less. Considering that each stylesheet that you won't be loading up will probably contain more than 300 bytes, it's probably more sensible to split it up. Besides, it makes for more manageable CSS when you want to edit it. I totally agree here. However, one area I haven't looked at is how alternate style sheets (eg color/font/layout changes) are handled with there's multiple (cascading) style sheets in play. Style-sheet switching with one file (eg screen.css) is easy. But let's pretend that we've got (for screen media): - base.css (unchanging basic styles) - fonts-a.css | fonts-b.css (two options) - layout-a.css | layout-b.css (two options) - blog.css (specific CSS file for this section) How do style-switching browsers (eg opera), scripts and whatever else handle all that mess? --- Justin French http://indent.com.au * The discussion list for http://webstandardsgroup.org/ *
