SEO, Semântica & HTML5 - Palestra do Road Show TI 2012 - Fábio Flatschart
Semântica HTML5
-
Upload
wilson-montelo -
Category
Technology
-
view
136 -
download
0
Transcript of Semântica HTML5
SEMÂNTICA HTML5
WILSON MONTELODEV FRONT-END
MUITO ANTES DE INICIAR
PROJETO
HOME PAGE
DESING RESPONSIVO
SISTEMAS DE GERENCIAMENTO DE CONTEÚDO
- CONTROLE DE VERSÃO
- PRÉ PROCESSADORES
- SEO
- PERFORMACE
SERVE PARA QUE A
WEB?
INFORMAÇÃO Informação varia conforme o indivíduo, as necessidades
e o contexto em que é produzida e compartilhada.
EXISTE ALGUMA
LÓGICA?
COMO ORGANIZAR?
LINEARRelativo ou que apresenta a disposição de linha
NÃO LINEARNão linear refere-se a todas as estruturas que não
apresentam um único sentido.
ONDE TUDO COMEÇA?
HTMLMAISZOQUÉ ?
LINGUAGEM DE MARCAÇÃO
DE HIPERTEXTO
O QUE É HIPERTEXTO?1.Apresentação de informações escritas, organizada de
tal maneira que o leitor tem liberdade de escolher
vários caminhos.
2.Elemento (palavra, expressão ou imagem) é destacado e,
quando acionado (ger. mediante um clique de mouse ),
provoca a exibição de um novo hipertexto com informações
relativas ao referido elemento; hipermídia.
LINKS A palavra link pode significar hiperligação, ou seja, uma
palavra, texto ou imagem que quando é clicada pelo
usuário, o encaminha para outra página na internet
SEMÂNTICA
O QUE SIGNIFICA UMA
DIV?
<div id=’’header’’>
<div id=’’nav’’>
</div>
</div>
<!-- fim header -->
<div id=’’main’’>
<div id=’’noticias’’>
</div>
</div>
<!-- fim main -->
<div id=’’sidebar’’>
</div>
<!-- fim sidebar -->
<div id=’’footer’’>
</div>
AS NOVAS TAGS
header
nav
article
section
aside
footer
main
address
<header>
<nav>
</nav>
</header>
<!-- fim header -->
<main>
<article>
</article>
</main>
<!-- fim main -->
<aside>
</aside>
<!-- fim aside -->
<footer>
<address>
</address>
</footer>
HTML FEITO PARA SER
PORTÁTIL