Haml and SASS
are meta-langauges that compile into HTML and CSS, respectively. They
let you write code that is leaner, more readable, and more easily
changed.
We use Haml and SASS for every website we make (even this one!), and will probably never go back.
However, Haml and SASS are typically pretty tough to use for
websites that are static or hosted on a server that you don't fully
control. This is because they are written in Ruby and designed to be
used with Ruby on Rails.
But we've done all the plumbing to make Haml and SASS work automatically on Vae. All you need to do is upload a .haml
or .sass
file and hit it in your browser. We will automatically compile it to HTML or CSS and cache the compiled version.
I think we are the first shared webhost to do something like this.
Check out how cool Haml is. This code:
#shows
.show
%a{ :href => "/show" } See the show
Becomes this ...
<div id="shows">
<div class="show">
<a href="/show">See the show</a>
</div>
</div>
Haml cuts out all of the extra typing and brainpower associated with
closing tags and angle brackets everywhere. It also uses CSS-style
identifiers for id
and class
. For more details, read the documentation.
SASS applies the same principle to stylesheets. This:
#main
:width 97%
p, div
:font-size 2em
a
:font-weight bold
pre
:font-size 3em
Becomes this:
#main {
width: 97%; }
#main p, #main div {
font-size: 2em; }
#main p a, #main div a {
font-weight: bold; }
#main pre {
font-size: 3em; }
Curly brackets are gone, and nesting style rules is now a matter of just using indentation! For more details, read the SASS documentation.
Of course, you can fully use VaeML tags inside Haml. They work just like HTML tags.