書店に置いてあった、Sassの教科書

いよいよ明日発売の「Web制作者のためのSassの教科書」ですが、今回は、8章有る中でも特に読んでもらいたい章に関して、書きたいなーと思います。

今回の執筆はわりと気合い入ってるので、宣伝エントリーが多くてすみません><

ちなみに、今日いくつかの書店をまわったら、既に置いてあったので仕事帰りなどに書店に寄ってもらえれば既に購入できると思います。

さて、本題に。


一番読んで欲しいのは5章なんです

5章の扉

Sassは、インストールが面倒そうとかって部分やイマイチSassを使うメリットが見えてこないって人も多く、他のツールとかに比べると導入のハードルが高いと思うので、1章と2章ではその辺りをしっかりフォローした内容になっています。
1章に関しては、サポートサイトでお試し用のPDFが読めます。

次に、3~4章はSassの機能をひと通り紹介しています。3~4章に関しては、Sassの本を名乗る以上は載ってて当然な部分ですが、初めてSassに触れる人でも理解しやすいように配慮して書いてます(たぶん...)。

そして、一番読んで頂きたいと思っているのが、5章の「現場で使える実践Sassコーディング」です。
5章は節だと4つしかないので、一見ボリュームが無さそうに見えますが、全ての章の中でも一番ページ数が多いのが5章になります。

ちなみに、こんな感じの内容が載ってます。

  • 5-1 管理 / 運用・設計で使えるコーディングTips
    • ネストが深すぎると生じる問題を把握して、バランスを見ながら利用する
    • コラム:ネストは何階層までがよいか
    • CSS とは違うパーシャルによるSass ファイルの分割
    • さまざまなリセットCSS を1 つのファイルにまとめて使いまわす
    • コラム: リセットCSS などのSass 版
    • 複数のリセットCSS をパーシャルファイルにして使いまわす
    • 複数人で制作する場合は、各自のSass ファイルを用意する
    • CSS で制作したサイトをSass に切り替える
    • コメントを活用してソースをわかりやすくする
    • つねに同じ場所からモジュール用のSassファイルをインポートする
    • Sass はオブジェクト指向設計と相性がいい
  • 5-2 ブラウザ対応で使えるコーディングTips
    • Sass の意外な罠!? セレクタが4,095 個を超えるとIE9 以下で認識されない
    • Sass で使えるCSS ハックと使えないCSS ハック
    • @each を使ってベンダープレフィックスを自動で付与する
    • コラム:ベンダープレフィックスは必要か?
    • 面倒なCSS3 のアニメーション指定を簡単にする
    • IE の対応をしつつ「rem」を使ってフォントサイズを指定する
    • ブラウザのインスペクタでSass ファイルの位置(行数)を知る
  • 5-3 レイアウト・パーツで使えるコーディングTips
    • clearfix を@extend で活用する
    • @function を使ってpx 指定する感覚でフォントサイズを%指定する
    • 変数を使ってYUI の CSS Fonts を管理する
    • 変数を使って、サイドバーの幅を自動的に計算する
    • null で簡単に条件分岐をしてレイアウトをする
    • calc を使って全体の横幅からボーダーの横幅を簡単に計算する
    • @for を使って余白調整用のclass を生成する
    • リストマーカー用の連番を使ったclass 名を作成する
    • 連番を使ったclass 名のゼロパディング(0 埋め)をする
    • 変数と演算で opacity を使った簡易ロールオーバーを作成する
    • グローバルナビゲーションのCSS スプライトを作成する
    • 文字リンクカラーのミックスインを作る
    • 複数の値を@each でループし、ページによって背景を変更する
    • シンプルなグラデーションのミックスインを作る
  • 5-4 スマホ・マルチデバイスで使えるコーディングTips
    • スマホサイトでよく見る、リストの矢印をミックスインで管理する
    • Retina ディスプレイなど、高解像度端末の対応を楽にする
    • レスポンシブWeb デザイン対応で楽をするため、@content を活用する

ざーっとタイトル見てもらうと分かるかもしれませんが、4章までで機能を覚えても、「じゃあ実際にどうやって使えば良いんだろう?」ってなってしまうと、せっかく覚えた機能もうまく活かすことが出来ません。
そのため、5章では、実際のコーディング時に活用できそうなネタをいっぱい詰め込んでいます。

ここで載っているネタは、その殆どが実際にボクが仕事で使ってたりするんで、かなり実践向けだと思います。
これからはじめる方だけじゃなく、「少しSassを触ったけどイマイチ使いこなせてないなー」って感じてる方にも最適な内容になってるかなと思います。

そんなわけで、気になった方は、お近くの書店かAmazon等でご購入頂けると嬉しいです!

6章も結構頑張ってるんですが、6章に関してはSOUさんが近日中に書いてくれるはず!