
Why use HAML (and SASS) if you already know HTML? - r11t
http://blog.digimonkey.com/2010/02/why-use-haml-and-sass-i-already-know-html/
======
aaronbrethorst
Why should I use C since I already know Assembly? Why should I use Ruby since
I already know C?

Haml and Sass are elegant tools for simplifying view code, and I never, ever
use ERB or CSS anymore if I can avoid it.

~~~
jherdman
My biggest qualm with Sass is that it introduces a speed bump in my workflow
compared to using plain CSS. This is due to the fact that I can use tools like
CSS Edit to create, edit, and verify my CSS all at the same time. If these
tools also supported Sass I'd be all set.

~~~
aaronbrethorst
Although it doesn't satisfy your 'no speed bump' test, you could still
generate css files with CSSEdit and then convert them to Sass with css2sass.
Certainly inelegant, but it could cut it.

Also, just out of curiosity, why do you use CSSEdit? I'm guessing you probably
write your HTML or Haml markup with Textmate and not Dreamweaver, right? Why
do something different with CSS?

~~~
jherdman
CSS Edit gives me instant feedback on my changes. It's not always easy to know
how changes to your CSS will display. You have to think about all the rules
that are in play, as well as the defaults of a given browser.

HTML is much easier. You're just dealing with structure, so it's much easier
to comprehend.

------
retro
James Britt wrote the definitive post (in my opinion) on the use of Haml:
<http://www.jamesbritt.com/2009/4/29/thoughts-on-haml>

~~~
RyanMcGreal
>I view static indentation as I do most forms of static typing: needlessly
restricting in an attempt to solve problems that don’t come up much in Real
Life code but make for nice pedantic rants about “But what if?”.

As a happy Python user, I absolutely resent going to languages that require
code block delimiters. Since I consistently indent anyway (and have done so
since long before I ever discovered Python), it just feels like pointless
duplication of effort to indent _and_ delimit using curly braces or do ... end
or whatever.

Significant whitespace may not be for everyone, but there's no case to be made
that it's _punitive_.

~~~
jamesbritt
"Significant whitespace may not be for everyone, but there's no case to be
made that it's punitive."

There's a worthwhile difference between Haml's "must be this distance,
_exactly_ " approach and the offside rule of Haskell. That I cannot add some
extra indentation for clarity or ease of reading in Haml is wrong.

BTW, is there an auto-format plugin for vi that will automatically set/adjust
the indentation of Haml if it is misaligned?

As far as know, it's up to the typist to ensure that each item lines up
exactly so, which is extra work (i.e. punitive), but perhaps I've just failed
to find the right plugin.

------
marstall
If you're a one-man team who does the whole stack on your own personal
project, something like HAML might be for you.

However I have to say, in 10+ years of working on multi-person, multi-
discipline web teams, there isn't one to whom i could see having recommending
something like HAML.

Just raises too high a bar for designers and front-end developers (ie CSS/HTML
specialists), for whom learning a new language is actually a fairly big deal.

SASS seems to be enough like CSS that it wouldn't necessarily pose a
comparable problem to the designer brain. I could see designers grokking its
basic features like variables and seeing them as a thing that gave them more
power.

If my experience is representative, though, configuration might be SASS'
achilles heel right now. Really gave it the ol' college try and my SASS files
never QUITE seemed to compile how and when i expected. Compass was even worse
in that regard for me. I am getting old though, so maybe i've just lost a step
or two :) Anyone else have similar experiences?

~~~
nex3
I think you aren't giving designers enough credit. They're generally quite
smart folks, and tend to pick up Haml and Sass just as quickly as programmers.

I'm sad that you found Sass's configuration difficult. What in particular did
you have a hard time figuring out how to do? We're always interested in
improving the documentation and UI.

------
chrischen
A lot of IDEs/text editors can autocomplete HTML closing tags, so I find the
comparison based on characters moot.

