HTML5

HyperText Markup Language
Extensão do arquivo	.htm, .html
MIME	text/html
Desenvolvido por	World Wide Web Consortium
Página oficial	html.spec.whatwg.org

HTML5 (Hypertext Markup Language, versão 5) é uma linguagem de marcação para a World Wide Web e é uma tecnologia chave da Internet, originalmente proposto por Opera Software. É a quinta versão da linguagem HTML. Esta nova versão traz consigo importantes mudanças quanto ao papel do HTML no mundo da Web, através de novas funcionalidades como semântica e acessibilidade. Possibilita o uso de novos recursos antes possíveis apenas com a aplicação de outras tecnologias. Sua essência tem sido melhorar a linguagem com o suporte para as mais recentes multimídias, enquanto a mantém facilmente legível por seres humanos e consistentemente compreendida por computadores e outros dispositivos (navegadores, parsers etc). O HTML5 será o novo padrão para HTML, XHTML, e HTML DOM. Atualmente, está em fase de esboço, porém diversos navegadores já implementam algumas de suas funcionalidades.

Após seus predecessores imediatos HTML 4.01 e XHTML 1.1, HTML5 é uma resposta à observação de que o HTML e o XHTML, de uso comum na World Wide Web, é uma mistura de características introduzidas por várias especificações, juntamente com aquelas introduzidas por software, tais como os navegadores, aqueles estabelecidos pela prática comum, e os muitos erros de sintaxe em documentos existentes na web. É, também, uma tentativa de definir uma única linguagem simples de marcação que possa ser escrita em HTML ou em sintaxe XHTML. Isso inclui modelos de processamento detalhados para incentivar implementações mais interoperáveis; isso estende, melhora e racionaliza a marcação disponível para documentos, e introduz marcações e interfaces de programação de aplicações (APIs) para aplicações web complexas. Pelas mesmas razões, HTML5 também é um candidato em potencial aplicações multi-plataforma móveis. Muitos recursos do HTML5 tem sido construídos com a consideração de ser capaz de executar em dispositivos de baixa potência como smartphones e tablets.

Em particular, HTML5 adiciona várias novas funções sintáticas. Elas incluem as tags de <video>, <audio>, <header> e elementos <canvas>, assim como a integração de conteúdos SVG que substituem o uso de tags <object> genéricas. Estas funções são projetadas para tornar mais fácil a inclusão e a manipulação de conteúdo gráfico e multimídia na web sem ter de recorrer a plugins proprietários e APIs. Outros novos elementos, como <section>, <article>, <header> e <nav>, são projetados para enriquecer o conteúdo semântico dos documentos. Novos atributos têm sido introduzidos com o mesmo propósito, enquanto alguns elementos e atributos têm sido removidos. Alguns elementos, como <a>, <cite> e <menu> têm sido mudados, redefinidos ou padronizados. As APIs e os modelos de objetos de documentos (DOM) não são mais pensamentos retrógrados, mas são partes fundamentais da especificação do HTML5. HTML5 também define com algum detalhe o processamento necessário para que erros de sintaxe de documentos inválidos sejam tratados uniformemente por todos os browsers e outros agentes de usuários em conformidade com o HTML5.

História

O Web Hypertext Application Technology Working Group (WHATWG) iniciou o trabalho do novo padrão HTML em 2004, quando o World Wide Web Consortium (W3C) estava se concentrando no futuro desenvolvimento do XHTML 2.0, e o HTML 4.01 não tinha sido atualizado desde 2001. Em 2009, o W3C decidiu que o Grupo de Trabalho do XHTML 2.0 deveria parar seus trabalhos, e assim, descontinuar o padrão. Desta forma o W3C e o WHATWG passaram a trabalhar juntas no desenvolvimento do HTML5.

