Chapter 4. CSS and HTML – SMACSS, OOCSS and Semantics

In this chapter we'll talk about some CSS and HTML concepts which are vital to a good Sass workflow. While Sass exists to simplify writing CSS, it won't teach you the concepts that makes clean, scalable, reusable CSS. For that, you need to understand some basic concepts and methodologies such as BEM, OOCSS, SMACSS, and Atomic Design.

We'll look at some of the downsides of using CSS frameworks such as Bootstrap and Foundation. Frameworks such as these are not semantic and can often make your HTML and CSS bloated and rigid, making projects harder to maintain if the design changes.

We'll examine what makes HTML semantic and why this is something beneficial. Semantics will allow for cleaner markup, ...

Get Mastering Sass now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.