10 Best Practices for Improving Your CSS

Building scalable and manageable stylesheets

Ferenc Almasi
8 min readMay 12, 2020
10 CSS Best Practices for building scalable and manageable stylsheets

CSS may seem like a pretty straightforward language, on that’s hard to make mistakes in. You just add your rules to style your website and you’re done, right? With small sites that require only a couple of CSS files, this might be the case. But in large applications, styles can quickly spiral out of control. How do you keep them manageable?

The reality is that, just as with any other language, CSS has its own nuances that can make or break your design. Here are 10 tips for CSS — best practices that can help you bring out the best from your styles.

1. Do You Really Need a Framework?

First of all, decide whether you really need to use a CSS framework. There are now many lightweight alternatives to robust frameworks. Usually, you won’t be using every selector from a framework, so your bundle will contain dead code.

If you’re only using styles for buttons, outsource them to your own CSS file and get rid of the rest. Also, you can identify unused CSS rules using code coverage in DevTools.

--

--

Ferenc Almasi

💻 Frontend dev • ✍️ Creator of webtips.dev • 🐦 Tweets at @WebtipsHQ