O projeto do HTML5 foi bem recebido pelos desenvolvedores Web até então, e tornou-se tema na mídia em abril de 2010 depois que o CEO da Apple Inc., Steve Jobs emitiu uma carta pública intitulada "Reflexões sobre o Adobe Flash", onde ele conclui que o desenvolvimento do HTML5 tornaria o Adobe Flash desnecessário, tanto para assistir vídeo ou mesmo exibir qualquer conteúdo web. Isso provocou um debate entre os desenvolvedores Web, onde muitos sugeriram que, enquanto o HTML5 proporcionasse uma melhor funcionalidade, a variedade de browsers existentes exibiria páginas diferentes, tendo um resultado diferente em cada navegador e não se conseguiria de fato chegar a um padrão. No início de novembro de 2011 a Adobe anunciou que iria interromper o desenvolvimento de Flash para dispositivos móveis e redirecionar seus esforços para o desenvolvimento de ferramentas utilizando HTML5.

Descrição

No início de 2008 o W3C – consórcio de empresas de tecnologia que coordena os padrões da internet quanto a linguagem – anunciou a primeira especificação do HTML5. O HTML, responsável por organizar e formatar as páginas que visitamos na Internet, está em sua versão 4.0.1 e continua evoluindo. Após cinco anos de trabalho, desde 2008 está em fase de esboço, enquanto a versão final está prevista para 2014. Foram feitas grandes alterações, que incluem:

• Novas API’s, entre elas uma para desenvolvimento de gráficos bidimensionais
• Controle embutido de conteúdo multimídia
• Aprimoramento do uso offline
• Melhoria na depuração de erros

Esta evolução da linguagem padrão para web pode eliminar a necessidade de plug-ins para aplicações multimídia em navegadores. Diversos críticos consideram a tecnologia como um forte concorrente ao Flash, da Adobe, ao Silverlight, da Microsoft, e ao recente JavaFX, da Sun (Oracle). Recentemente, Shantanu Narayen, diretor executivo da Adobe, disse que o Flash não iria perder mercado, porém a versão 5 do HTML já está sendo chamada de "Flash-killer" (Assassino do Flash). Estas tecnologias precisarão se adaptar rapidamente para conseguir manter-se no mercado, tão populares quanto hoje. Na avaliação do co-diretor de ferramentas da Mozilla, Ben Galbraith, as tecnologias viabilizadas pelo HTML5 como o Canvas para desenhos 2D e o armazenamento de conteúdos no desktop, permitirão que "usemos mais o browser do que nunca".

Após dez anos sem atualizações, como se escreve páginas na internet passa por uma boa transformação. O HTML5 oferece uma experiência web totalmente diferente para usuários e embora exista um longo caminho para ser finalizado, muitos navegadores importantes, como Internet Explorer 9, Opera, Safari 4, Firefox 3.6 e Chrome já implementaram grandes partes da linguagem, incluindo tags de vídeo e suporte à tecnologia Canvas. Com a evolução da linguagem, os navegadores passam da categoria "mostradores" de páginas para um renderizador de "web software".

Assim como surgiram as app stores para aplicações nativas, existem appstores especificas para aplicações HTML5, os desenvolvedores podem utilizar a audiência das appstores para distribuir seu aplicativo e também fazer cobrança (as appstores oferecem integrações para permitir a cobrança). Como, por exemplo, a Zeewe, loja de apps HTML5 focada em smartphones.

Exemplos de código HTML5

Códigos para testes de HTML5:

<!DOCTYPE html>
<html lang="pt-BR">
  <head>
    <meta charset="UTF-8">
    <title>Teste de Página</title>
  </head>
  <body>
    <h5>Teste de página</h5>
    <p>Um teste de página</p>
    <p><i>Este texto está em itálico</i></p>
  </body>
</html>

Código HTML5 para reproduzir áudio sem a necessidade de plug-ins:

<!DOCTYPE html>
<html lang="pt-BR">
  <head>
    <meta charset="UTF-8">
    <title>Áudio em HTML5</title>
  </head>
  <body>
    <audio controls autoplay>
      <source src="audio.ogg">
      <!-- Mensagem explicando que o navegador não suporta áudio ou o formato usado. -->
      <p>Seu navegador não suporta áudio HTML5 ou o formato Opus.</p>
    </audio>
  </body>
</html>

Popularidade

