CODEWITHSUNDEEP
css
Abijeet Patro
Abijeet Patro

Reputation: 2884

How much CSS is too much CSS?

I'm currently developing a professional website and I have reached around 750 lines of CSS for around 4 pages, the bulk going into the homepage. I have curly braces in separate lines. I could probably reduce it a bit by going through it again.

But I was just wondering, what would you consider as being too much css?

Regards,

Upvotes: 11

Views: 15078

Answers (5)

Scott Silvi
Scott Silvi

Reputation: 3109

A gotcha on this (not directly related to the OP, but for others who might come here) ...

IE9 and below only recognizes the first 4096 selectors in a CSS file. Everything after that is merely silently ignored.

Upvotes: 7

Chris
Chris

Reputation: 26878

Assuming your home page doesn't have tens of nested components that have different roles/looks, you're probably being a bit non-clever with your CSS. There are two things to worry about here:

  • Bandwidth: If your CSS file's size is more than 50KBs or so, some of your clients with low connection speeds/bandwidth might experience some notable lag.

  • Rendering: It's possible that your CSS file is complex enough to force the client's layout/rendering engine to make some extra effort while rendering.

Both the issues would reduce your website time-efficiency. What to do?

The simplest example on how to optimize your CSS file is to collect rules that you use for many elements in one class. There are many other tips to help reduce the size of your CSS file; the other answers already link you to some articles with helpful tips, but if you want to give programs that automate the process a try, take a look at CSS Tidy (and an online tool based on CSS Tidy).

I hope that helped!

Upvotes: 4

SMacFadyen
SMacFadyen

Reputation: 3165

How large is your CSS File? Sure, you have to worry about hard the browser has to work in terms on load when interpreting the CSS.. is it efficient, are you over working it?

Keep your size as low as possible is a given, but there are quite a few factors to think about. You can always minify, gzip compression when your done to save some time. Take a look at a testing tool http://tools.pingdom.com/

There's plenty of articles on this so I won't bother reeling off my personal opinion, so check these out

  1. http://css-tricks.com/efficiently-rendering-css/

  2. https://developer.mozilla.org/en-US/docs/CSS/Writing_Efficient_CSS?redirectlocale=en-US&redirectslug=Writing_Efficient_CSS

  3. http://speckyboy.com/2011/03/08/website-speed-part-1-write-more-efficient-css/

Upvotes: 4

Rorok_89
Rorok_89

Reputation: 375

It depends on what is your website supposed to do. If it is a small blog and you need, say, 3000 lines of CSS, that is probably too much. If it is an online store with multiple sections and a complicated layout, it might not be enough. It depends on your needs.

Upvotes: 3

Simone
Simone

Reputation: 21262

I think there isn't a limit at all. Just write the code you need, and when you've finished try to optimize it.

Upvotes: 7

Related Questions