When I decided to rewrite my personal website I quickly threw the CSS together. I wanted to achieve a few key things:
- I wanted a website, rather than perfect code.
- I didn't care about IE (or Firefox) and wanted to use CSS3 flexible box model (everywhere).
- I'd use Kaizen principals to refactor my website as I went.
So, I'm getting started on point 3.
I've been reading a book called SMACSS by Jonathan Snook. SMACSS stands for scalable and modular architecture for CSS. As described by Jonathan, it's not really a framework, but more of a style guide for implementing css. The book is well written and concepts are demonstrated through clear examples.
So while the CSS output hasn't changed a lot, my understanding of the code has improve dramatically. As has the readability of the code.
I'm using SCSS and have separated my files like so:
- styles-flexbox.scss (main file)
- reset.css (eric myer's reset)
I have no idea if Jonathan's intention was to split the files like I have (I'm still reading), but it has really helped me to pick up the concepts of the book.
Alright... I'm off now. I'm going to refactor my CSS a little more.