background preloader

Saas and less

Facebook Twitter

Sass vs. LESS. "Which CSS preprocessor language should I choose?

Sass vs. LESS

" is a hot topic lately. I've been asked in person several times and an online debate has been popping up every few days it seems. It's nice that the conversation has largely turned from whether or not preprocessing is a good idea to which one language is best. Let's do this thing. Really short answer: Sass Slightly longer answer: Sass is better on a whole bunch of different fronts, but if you are already happy in LESS, that's cool, at least you are doing yourself a favor by preprocessing. Much longer answer: Read on. The Much Longer Answer The Learning Curve with Ruby and Command Line and Whatever The only learning curve is the syntax. Winner: Nobody Helping with CSS3 With either language, you can write your own mixins to help with vendor prefixes. In Sass, you can use Compass, and Compass will keep itself updated, and thus the prefix situation is handled for you.

In LESS, there are also some mixin libraries battling to be the best. See that? Getting Started with CSS Preprocessors (Less and Sass) : Adobe Dreamweaver Team Blog. What are CSS preprocessors?

Getting Started with CSS Preprocessors (Less and Sass) : Adobe Dreamweaver Team Blog

CSS is the language used to make the web beautiful. Preprocessors can be used to help make CSS more beautiful. CSS preprocessors extend the basic functionalities, overcoming many limitations of traditional CSS by adding features such as variables, nesting selectors and mixins, creating CSS that is more maintainable and efficient. CSS written in a preprocessed language must also be converted or compiled into traditional CSS syntax. There are many apps that can be used to do this and will be discussed further in this article. Why make CSS more complicated? I have to admit, I resisted at first as well. Getting started with even just the basic features will greatly improve your workflow. Less vs Sass? It’s time to swtich to Sass. The CSS pre-processor debate The Sass vs.

Less vs Sass? It’s time to swtich to Sass

LESS argument has been done to death. In this series I’ll talk about why Sass really is the best, why you should start using Sass if you haven’t already, how to get started using Sass and Problems with pre-processors, alternatives to Sass and CSS4. Before I begin my highly opinionated tirade, let me just mention that I learned Less first. Less is great for beginners, it’s really easy and quick to set it up. …until I discovered the truly awesome power of Sass and Compass. Why Sass is better than LESS Sass lets you write re-usable methods and use logic statements; ie. conditionals and loops. Problems with Less Less aims to be as much like CSS in style, syntax and structure, and while this is a nice thought for easing users into writing it, there are a few issues which make it a lot less fun to work with than Sass: Logic statements In Less you can write a basic logic statement using a ‘guarded mixin’: The equivalent in Sass using if statements: Loops.

Why I switched from LESS to Sass. Published November 13, 2012 Yaaay, another blog post on the web about CSS preprocessors, as if there wasn’t enough.

Why I switched from LESS to Sass

Don’t worry: I won’t try to convince you to use a CSS preprocessor, neither about the one you should pick. These decisions are really up to you. So this post will be about my own experience with CSS preprocessors. For the concern, I recently wrote an article for Codrops untitled “10 things I learnt about CSS” and I talked a lot about preprocessors, so I’ve read (and tried) a bunch of things on the topic lately. Anyway and before anything, please note I’m not a hardcore CSS preprocessor user. Why LESS as a first try # A few weeks ago, I wanted to have a real shot with CSS preprocessors after hours of playing on CodePen so I read a few things to make a choice.

Sass built on Ruby LESS built on JavaScript Stylus built on JavaScript CSS Crush built on PHP I’ve never heard much about Stylus so it was not an option to me. Anyway, that wasn’t the worst thing. Convert a SASS project into LESS. Similarities, differences et equivalents between those two CSS preprocessors.

Convert a SASS project into LESS

Matters of taste LESS and SASS today are the two most popular CSS preprocessors so far. They are quite similar and give functionalities to CSS that every front-end developer ever dreamt: variables, functions, mathematical operations, selectors nesting, etc. However, there are some differences: SASS is compiled with Ruby, it has two different syntaxes: .sass and .scss. As a general rule, we can say that SASS is more powerful than LESS because it notably has a bunch of additional functionalities. Personnally, I use LESS instead of SASS with my projects, mostfully because I get used to it. Hopefully, I’m not the only one who likes LESS and Peter Wilson has worked to create the LESS version of the framework.

It’s all about traducing the SASS framework into LESS, which leads us to 3 options: Here is a broad overview of these options, as far as I know. What is identical in LESS Nesting Will produce the following code: Mixins.