OOCSSObject Oriented CSS

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

BRUNO MENDESFront End Developer

@bruno2ms

CURVA DE APRENDIZAGEM PARA ENTENDER O ESTILO

ARQUIVOS DE ESTILO

GIGANTES

NOVAS ESTRUTURAS SENDO CRIADAS A TODO

MOMENTO.

MUITAS MÃOS PARA DEFINIR O VISUAL DE UM

ÚNICO SISTEMA.

TODOS POSSUEM AUTONOMIA DE DECIDIR

O QUE CRIAR DE NOVO

MUITOS PADRÕES, E NENHUM PADRÃO

REUSABILIDADE DE CÓDIGO QUASE

INEXISTENTE

DOIS PRINCÍPIOS BÁSICOS

1 -SEPARAÇÃO DA ESTRUTURA E DO VISUAL

2 -SEPARAÇÃO DO "CONTAINER" EM RELAÇÃO AO CONTEÚDO

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

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)

SASS PODE RESOLVER O PROBLEMA!

ME PERGUNTE COMO USA!

@BRUNO2MS THE SASS EVANGELIST

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/