Css Explosion

Cascading style sheets are an immensely helpful tool in creating appealing designs and provide time savings during initial creation, maintenance, and enhancement.  In the past few years they’ve also become a powerful ally to client-side processing, client management systems, as well as unique identification for hierarchal functionality.  Many bleeding-edge applications of CSS leverage its abilities with scripting technologies to create interesting visual effects which lend themselves to positive user experience.  Even with the majority of web sites in operation utilizing some form of CSS to manage the look of their site while keeping their mark-up lite, and D.R.Y.ing up their code; there are many ways in which CSS can bog down your site, make layouts and styling unintuitive, and in general make it cumbersome to manage, maintain, and enhance current features.  Good, thoughtful design is the basis for a clean, well-factored CSS which is easily extendable and reusable.

D.R.Y. up Your CSS

Don’t Repeat Yourself.  Whether it is source code or CSS the same concept applies, unnecessary repetition bloats the mark-up of your site, slows response times, and makes it difficult to maintain.  Not only that but factoring out duplicate functionality will produce the same results at optimized speeds.  I cannot tell you how annoying it is to go into FireBugs® while viewing a page and see something which is consistent across the page, such as font-family, overridden by an identical value four or five times in the CSS hierarchy.  There is just no reason for it.

Everything Doesn’t Have to Be Different

Many beginning CSS developers get so excited about the vast styling functionality world to which they’ve just be introduced that they go bananas.  Every little element has specific widths, padding, text decorations, etc.  They forget that the best web sites enjoy that prestige because of their consistency.  Nobody’s brain wants to switch between serif text and Arial every other div, let alone jump around between different colors, backgrounds…all while watching blinking text follow around their cursor.  You have to ask yourself this question, does my styling add accessibility to my content for my audience – or is it a distracting detriment to the message I’m trying to convey? (By the way if you can’t answer this it is the latter).  Clean, concise, and fluid layouts are here to stay; trust me when I say to you that no one will be impressed by overloading the CSS styling of your page.

Don’t get it Twisted; CSS is Programming

Many, web developers especially, discount CSS as an after-thought; a cute schema outside the realm of true programming.  This couldn’t be farther from the truth.  The OOP concepts exemplified by CSS demand the same design review scrutiny as any other language in which you develop.  Quality design coupled with clear vision of scope can render kilobytes of fat from your overweight CSS resources and keep other developers from ripping their hair out when they try to add a menu item.  Thoughtful schemas can also lend themselves towards easily implementing various other scripting technologies such as jQuery^TM, YU^TMI, or CodeIgniter^TM.

Until part II – please let me know your thoughts.