Review: Zurb Foundation Training: Using Sass



Zurb the makers of the awesome Foundation responsive framework, offers several training courses. The course was ~2 hours long. The actual Zurb engineers that work on Foundation teach the class.

  • I really appreciated that time was spent on how to use SASS by itself.
  • If you spend a lot of times reading the SASS docs and are consider yourself an intermeidate user, it may not be worth your time
  • The best part of the course is the access to the Zurb engineers. Their insight in the class chat and Q&A was awesome!

Here’s my notes:

Part 1: Introduction to Sass

Compass was not dicussed.

Example shown used the sass ruby gem exclusively.

Part 2: Using Sass in Foundation

Use @extend in place of @include wherever possible to reduce code bloat as @extend combines selectors * mixins if you need variables, arguments; extend doesn’t


  • rems aren’t used in foundation because of lack of wide support in browsers; similar functionality already available with ems
  • off-canvas layout can be used in 4. untested by zurb. will be supported in future versions as a primary part of foundation.
  • Typography
    • modular scale no longer included. Can still be used.
    • typekit, etc: no recommendations
  • When to use symantic classes when prototyping to deployment?
    • start immediately vs presentational classes at start
    • Rapid prototype: use both
    • Optimize: remove presentation classes, apply mixins to semantic classes
    • Really depends on your own design process

The Breakdown

Comments are closed.