Thoughtful CSS Architecture. Architecture: the complex or carefully designed structure of something Have you ever worked on a CSS project that gradually became a hot, sticky mess?
This isn't really a post about naming conventions, either. Instead, let's talk about what we're calling elements. Managing CSS Projects with ITCSS. More Transparent UI Code with Namespaces. When we work at scale, we often find that we spend a large amount of our time reading, maintaining, and refactoring existing code, rather than writing and adding new features.
This is the reason we focus so much on things like architectures, naming conventions, methodologies, preprocessors, scalability, etc.: because writing CSS is easy; looking after it is not. What we want is to be able to write code that is as transparent and self-documenting as possible. Transparency means that it is clear and obvious (to others) in its intent; self-documenting means that we don’t have to lose time to writing and reading lengthy, supplementary documentation. The need for this is particularly true when working with languages like HTML and CSS.
Necolas/idiomatic-css: Principles of writing consistent, idiomatic CSS. Conseils et bonnes pratiques. CSS Guidelines (2.2.5) – High-level advice and guidelines for writing sane, manageable, scalable CSS. Home · stubbornella/oocss Wiki.