<html xmlns="http://www.w3.org/1999/xhtml"><head></head><body><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="9" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[9]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Haml</anchor> は <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">HTML</anchor> を生成する元データとなる<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">言語</anchor>で、
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> は <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> を生成する元データとなる<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">言語</anchor>です。
どちらも <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">HTML</anchor> や <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> とは大きく異なる構文を採用しています。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="12" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[12]</anchor-end> <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Haml</anchor> と <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> は元々セットで開発されており、
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> から <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> に変換する実装は <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Haml</anchor> から <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">HTML</anchor> に変換する実装に含まれていたようです。
そのため <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Haml</anchor> を両者の総称として使うこともあったようです。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="11" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[11]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">SCSS</anchor> は後に導入された <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> の別構文です。
元の <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> の構文と比べると <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> にかなり近い構文になっています
(<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CSS</anchor> は <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">SCSS</anchor> である <src xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:10:"><anchor-internal xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="6" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">&gt;&gt;6</anchor-internal></src> とされていますが、本当かは知りません)。
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">SCSS</anchor> 導入後、 <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> という名称は元の構文のことも、
元の構文と <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">SCSS</anchor> の総称も表しているようで、どちらの意味かは文脈によります。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="13" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[13]</anchor-end> 
というごちゃごちゃした経緯が外部からはわかりにくく、
ぐぐるといろいろな時代の説明がでてきて混乱しているようにみえます。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="10" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[10]</anchor-end> 
<anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Haml</anchor> や <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">Sass</anchor> を好む人々は、 <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">CoffeeScript</anchor> も使っていることが多いようです。</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="1" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[1]</anchor-end> <cite>Hamlとは - はてなキーワード</cite> (<time>2009-04-26 16:31:40 +09:00</time> 版) <anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://d.hatena.ne.jp/keyword/Haml">http://d.hatena.ne.jp/keyword/Haml</anchor-external></p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="2" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[2]</anchor-end> <cite xml:lang="ja">日本Hamlの会</cite> (<time>2009-04-26 16:32:30 +09:00</time> 版) <anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://haml.ursm.jp/">http://haml.ursm.jp/</anchor-external></p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="3" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[3]</anchor-end> <cite>#haml</cite> (<time>2009-04-26 16:32:43 +09:00</time> 版) <anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://haml.hamptoncatlin.com/">http://haml.hamptoncatlin.com/</anchor-external></p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="4" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[4]</anchor-end> <cite>#haml</cite>
(<time>2010-04-12 13:40:22 +09:00</time> 版)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://haml-lang.com/">http://haml-lang.com/</anchor-external></p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="8" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[8]</anchor-end> 
<anchor-internal xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="4" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">&gt;&gt;4</anchor-internal> <anchor xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:">ドメイン</anchor>失効</p><p><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="5" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[5]</anchor-end> <cite>Sass - Syntactically Awesome Stylesheets</cite>
(<time>2010-04-12 13:41:05 +09:00</time> 版)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://sass-lang.com/">http://sass-lang.com/</anchor-external></p><figure class="quote"><figcaption><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="7" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[7]</anchor-end> <cite xml:lang="en">Haml</cite>
(<time>2015-06-08 23:25:02 +09:00</time> 版)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://haml.info/">http://haml.info/</anchor-external></figcaption><blockquote><p>Haml (HTML abstraction markup language) is based on one primary principle: markup should be beautiful. It’s not just beauty for beauty’s sake either; Haml accelerates and simplifies template creation down to veritable haiku.</p></blockquote></figure><figure class="quote"><figcaption><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="6" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[6]</anchor-end> <cite xml:lang="en">File: SASS_REFERENCE — Sass Documentation</cite>
(<time>2016-03-29 08:46:44 +09:00</time>)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="http://sass-lang.com/documentation/file.SASS_REFERENCE.html">http://sass-lang.com/documentation/file.SASS_REFERENCE.html</anchor-external></figcaption><blockquote><p>There are two syntaxes available for Sass. The first, known as SCSS (Sassy CSS) and used throughout this reference, is an extension of the syntax of CSS. This means that every valid CSS stylesheet is a valid SCSS file with the same meaning. In addition, SCSS understands most CSS hacks and vendor-specific syntax, such as IE’s old filter syntax. This syntax is enhanced with the Sass features described below. Files using this syntax have the .scss extension.</p><p>The second and older syntax, known as the indented syntax (or sometimes just “Sass”), provides a more concise way of writing CSS. It uses indentation rather than brackets to indicate nesting of selectors, and newlines rather than semicolons to separate properties. Some people find this to be easier to read and quicker to write than SCSS. The indented syntax has all the same features, although some of them have slightly different syntax; this is described in the indented syntax reference. Files using this syntax have the .sass extension.</p></blockquote></figure><figure class="quote"><figcaption><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="14" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[14]</anchor-end> <cite>CodeMirror: CSS mode</cite>
(<time>2017-02-20 17:52:02 +09:00</time>)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="https://codemirror.net/mode/css/index.html">https://codemirror.net/mode/css/index.html</anchor-external></figcaption><blockquote><p>text/x-scss</p></blockquote></figure><figure class="quote"><figcaption><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="15" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[15]</anchor-end> <cite>CodeMirror: HAML mode</cite>
(<time>2015-08-19 22:47:18 +09:00</time>)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="https://codemirror.net/mode/haml/index.html">https://codemirror.net/mode/haml/index.html</anchor-external></figcaption><blockquote><p>MIME types defined: text/x-haml.</p></blockquote></figure><figure class="quote"><figcaption><anchor-end xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:anchor="16" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:">[16]</anchor-end> <cite>CodeMirror: Sass mode</cite>
(<time>2017-01-23 00:26:37 +09:00</time>)
<anchor-external xmlns="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resScheme="URI" xmlns:a0="urn:x-suika-fam-cx:markup:suikawiki:0:9:" a0:resParameter="https://codemirror.net/mode/sass/index.html">https://codemirror.net/mode/sass/index.html</anchor-external></figcaption><blockquote><p>MIME types defined: text/x-sass.</p></blockquote></figure></body></html>