terça-feira, 20 de setembro de 2011

O que é e como usar o HTML5

Logo HTML5HTML significa HyperText Markup Language e está presente nas páginas da internet, apesar de não serem vista pelo usuário, o HTML consiste em estruturar seu layout e renderizar o código. O HTML trabalha com tags, que são marcações em inglês para inserção de elementos e organização hierárquica do código fonte, tornando essa linguagem a mais simples e de fácil memorização.

Depois de 10 anos, foi lançado pela W3C (Word Wide Web Consortium)  a nova versão do HTML, o HTML5. Essa quinta geração do HTML promete deixar sua página mais rápida e mais organizada.

O que há de novo?

Novos recursos e tags foram implantadas no HTML5 para facilitar e simplificar a vida do programadores. Entre elas estão:

<header> - Indica o cabeçalho da página
<section> - Indica uma secção da página.
<aside> - Colunas (“Sidebars”)
<nav> - menu de navegação
<article> - Início de um bloco
<footer> - Indica o rodapé da página
<canvas> - Inserção de Gráficos
<audio> - Inserção de sons

Estrutura HTML5

A maneira de Inserir um vídeo na página será tão fácil quando inserir uma imagem, que na versão do HTML 4.1 requeria uma linha de código de maior.

Qual a vantagem de usar o HTML5?

Além da vantagem da possibilidade de inserção de aplicativos de uma forma mais fácil, o HTML5 tem também como foco, deixar seu código fonte mais organizado, e consequentemente deixa-lo mais leve tornando o carregamento da sua página bem mais rápida.

Mas outra coisa que o HTML5 será muito vantajoso é que se você tem toda estrutura do seu código bem organizada, facilitara e muito na parte de indexação de conteúdo do seu site nos motores de busca. Isso ocorre por conta da novas tags que indicam o que é um cabeçalho, o que é um rodapé, um bloco, um título e tudo mais. Isso facilitará a interpretação dos sites de busca.

E mais outra vantagem é a compatibilidade. Muitas vezes quando lançamos um novo código em nosso HTML, dificilmente todos os navegadores irão renderiza-lo igualmente, causando a incompatibilidade entre os browsers. Mas a W3C, desenvolvedora do HTML, conta com ajuda  e suporte das principais comunidades de desenvolvimento de Browsers, possibilitando a realização de testes, bem como: Internet Explorer, Mozilla Firefox, Chrome, Opera e Safari. Creio que depois de 22 anos do HTML ser inventado, todos os navegadores irão renderizar os códigos igualmente.

Como começo a usar?

Para começar. o HTML5 não será automaticamente implantando no seu HTML como mágica. Sendo assim, a modificação terá que ser manualmente. Lembrando que para deixar seu HTML no formato HTML5, não precisa começar do 0.  Então veja a baixo como começar a criar uma página em HTML5.

Primeiro começamos inserindo o DOCTYPE que indica o tipo de documento, que por sua vez sofreu uma grande modificação, repare:

HTML4

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

No HTML5

<!DOCTYPE html>

Como você pôde perceber, o HTML5 dispensa o uso de toda aquela enorme parte que acompanha o DOCTYPE, como a parte que indica a linguagem.

Então basicamente para começar a criar uma página em HTML, é necessário a seguinte estrutura:

<!DOCTYPE HTML>
<html lang="pt-br">

<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title>Elementos e Estrutura HTML 5</title>
</head>

<body>

<header>...</header> <!-- Define o Cabecalho –>

<nav>...</nav> <!-- Menu ou navegação do site –>
<article> <!-- Define a composição do formulario, textos, etc. –>
<section> ... </section> <!-- Define um determinada elemento, podendo conter um header e também um footer por exemplo –>
</article>

<aside>...</aside> <!-- Tende conter as principais informações do conteudo do site, podendo se ter o que for de maior importancia –>
<footer>...</footer> <!-- Defini o rodape do seu layout –>

</body>
</html>

Este trecho de código eu achei no bygiovanni que mostra claramente como deve ser uma página em HTML5.

Bom, é isso ai que tenho pra compartilhar com vocês, espero ter ajudado aqueles que ainda tinham dúvidas. Mas agora eu pergunto, você acha que o HTML5 veio pra fazer a diferença?

Marcadores: , , ,

1 Comentários:

Às 26 de outubro de 2011 18:05 , Blogger Micael Souza disse...

Legal, o HTML veio pra facilitar a nossa vida.

 

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial