OOCSS (Object Oriented CSS) is a methodology for writing scalable and reusable CSS code. It involves separating CSS into modular blocks or "lego blocks" that can be mixed and matched to build pages. This avoids CSS bloat and makes the code more flexible and maintainable. Key principles include separating container styles from content, using classes instead of element names, making elements extensible with grids, and building pages from the available CSS components.
25. More info OOCSS framework - https://github.com/stubbornella/oocss/ Nicole Sullivan’s blog - http://www.stubbornella.org/ Slideshare - http://www.slideshare.net/stubbornella OOCSS.org - http://oocss.org/ Me: Twitter: @drewjford Email: andrew@andrewford.co.nz
Hinweis der Redaktion
Hi I’m Andrew Ford, I’m a Team leader and UI Developer at Cucumber. On Feburay the 13th I attended a workshop at Webstock calledCSS of the future – Building with Object Orientated CSS. It was run by Nicole Sullivan. She’s worked for the likes of Facebook, Yahoo, Box.net and salesforce.
So you have a large site, with tons of pages and multiple layouts'. Your constantly adding new features, updating old ones, getting multiple people to work on the site who are less familiar with it so on and so on. What happens to your CSS?
You end up with bloat and a poor performing website.
This happened to Facebook. Before Nicole started helping them they had 700 css files, they had 1.9mb of CSS. Prime example of massive CSS gone wrong in about 2007.
With Massive sites you have to be an expert of the site to modify or add to the css
Each feature or module you add the CSS grows
Do you guys know what a specificitybomb is? It’s were you keep adding elements to your styling so no one else on the team can override it.
We make a 1:1 relationship of the CSS and the modules we create soon enough we’ve doubled or tripled the size of the CSS, and were struggling to make changes due to all the bugs we create.