Archive for the ‘Haml’ Category

Introduction to Haml For HTML Layouts for Newbs – Part 4: Final thoughts

Wednesday, September 28th, 2011
Introduction to Haml For HTML Layouts for Newbs – Part 4: Final thoughts

Abstraction languages are cool

We need more of them. I only know of a few, but the ones that I do are pretty bad ass. Seems odd that the two I use were created by the same person, but if you have used Haml and Sass then you will see the connection and some of the thinking behind them.

Language abstractions make me think differently about the way I do things. Sass taught me to be a lot tighter in my CSS, and Haml showed me how you can write out an HTML page faster than lighting. In short, because of the these, I have improved as a web developer. For that alone they get my high praise and a check mark in the cool category.
(more…)

Introduction to Haml For HTML Layouts for Newbs – Part 3: Markdown Syntax For Content

Tuesday, September 20th, 2011
Introduction to Haml For HTML Layouts for Newbs – Part 3: Markdown Syntax For Content

Haml rocks for Layout, but what about content?

So obviously I really like Haml. Pretty sure that comes through in my writing. I’ve also stated that it is good for the layout/structure of your page, but what about the fluff of the page? You know, all the paraphraphs, lists and other crap the end user will actually read. Let me finally give you an example of why Haml is not the way to go for this.

#content
    %ul
        %li
            %a{:href=> "/index.html"} Home
        %li
            %a{:href=> "/services"} Services
        %li
            %a{:href=> "/about"} About

(more…)

Introduction to Haml For HTML Layouts for Newbs – Part 2: Writing Haml

Thursday, September 8th, 2011
Introduction to Haml For HTML Layouts for Newbs – Part 2: Writing Haml

The difference between structure and content

Haml is great! But for what, is the real question. According to Haml’s website, “Markup should be beautiful.” It definitely does make things look clean and easy to read, but there seems to be a catch. Chris Eppstein (creator of Compass) wrote an article that basically says don’t use Haml for content, and I suggest reading it when you are done reading this. Looking at his first example, which I won’t duplicate here, you see what he is driving at right away. For the actual content of the site, Haml starts to look like garbage. What it IS good for though, is the actual structure of the template. Template, file, whatever. The stuff you write in HTML, like this:

<div id="luckDragon"></div>

Haml can do better:

#luckDragon

The lesson to be learned here is that, for the main layout of your site use Haml. For the fluff we’ll use something called Markdown, which I’ll talk about in Part 3 of this series. In this post, we are going to deal with the basics of Haml though.

(more…)

Introduction to Haml For HTML Layouts For Newbs – Part 1: Installing Stasis

Friday, September 2nd, 2011
Introduction to Haml For HTML Layouts For Newbs – Part 1: Installing Stasis

Part one of four

Learning something new is awesome, and writing about what I am learning helps me get it into my head a lot more. Yesterday I started learning how to use Haml, and once I started, I thought I would pass on this newly acquired knowledge on to you. This series is for NON programmers. You might know javascript/jQuery, but the people I am writing this for are not really going to have any real knowledge of programming. If you have just gotten into using Sass, then this is a perfect next step for you. Here are the topics in this four part series:

Haml logoSo what the hell is Haml anyway? Well, imagine taking out the syntax of an HTML document, and replacing it with a cleaner syntax. It also adds a ton of other functionality, but what I’m going to be talking about in this series is just basic HTML layout writing. Mainly because I just got started with it myself, so the other stuff will have to wait.
(more…)