7 days of unlimited WordPress themes, plugins & graphics - for free!* Unlimited asset downloads! Start 7-Day Free Trial
FREELessons: 20Length: 1.9 hours

Next lesson playing in 5 seconds

  • Overview
  • Transcript

4.1 What We’ve Learned

You’ve reached the end of this course! Let me give you a quick recap of what you've learned.

We've covered the basics of SMACSS, and how to categorise the CSS rules in the five categories. We've looked at base rules, which refer to default document styling, and why they're the first thing you should start on when styling a page.

After that we covered the second category—layout—and the things it contains, and then on to the third category: modules. When you think about modules, think of the components that you can reuse: buttons, widgets, banners and so on. The fourth category is state rules. These will describe the various states of the modules or the layouts. Finally, there’s theme rules. These are very useful when creating themes or skins for your webpage.

On top of that, we also talked about a key concept called depth of applicability. What you need to learn from this is to always minimise the number of levels when using selectors.

That was all the theory part. In the other half of the course I showed you a practical exercise—how to rewrite the HTML and CSS of a webpage according to the SMACSS way. So, hopefully you’ve learned something new.