HTML5: Estrutura básica e novos elementos

O HTML5, nova versão do HTML (HyperText Markup Language ou Linguagem de marcação de hipertexto) que passou anos sem atualizações, foi produzido pelo WHATWG (Web Hypertext Application Technology Working Group) juntamente com o W3C (World Wide Web Consortium) e, ao contrário das versões anteriores, fornece ferramentas para CSS e JavaScript.
Essa nova versão traz melhorias com novas funcionalidades como semântica e acessibilidade, e traz como principais mudanças mais tags para substituir scripts, independência de plataforma e redução da necessidade de plugins externos..

Imagem

Estrutura básica

O HTML5 continua praticamente com a mesma estrutura das versões anteriores, sendo a única exceção uma mudança na escrita do Doctype.
O Doctype (ou “declaração de tipo de documento”) ficou muito mais simples, já que não é mais necessário espeficiar qual versão do HTML está sendo utilizada no documento, isso agora fica a critério do Browser:

Doctype para HTML 4.01:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
http://www.w3.org/TR/html4/strict.dtd”&gt;

Doctype para HTML5:

<!DOCTYPE html>

Há também uma meta tag para especificar o charset:

Meta tag utilizada nas versões anteriores:

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>

Meta tag utilizada no HTML 5:

<meta charset=”UTF-8″>

Novos elementos

Uma das principais mudanças em relação as versões anteriores é a introdução de tags semânticas, dispensando o uso de “div”.

<header> – define uma introdução ao documento.

<nav> – define uma seção de navegação. Se você possuir botões Anterior
e Próximo no seu documento, deve ser inserido dentro da tag <nav>.

<section> – define uma nova seção genérica no documento.

<article> – define conteúdo externo. Pode ser uma notícia, artigo, texto
qualquer ou qualquer outro conteúdo.

<aside> – é utilizado para representar conteúdo que está relacionado com outro
conteúdo dentro de um contexto (<article>). Um exemplo fácil
para assimilação são as citações. Se há uma citação em um
texto que deve ser destacado, pode-se utilizar o <aside> para
destacar certa frase ou citação. Fora do contexto ele é
interpretado como conteúdo secundário, não relacionado com o
conteúdo em questão.

<footer> – define um rodapé do documento. Geralmente contém nome do autor, data que foi escrito o documento etc.

Imagem

A nova versão do HTML também tem um avanço na programação de vídeos, que, com a inclusão de tags para objetos multimídias, dá suporte para a reprodução de áudio e vídeo e torna descenessário a instalação de plugins externos.

Fontes:

http://odesenvolvedor.andafter.org/publicacoes/html5-meta-charset_1892.html

http://www.joomlapro.com.br/blog/47-html5-estrutura-basica

http://imasters.com.br/artigo/16050/desenvolvimento/estrutura-do-html5/

http://idgnow.uol.com.br/internet/2009/06/16/html-5-conheca-a-linguagem-que-vai-revolucionar-sua-navegacao-na-web/

http://vinteum.com/html5-doctype/

http://www.tecmundo.com.br/navegador/2254-o-que-e-html-5-.htm

http://www.tecmundo.com.br/flash/4587-quais-as-vantagens-do-html5-para-o-usuario-comum-.htm

http://pt.wikipedia.org/wiki/HTML5

http://www.devmedia.com.br/as-novidades-do-html5/23992

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s