CREATOR BLOG

「web制作者のためのSassの教科書」レビュー

「Sassの教科書」の写真

Sassがとても便利なのは知っていたけれど、なかなか導入する切掛けがないという方にオススメの本です。
Sassの情報も充実してきているので、勉強しようと思えばWebでの検索だけでも出来ます。
しかし、取っ掛かりにこういった1冊にまとめてある本で読むと理解がより早いです。

目次

第1章 Sassの基本

  • まずはSassって何なのか知ろう
  • Sassを導入する前の疑問や不安
  • 何はともあれSassをさわってみよう

第2章 Sassの利用環境を整えよう

  • Windows環境にSassをインストール
  • Mac環境にSassをインストール
  • Sassを最新版にアップデートしよう
  • Sassコマンドの使い方を覚えよう
  • バッチファイル/シェルスクリプトで簡単にコマンドを実行する
  • GUI(Koala)でSassを使用する
  • インストールや実行中のエラーが表示された場合の対処法

第3章 これだけはマスターしたいSassの基本機能

  • ルールのネスト(Nested Rules)
  • 親セレクタの参照 &(アパサンド)
  • Sassで使えるコメント
  • 変数(Variables)
  • 演算
  • Sassの@import

第4章 高度な機能を覚えてSassを使いこなそう

  • スタイルの継承が出来る@extend
  • 柔軟なスタイルの定義が可能なミックスイン(@mixin)
  • 制御構文で条件分岐や繰り返し処理を行う
  • 関数を使って様々な処理を実行する
  • 自作関数を定義する@function
  • テストやデバックで使える@debugと@warm
  • Sassのデータタイプについて
  • 使いどころに合わせて補完(インターポレーション)してくれる#{}
  • 変数にデフォルト値を割り当てる!default

第5章 現場で使える実践Sassコーディング

  • 管理/運用・設計で使えるコーディングTips
  • ブラウザ対応で使えるコーディングTips
  • レイアウト・パーツで使えるコーディングTips
  • スマホ・マルチデバイスで使えるコーディングTips

第6章 Sassをさらに便利にするCompass

  • Compassを利用する準備
  • Compassのインポートとモジュール
  • Compassのミックスインを使う
  • Compassの関数(Helpers)
  • Compassで簡単CSSスプライト(Compass Sprites)
  • 高度なCSSスプライトの使用方法

第7章 もっとSassを使いこなして便利にしよう

  • Sassのフレームワーク紹介
  • Sassが使えるテキストエディタ
  • DreamweaverのSassの対応
  • SassのGUIコンパイラ
  • SassのCUIツール

第8章 Sass全機能リファレンス

  • Sassの基本と高度な機能
  • Sassの関数一覧
  • Sassの拡張

付録:コマンドオプション一覧

付録:用語集

Sassの機能を拡張するCompassの導入方法と大まかな使い方も記載されているのでお得感があります。
他のCSSメタ言語ではなくSassを使う理由にはこのCompassがとても大きいかと。
なにせ今まで面倒だったCSSスプライトがとても簡単に出来てしまう!
自分もこの機能を使いたくてSassを勉強しようと思ったくらいなので。
CSSスプライトって画像作りから画像の位置を調べるのって面倒なんですよね。
良いWebツールもあるのですが、Compassでサクサク作るのはとても気持ちいいです。
ミックスインを作っておけば、もう何も考えずに出来てしまいます。

Sassを導入するにはターミナル(黒い画面)での作業が必要なので、そこで躊躇してしまう人が多かったと思う。
その部分を割と丁重に説明しているので良いです。
ただMacの場合ははじめから入っているRubyのバージョンが1.8.xと古かったりするので、アップデートが必要だったり。
その辺りの方法は本に記載がないので、ネットなどで調べて作業するとことになる。
ただOSのバージョンやRubyのバージョンによって今後アップデート方法など変化してくると思うので、本に載せなくて良かったと思う。
アップデートするならネットで最新の情報をゲットした方が良いです。

Sassのフレームワーク紹介も参考になります。
ネットで調べても日本語の情報はまだまだ少なくてフレームワークもどれを選んだ良いか悩んでしまう。
そんな時にどれを選ぶかの参考に使えます。

CSSフレームワーク(Bootstrapなど)を素のまま使うとどうしても余計なクラス名を付けなくてはいけなくHTMLがセマンティックにならない。
それが導入を躊躇する原因だったけれども、Sassのミックスインなどを上手に使えば不要なクラス名を付けなくて良くなる。

さらにレイアウト系のフレームワークでは特にその辺りが良くできているよう。
この辺りは本では紹介程度なので、ネットで調べる事になる。

第8章の全機能リファレンスも割と便利だった。
大まかなサンプルのソースが載っていて、さらに詳細が記載されているページ番号が記載されていて重宝。

必要最小限の内容なので、Sassを導入する切掛けになる本です。
オススメ度合い★★★★☆

    ▲ PAGE TOP