Sassとは？

「Sass」とは「Syntactically Awesome StyleSheets」の略です。

Syntactically = 文法的に
Awesome = すごい
StyleSheet = スタイルシート

という意味です。

Ruby製のCSSメタ言語です。Sassはハンプトン・キャトリン氏が設計、ネイサン・バイゼンバウム氏が開発したものと知られています。
SassはCSSを効率的に記述できるように設計・開発された言語(ツール)であり、CSSの場合、長く複雑になってしまう記述であっても、わかりやすくシンプルに書けるというところが特徴です。
小規模のホームページの制作では、コーティングにそれほど手間に感じなかったとしても、規模が大きくなるとその手間はとても大きなものになるでしょう。コードを見直すのも大変ですし、やはりシンプルさは重宝します。

簡単にまとめて言うと「CSSをさらに拡張して、より効率的に書けるようにした」のがSassです。

Sassのメリット・デメリット

メリット

▶ 作業効率がアップする
これに尽きるといっても過言ではないです。作業効率がアップする理由を簡単にまとめると次のようになります。

・セレクタやプロパティのネストで記述量が減る
・一度定義したスタイルのセットを簡単に呼び出せる
・複雑なコードも再利用できる

例として、サイトで何度も出てくるボタンのスタイルセットがあって、それを別のセレクタの中で呼び出して背景色だけ変える、なんてことも簡単にできます。

▶ メンテナンス性がアップする
メンテナンス性がアップする理由を簡単にまとめてみました。

・変数で値を使いまわすことができる
・四則演算ができる
・関数が使える

例として、メインカラーやサブカラー、カラムの幅など、よく使うものを変数にしておくことで、たった1箇所の変数を書き換えれば、同じ変数を使っている部分の修正がすべて済んでしまいます。

デメリット

▶ 環境の準備が面倒
SassファイルはそのままではCSSとしてブラウザが認識できるものではありません。「コンパイル」という作業をして、CSSに変換してあげる必要があります。そのために必要なツールをインストールしないとならないのが難点です。これが面倒で導入をしない方も多いです。

ですが、最近ではフリーかつ強力なアプリが多数あり、ストレスもなくなりました。
「Sass 環境構築」で確認してください。

▶ 全ての人がSassを導入しているわけではない
私が思う最大のデメリットです。例えば公開までこちらで作業をして、公開以降はクライアントでメンテをしていくなんて場合も多いでしょう。逆も然りで、クライアントの既存サイトを修正していくこともあります。そんな場合、クライアント側がSassを導入していなければCSSを編集していくことになり、Sassは使えなくなってしまいます。

こちらも諦める前に運用方法でカバーできることもあります。クライアント用に修正用のCSSを用意して、修正のスタイルはそちらに書いていってもらうことでSassが使えなくなってしまうことを防ぐことができます。