De acordo com um relatório divulgado em 30 de setembro de 2011, 34% dos 100 melhores Web sites do mundo estavam usando HTML5– a adaptação foi liderada por mecanismos de busca e redes sociais. Em 20 de outubro de 2011, o Facebook anunciou o lançamento do Centro de Recursos HTML, dando aos desenvolvedores ferramentas para construir, testar e implementar aplicações para o Facebook.

Logo do HTML5

Logotipo do HTML5.

Em 18 de janeiro de 2011, a W3C introduziu uma logo para representar o uso de ou o interesse em HTML5. Diferente de outros emblemas anteriormente disponibilizadas pela W3C, esta não implica uma validação ou em uma conformidade com um certo padrão. Desde de o dia 1º de abril de 2011, este logotipo é oficial.

Quando foi inicialmente apresentado ao público, a W3C anunciou o logotipo HTML5 como uma "Identidade visual de propósito geral para um vasto conjunto de tecnologias web de código aberto, incluindo HTML5, CSS, SVG, Formato de Fonte Aberto (Open - de Código aberto) para Web (em inglês WOFF), e outros". Alguns defensores de padrões web, incluindo o The Web Standards Project (O Projeto de Padrões Web), criticaram a definição de "HTML5" relatando este como um termo guarda-chuva, apontando para a falta de nitidez da terminologia e o potencial para o desentendimento. Três dias depois, a W3C respondeu à comunidade e alterou a definição do logotipo, retirando certas definições de tecnologias associadas a linguagem. A W3C então disse que o logotipo "Representa o HTML5, a pedra angular para aplicações web modernas".

Novos elementos do HTML5

O HTML5 introduziu novos elementos:

Elemento	Definição
<article>	Define um artigo em um documento
<aside>	Define um conteúdo, a parte, do conteúdo da página
<bdi>	Define um texto que pode ser formatado em diferentes direções
<details>	Define detalhes adicionais que o usuário pode ver ou ocultar
<dialog>	Define uma caixa de diálogo ou janela
<figcaption>	Define uma legenda para um elemento <figure>
<figure>	Define um conteúdo como ilustrações, diagramas, fotos, códigos, listagens, etc.
<footer>	Define o rodapé do documento ou seção
<header>	Define um cabeçalho para o documento ou uma seção
<main>	Define o conteúdo principal de um documento
<mark>	Define um texto marcado ou realçado
<menuitem>	Define um commando/menu que pode ser usado para invocar um menu popup
<meter>	Define uma medida escalar dentro de uma faixa conhecida
<nav>	Define links de navegação no documento
<progress>	Define o progresso de uma tarefa
<rp>	Define o que exibir em navegadores que não exibem anotações ruby (anotações ruby são para mostrar a pronúncia de caracteres do Leste Asiático.)
<rt>	Define a pronúncia de um caractere (para tipografias do Leste Asiático)
<ruby>	Define uma anotação ruby (para tipografia do Leste Asiático)
<section>	Define uma seção no documento
<summary>	Define um título visível para um elemento <details>
<time>	Define uma data/hora
<wbr>	Define uma possível quebra de linha
<datalist>	Lista opções predefinidas para controles inputs
<keygen>	Define um campo de gerador de par de chaves (para formulários)
<output>	Define o resultado de um cálculo
<canvas>	Define um desenho gráfico usando JavaScript
<svg>	Define um desenho gráfico usando SVG
<audio>	Define um conteúdo de som ou música
<embed>	Define um contêiner para aplicações externas (como plug-ins)
<source>	Define fonte para <video> e <audio>
<track>	Define faixas para <video> e <audio>
<video>	Define conteúdo de vídeo ou filme

Ver também

• Cascading Style Sheets
• Canvas (HTML5)
• HTML
• JavaScript
• WebGL

Bibliografia

• Rob Crowther, Joe Lennon, Ash Blue, Greg Wanish, HTML 5 Em Ação, ano 2014, Editora Novatec, ISBN 978-85-7522-399-4
• Eric Freeman, Elisabeth Robson, Use a Cabveça! Prograamção em HTML5, ano 2014, Editora Alta Books, ISBN 978-85-7608-845-5

Ligações externas

• «Sítio oficial» (em inglês) 
• «Estruturando a web com HTML». Guia na MDN Web Docs