Appendix 2
Introduction to Haml

Haml is something of a sister language to Sass, but Haml was actually designed before Sass. It was successful enough that a CSS-version was developed, applying the same principles of Haml into CSS. They were both developed to clarify the meaning behind design.

Haml was created from the desire to write logically structured HTML that your designer would thank you for. HTML builders shouldn’t make crap: the layout of the page and the information on the page should be logically structured and well named. Haml isn’t a revolution; it’s a statement of the obvious and an adoption of best practices.

Installing Haml is pretty similar to installing Sass. Once Ruby is installed, all you need to type in the command line is the following:

And you’re done. It used to be that Haml was in the same gem as Sass, but since version 3.1 they’ve been split into two separate gems.

If you need any help with Haml, there’s the Haml site and all its documentation,^[18] which will have a lot more information than the snippet we’ve given here. In addition, there’s a bunch of friendly people willing to help at the Haml Google group.^[19]

In this appendix, we’ve got two ways to take you through Haml. The first is from a Ruby-style angle, taking an example of ERB and reformatting it. The second is for those of us who are more familiar with HTML. They’re both in a slightly different format to the rest of the book, as they follow the progression of ERB/HTML into Haml.