I'll admit it might make things easier to navigate with the eyes. But on the
other hand it seems to abstract something that's really not that complicated
to begin with.

~~~
jsm386
_A lot of IDEs/text editors can autocomplete HTML closing tags_ was my initial
response to HAML. I was dragged into using HAML, and I'm glad/frustrated for
it. Glad, because by the time I finished that project I realized how much
faster/easier it made things; frustrated, because the following day I started
another (rather large) job in which HAML wasn't an option. It's hard to put
into words why I found HAML superior to HTML. A really poor way of explaining
it is <http://en.wikipedia.org/wiki/I_know_it_when_I_see_it> \- just replace
see with do.

As for SASS, maybe I'll feel the same way after I jump in, but the idea of
adding a layer of abstraction to CSS seems like trouble - IE 6/7/8 is trouble
enough.

~~~
nex3
Sass can actually help quite a bit with dealing with the IEs. Compass
(<http://compass-style.org>) has a bunch of mixins that are fully cross-
browser and make short work of a lot of compatibility issues.

------
richardburton
I've only been using HAML & SASS for around a month and I'm by no means an
expert. I've found that using mixins saves me a lot of time. At the top of my
stylesheets I lay out bits that I repeat a lot such as:

    
    
      =rounded-corners(!amount)
        border-radius=         !amount
        -moz-border-radius=    !amount
        -webkit-border-radius= !amount
    

And then add them into the UI:

    
    
      .curvybox
        +rounded-corners(7px)

------
brunoc
An alternative to SASS, if you are looking for one, is "less"
(<http://lesscss.org/>).

------
zaius
Good luck giving that to a designer.

~~~
tptacek
This comes up every time people talk about Haml. It's a red herring. You're
crazy if you ask your designer to work in Haml. There are few enough excellent
designers to begin with; consider yourself lucky to get semantic markup out of
them, let alone Haml and Sass.

On every professional project I've worked with, we were given markup and
assets from designers, and then expected to integrate them ourselves. If
you're lucky enough to have a designer on staff, train them in Sass.
Otherwise, the process of converting HTML to Haml and CSS to Sass isn't any
harder than converting mockup HTML to templates.

On the opposite side, if you just need a refresh or a facelift, you give them
the HTML and CSS that Haml and Sass generate. It's nicer looking than ad hoc
markup already.

~~~
grandalf
This is the key point. You save time working with Haml and Sass if your
designers can use them, edit them, etc.

I am longing to get to a point where the designers I work with can be expected
to write templates using mustache or django template language...

Ideally the designer can check out a submodule of the project and commit
ongoing UI enhancements by simply modifying mustache/django templates that
they wrote in the first place.

This could easily be implemented by using a static site generator to populate
the templates with static data so that the designer could check his/her work
before committing.

With Haml you end up translating the whole mess over and over again, and if
you decide to make a big change to HTML/CSS you are spending lots of time
redoing the HAML/Sass.

The other key thing to realize is that CSS is an extremely expressive spec
when used properly I really don't think that the small bit of conciseness
offered by Sass is worth adding another layer...

~~~
nex3
CSS, although a very cool and powerful language, leaves a lot to be desired in
one key area: abstraction. Not coincidentally, this is the area that Sass is
best at. Chris Eppstein has an excellent blog post
([http://chriseppstein.github.com/blog/2009/09/20/why-
styleshe...](http://chriseppstein.github.com/blog/2009/09/20/why-stylesheet-
abstraction-matters/)) explaining why abstraction in stylesheets matters.

~~~
grandalf
Interesting. Thanks for the link, I will check out Compass. I think the
widgets/plugins are really an awesome idea.

------
seven
I do not use HAML in my projects because it is much easier to find somebody
who can understand 'html-templates'.

~~~
tptacek
A _developer_ that can't understand Haml is a no-hire, whether or not you buy
into Haml. Designers don't need to work in Haml and Sass; Haml and Sass are
developer tools.

