Usando CSS moderno para criar estruturas de marcação mais limpas
Por Rafael Dantas
Slide 2
Slide 2 text
@raffaeldantass
@valleweb
rafa-dantas.com.br
Slide 3
Slide 3 text
Problemas que tínhamos antigamente na marcação
Marcação não era muito declarativa
As necessidades dentro da web evoluíram muito rápido
HTML/CSS/JS não estavam acompanhando
Resultado?
Marcações muito inchadas
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
No content
Slide 6
Slide 6 text
COM FLEXBOX
Slide 7
Slide 7 text
COM FLEXBOX
Slide 8
Slide 8 text
COM CSS GRID
Slide 9
Slide 9 text
COM CSS GRID
Slide 10
Slide 10 text
Comparações entre as formas desenvolvidas
Relembrando o layout proposto
Slide 11
Slide 11 text
HTML
Slide 12
Slide 12 text
CSS
Slide 13
Slide 13 text
E o que concluimos?
Através do exemplo, foi possível escrever menos código
De maneira mais semantica
Auxiliando na performance, manutenção, acessibilidade
Resultado?
Mais fácil de entender, mais rápido pra desenvolver
Slide 14
Slide 14 text
@raffaeldantass
OBRIGADO!
Segue a gente!
@valleweb
rafa-dantas.com.br