назад
29 окт

HAML

Haml (HTML abstraction markup language) - язык для быстрой и удобной генерации валидного и красивого HTML.

Основной принцип HAML - «разметка должна быть красивой».

Выглядит HAML так:

1
2
3
4
5
%section.container
  %h1 Название Поста
  %h2 Подзаголовок
  .content
    Текст поста

В западной стартап-среде такой вариант HTML-разметки сейчас является де-факто стандартом - о чём говорит и множество подражателей HAML - начиная от адаптаций под другие языки: PHP ([1] [2] [3] [4]), Python ([1], [2]), Java, Node.js, и заканчивая менее общеизвестными Slim и Jade, в которых не нужно начинать тег с %, но зато перед простым текстом нужно ставить |.

 

Одним из главных достоинств HAML для нас в Rocket Science, помимо красивого, аккуратного и удобного синтаксиса является возможность генерить валидный HTML код, да ещё и с правильными отступами при разработке:

1
2
3
4
5
6
7
<section class="container">
  <h1>Название Поста</h1>
  <h2>Подзаголовок</h2>
  <div class="content">
    Текст поста
  </div>
</section>

и всё ещё валидный код, но без каких-либо лишних отступов в production (с Haml::Template.options[:ugly] = true), что значительно снижает вес больших страниц:

1
2
3
4
5
6
7
<section class="container">
<h1>Название Поста</h1>
<h2>Подзаголовок</h2>
<div class="content">
Текст поста
</div>
</section>

Другой большой плюс - структура HAML такая же как в SASS (что связано с историей их совместного появления), что позволяет писать логичный, и сразу же понятный любому CSS:

1
2
3
4
5
6
7
8
section.container
  padding: 10px
  h1
    font-size: 20px
  h2
    font-size: 16px
  .content
    font-size: 14px

И третий — поддержка огромного списка фильтров, начиная от :css и :javascript (которые правильно экранируются и прячутся в теги <CDATA>), и до языков разметки контента (таких как markdown и textile).

 

Однако, у HAML есть и недостатки, главный — всё-таки HAML — для вёрстки, а не для контента.

1
2
3
4
5
6
7
8
9
%p
  Please,
  %strong
    For the love of
    = succeed "," do
      %a(href="http://www.god.com/") God
  don't use
  %a(href="http://haml-lang.com") Haml
  for marking-up your content!

Мы используем для контента чистый HTML или Markdown, что и Вам советуем, например так, прямо внутри HAML:

1
2
3
4
.content
  :markdown
    Please, **For the love of [God](http://www.god.com/),**
    don't use [Haml](http://haml-lang.com) for marking-up your content!