[HTML & CSS General] Haml: </img> や </br> はインデントの間違いだった

タイトルで言い切っていますが、はまったので memo.

[markdown]
## 状況

元の html はこんな形。
つまりコンパイル後の html としては、これが欲しい。

“`html

NEW 【カテゴリー】

親譲りの無鉄砲で小供の時から損ばかりしている。 datetime

“`

html を haml に変換するサービスで一括置換してみました。

“`haml
%img.thumbnails{:alt => “写真 サムネイル”, :src => “https://placeimg.com/72/72/people”}
%p
%span.label.label-default NEW
【カテゴリー】
%p
%a{:href => “”} 親譲りの無鉄砲で小供の時から損ばかりしている。
datetime
“`

## チェック

haml ファイルをコンパイルすると、htmllint で以下のように怒られました。

“`prettyprinted
[L102:C15] Tag must be paired, No start tag: [ ]
“`

生成された html を確認すると、こんなことに。

“`html

NEW
【カテゴリー】

親譲りの無鉄砲で小供の時から損ばかりしている。
datetime

“`

## 対処

よくよくソースを見ると、`%p` タグの前に不要なインデントが入っていたので修正します。
あたりまえちゃ、あたりまえなのですが。

“`haml
%img.thumbnails{:alt => “写真 サムネイル”, :src => “https://placeimg.com/72/72/people”}
%p
%span.label.label-default NEW
【カテゴリー】
%p
%a{:href => “”} 親譲りの無鉄砲で小供の時から損ばかりしている。
datetime
“`

信頼性の高い変換ツールをご存じの方いましたら教えてください。

追記（2015/11/13）

> * [ERB, HTML を Haml に変換する | deadwood](https://www.d-wood.com/blog/2015/11/13_7676.html)
[/markdown]