O documento discute Object Oriented CSS (OOCSS), um método para estruturar arquivos CSS de forma modular e reutilizável. Ele descreve problemas comuns em CSS como arquivos gigantes, muitas estruturas sendo criadas, e falta de padronização. O documento propõe dois princípios básicos: separar estrutura e visual, e separar conteúdo de container. Ele também recomenda criar uma biblioteca de componentes reutilizáveis para novas páginas.

1. OOCSSObject Oriented CSS
* Sim, esta é a mesma imagem que todo mundo usa pra explicar isso.

2. BRUNO MENDES
Front End Developer
@bruno2ms

3. CURVA DE
APRENDIZAGEM PARA
ENTENDER O ESTILO

4. ARQUIVOS DE ESTILO
GIGANTES

5. NOVAS ESTRUTURAS
SENDO CRIADAS A TODO
MOMENTO.

6. MUITAS MÃOS PARA
DEFINIR O VISUAL DE UM
ÚNICO SISTEMA.

7. TODOS POSSUEM
AUTONOMIA DE DECIDIR
O QUE CRIAR DE NOVO

8. MUITOS PADRÕES, E
NENHUM PADRÃO

9. REUSABILIDADE DE
CÓDIGO QUASE
INEXISTENTE

10. DOIS PRINCÍPIOS
BÁSICOS
1 -SEPARAÇÃO DA ESTRUTURA E DO
VISUAL
2 -SEPARAÇÃO DO "CONTAINER" EM
RELAÇÃO AO CONTEÚDO

13. CRIE UMA BIBLIOTECA DE
COMPONENTES
NOVAS PÁGINAS DEVEM SER CRIADAS À PARTIR DA
BIBLIOTECA
NÃO DEVE SER NECESSÁRIO CRIAR NOVOS ESTILOS
PARA A PÁGINA
CRIE MODULOS E REUTILIZE-OS
REVISITE SUA BIBLIOTECA E NUNCA CRIE ALGO
NOVO SEM ANTES CRIAR UM COMPONENTE PARA
SEU SISTEMA

15. PROBLEMAS (OU NÃO)
SEPARATION OF CONCERNS (SEPARAÇÃO DE
PREOCUPAÇÕES)
MUDANÇAS FUTURAS DO LAYOUT NÃO SE LIMITAM
AO CSS
MUDANÇAS FUTURAS DO LAYOUT NÃO SE LIMITAM
AO CSS (APESAR DE NUNCA TEREM SE LIMITADO :P)
EXIGE CUIDADO E DEDICAÇÃO DE TODOS (TODOS
SÃO RESPONSÁVEIS)

16. SASS PODE
RESOLVER O
PROBLEMA!
ME PERGUNTE COMO USA!
@BRUNO2MS THE SASS EVANGELIST

17. LINKS
HTTP://WWW.SLIDESHARE.NET/STUBBORNELLA/
OBJECT-ORIENTED-CSS/
HTTP://WWW.SMASHINGMAGAZINE.COM/2011/12/12/
AN-INTRODUCTION-TO-OBJECT-ORIENTED-CSS-
OOCSS/
HTTP://TABLELESS.COM.BR/OOCSS-OU-CSS-DO-
JEITO-CERTO/