Breadcrumb Content

Main Content

SASS

February, 25, 2015 | CSS

CSS pre-processors have been around for quite a while. I became aware of them back in 2009. I didn’t think too much of it back then due to the fact that I didn’t have time. Several years later I began experimenting with LESS (unofficially means – Less Evil Style Sheets) and found it useful. Keep in mind that most guys in my position are stubborn and skeptic. To prove my point; I’ve read blog posts from some the most reputable bloggers that claimed, “You don’t need a grid system to develop front-end layouts!” Imagine that!

I decided to go with LESS for one reason, convenience. You can run LESS using the Less.js file, Grunt and several other methods. I read somewhere that you had to install Ruby and several other applications in order to use SASS (Syntactically Awesome Style Sheet). I decided to download a free application called Crunch to compile LESS. I will choose simplicity over any method that I might even perceived to be complicated at every turn. I downloaded Crunch and began experimenting. Crunch is well designed and easy to use. However, you have to edit your CSS file in Crunch and not your fave IDE or text-editor. After a while it becomes a bit of a drag. Simplicity is not always the right choice.

I needed more flexibility and assurance, so I purchased Codekit. At this point, I really began to appreciate the power of CSS preprocessors. LESS became part of my tool set and I still use it today. However, curiosity led me to SASS. Head to head as far as compiling CSS goes; they are tie, with subtle differences, of course. I use to think or assume that LESS was more straightforward, until I compared the way their variables, functions and mixins are structured. LESS tends to implement less than, greater than and the equal sign ( < , >, = ). Using it this way is practically fail proof. SASS uses key words Darken, Lighten, Saturate, Desaturation and numeric percentages. I find both methods of mixins very comprehensive and easy to use.

Where SASS surpasses LESS is with the use of Compass. I have yet to discover all that Compass has to offers. For the moment, I know it can manage your directories, and even provide an alias for them. It can also alter and produce code for design-based images; like creating sprites to enhance page performance and generating the CSS code for it (how cool is that). I am sure you can find a lot more in that bag of tricks, so visit the site http://sass-lang.com/. Only then will you understand why I chose that thumbnail for this post. Happy Hunting…

Mr. Blox

I dream in code, find conformity repulsive and drink excessive amounts of coffee...

One Response to “SASS”

  1. Hans

    March 6, 2015

    Try Stylus, I think it’s better and more intuitive.