Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
CSS moderno para Web Semântica
Search
Rafael Dantas
November 28, 2018
0
36
CSS moderno para Web Semântica
Apresentação feita no 7 Masters sobre semântica na web.
Rafael Dantas
November 28, 2018
Tweet
Share
More Decks by Rafael Dantas
See All by Rafael Dantas
O estado do CSS em 2019
raffaeldantass
1
200
CSS animations under the hood
raffaeldantass
0
51
Leve seu CSS para o futuro
raffaeldantass
0
16
Houdini e o futuro mágico do CSS
raffaeldantass
1
210
Dismistificando o CSS Grid Layout
raffaeldantass
0
120
Houdini e o Futuro das CSS
raffaeldantass
1
460
Dismistificando o CSS Grid Layout
raffaeldantass
1
53
Featured
See All Featured
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Context Engineering - Making Every Token Count
addyosmani
3
140
The Language of Interfaces
destraynor
162
25k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
RailsConf 2023
tenderlove
30
1.2k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
Transcript
Usando CSS moderno para criar estruturas de marcação mais limpas
Por Rafael Dantas
@raffaeldantass @valleweb rafa-dantas.com.br
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
None
None
COM FLEXBOX
COM FLEXBOX
COM CSS GRID
COM CSS GRID
Comparações entre as formas desenvolvidas Relembrando o layout proposto
HTML
CSS
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
@raffaeldantass OBRIGADO! Segue a gente! @valleweb rafa-dantas.com.br