Wow, has it really been five months since I last posted here? Somehow, it’s not hard for me to believe. I’m breaking the blog silence proseletize the newest tech frippery I’ve become enamored with: Sass.
Sass is compiled CSS. It fits in with the current (kind of stupid, in my opinion) trend of taking a language or syntax that doesn’t need compilation, then adding a compilation step in order to get some syntactic sugar. Coffeescript is another example. Sass is a Ruby program that will sit in your CSS directory, scan your .scss or .sass files, then spit out .css results. With these sorts of things, you have to decide if learning new syntax will save you time later on.
I’m doing some CSS work for the first time in about a year, so figured I’d give Sass a shot, because I’m bored out of my mind, and need to do something to keep myself entertained. After working with it for about an hour, I was pretty much converted.
The main benefits I see to Sass are the nested syntax, mixins, and variables. With it, you can write CSS in a “nested” fashion, similar to how your HTML document is arranged. It makes it much easier to scan a block of Sass to see what style corresponds to what HTML element. An additional benefit is that copy/pasting large blocks of CSS is now possible, without having to remove or change the top level selectors for a rule. I’ve been able to create whole new page layouts extremely quickly using this technique.
Mixins and variables are just extra bonuses. Instead of having to write a bunch of vendor prefixes for box shadows or gradients, I can create a
box-shadow mixin that can then be included in every rule that requires that style. Variables are great, too: you can just define a
$text-color variable, then refer to it easily later without having to memorize an arcane hex value.