Chris Peters's Blog

Sass and CSS style guide

September 8, 2014

Authoring Sass and CSS still feels like the old days: talk to 10 different web designers, and you’ll hear 10 different ways of organizing your front-end code. This is a good thing and a bad thing: we all can do what works best for each project, yet the web design community at large is certainly not on the same page on how to best do things.

Over the past few months, I have been working on my own Sass and CSS style guide.

Like everything in the Playbook, I plan on refining and sharing improvements as I learn and improve my craft.

Selected tools and processes

As of 2014, these are the tools and processes that I prefer to work with:

It seems like everyone I talk with who nerds out about front end code subscribes to newer methodologies like BEM and OOCSS, but I find many of them to be too cumbersome and verbose. I find the much simpler SMACSS to be good enough for my purposes.

Check out my full Sass and CSS style guide for more info:

  • Tools
  • Folder structure
  • Asset manifest files
  • General formatting

If you’re looking for more ideas on how to construct your own style guide, I found these 2 blog posts to be interesting:

Happy coding!

Written by Chris Peters, your friendly neighborhood digital marketing professional with over 20 years of experience of web design, programming, SEO, and marketing.