Home

Object Oriented CSS

How do you scale CSS for millions of visitors or thousands of pages? Nicole first presented Object Oriented CSS at Web Directions North in Denver. Since then, the response has been overwhelming. OOCSS allows you to write fast, maintainable, standards-based front end code. It adds much needed predictability to CSS so that even beginners can participate in writing beautiful websites.

If you find this project useful, you can…

Two main principles

1. Separate structure and skin
2. Separate container and content

Getting Started

1. Download all the files and set up a local directory
2. Open template.html (this is the basic template you will modify to create all other pages).
3. Set your left and right column widths by extending the column objects
4. Use grids to break the page up further into smaller sections.
5. Test your site functionality by adding content objects from the content.css file. These can also be found in library.html.

Ready for alpha testing

Please help me test the talk bubble objects. Put them through their paces and let me know if you manage to break them! Add feature requests under the “issues” tab.

• Tabs – very experimental
• Talk Bubbles
• Content Objects – particularly media

Stable

• Module
• Template
• Grids

Base Libraries

OOCSS is built on top of reset and fonts from the YUI libraries. These libraries provide a common starting point across different navigators.

• Reset and Fonts from YUI are a starting point.

Upcoming

• Content objects
• DHTML blocks (tabs, carousel, toggle, etc)

Thanks!

I’ve had the good fortune to work/study/play with some amazing developers, engineers, managers, designers, and visionaries over the years. All of them contributed in different ways to shaping my ideas about how CSS should be built and maintained. Many many thanks to Arnaud Gueras, Florian Harmel, Sebastian Tiphaine, Yann Doussot, Thomas Vial, Adrien Thery, Sebastien Cardif, Thomas Vergnaud, Etienne Bernard, Yannick Bonnieux, Renaud Boyerand, Matt Sweeney, Nate Koechley, Leslie Jensen-Inman, Philip Tellis, Stoyan Stefanov, Robin Garner, Kevin Michel, Christophe Dubois, Orphelie Dudemaine, Medhi El Azmi, Christophe Charles, Eric Prudhommeaux, Mark Mason, Tenni Theurer, Steve Souders, Jennifer Le Hegaret, Praveen P N, Doug Crockford, Nicholas Zakas, Mark Norman Francis, Christian Heilmann, Jenny Han Donnelly, Tom Croucher, Brian Rountree, Ryan Grove, Philippe Mihelic, Stephanie Troeth, Nick Fogler, Gonzalo Cordero and the other Jukus, and Dan Cederholm and his book bulletproof. I’m sure I’ve forgotten some… deepest apologies.

“If you can’t be a good example, then you’ll just have to serve as a horrible warning.”

Catherine Aird