Esta tradução está incompleta. Ajude atraduzir este artigo.

HTML5 é a mais recente evolução do padrão que define o HTML. O termo representa dois diferentes conceitos:

  • É uma nova versão da linguagem HTML, com novos elementos, atributos, e comportamentos
  • e um conjunto maior de tecnologias que permite o desenvolvimento de aplicações e web sites mais diversos e poderosos. Este conjunto é chamado HTML5 & friends e muitas vezes abreviado apenas como HTML5.

Criada para ser utilizável por todos os desenvolvedores da Web Aberta, essa página de referências faz ligações a inúmeros recursos do HTML5, classificados em diversos grupos, baseando-se em suas funções;

  • Semântica: permite você descrever mais precisamente o seu conteúdo.
  • Conectividade: permite uma comunicação com o servidor de formas modernas e inovadoras.
  • Offline e armazenamento: Permite que páginas web armazenem dados localmente do lado do cliente e opere de forma offline mais eficientemente.
  • Multimídia: Viabiliza a utilização de áudio e vídeo de forma primorosa na Web Aberta.
  • Gráficos e efeitos 2D/3D: viabiliza um leque diversificado de opções de representação gráfica. 
  • Performace e integração: fornece grande otimização de velocidade e melhor utilização do hardware do computador.
  • Acesso ao dispositivo: viabiliza a utilização de diversos métodos e dispositivos de entrada e saída.
  • Estilização: permite aos autores a escrita de temas mais sofistificados.

 

 Semântica 

Seções e estruturas em HTML
Uma visão geral sobre as novas estruturas e novos elementos de seção do HTML5: <section>, <article>, <nav>, <header>, <footer> e <aside>
Utilizando áudio e vídeo com HTML5
Os elementos <audio> e <video> incorporam e permitem manipulação de novos conteúdos multimídia. 
Formulários em HTML5 
Uma visão geral sobre as melhorias dos formulários web com o HTML5: a API de validação de restrição, novos valores para o atributo type dos <input> e o novo elemento <output>.
Novos elementos semânticos
Seções laterais, mídia e elementos de formulário: há diversos novos elementos, como <mark>, <figure>, <figcaption>, <data>, <time>, <output>, <progress>, ou <meter> e <main>, incrementando o montante de elementos válidos do HTML5.
Melhorias no <iframe>
Usando os atributos sandbox, seamless, e srcdoc , autores podem ser precisos sobre o nível de segurança e a renderização desejada de um elemento <iframe>.
​MathML
Viabiliza a inserção direta de fórmulas matemáticas no código HTML5.
Introdução ao HTML5
Este artigo introduz como indicar para o navegador que você está usando HTML5 em sua página ou aplicação web. 
HTML5 parser compatível
O parser, que torna os bytes de um HTML em DOM, foi extendido e agora define precisamente o comportamento em todos os casos, mesmo quando se depara com código HTML inválido. Isso viabiliza uma grandiosa previsibilidade e interoperabilidade entre navegadores compatíveis com o HTML5.

Conectividade

Web Sockets
Permite a criação de uma conexão permanente entre a página e o servidor para que estes possam trocar dados através desta ligação.
Eventos do servidor
Permite que o servidor envie eventos para um cliente, ao contrário do paradigma clássico onde o servidor pode enviar apenas dados em resposta às requests do cliente.
WebRTC
WebRTC (Comunicação em tempo real), permite conexões entre usuários e controle de videoconferência diretamente no browser, sem necessidade de um plugin ou aplicação externa.

Offline e armazenamento

Recursos offline: cache de aplicação
Firefox possui suporte completo às especificações dos recursos offlines do HTML5. A maioria dos outros navegadores suportam apenas parte deste recurso.
Eventos online e offline

Firefox 3 dá suporte aos eventos WHATWG online e offline, o que permite que aplicações e extensões percebam quando há conexão de Internet, assim como permite a detecção das oscilações de conexão. 

WHATWG 
Sessão client-side e armazenamento persistente permite que aplicações web armazenem dados de forma estruturada no lado do cliente.
IndexedDB
É um padrão web para armazenamento de quantidades significativas de dados estruturados no navegador e para alta performace de busca nestes dados, usando índices.
Uso de arquivos de aplicações web
Foi adicionado ao Gecko o suporte à nova API de arquivos do HTML5, tornando possível o acesso de arquivos locais pelas aplicações. Isso inclui suporte para seleções de múltiplos arquivos usando <input> do novo tipo file do HTML5. Há também o FileReader.

Multimídia

Utilizando áudio e vídeo com HTML5
Os elementos <audio><video> incluem e permitem a manipulação de novos conteúdos multimídia.
WebRTC
Permite conexões entre usuários e controle de videoconferência diretamente no browser, sem necessidade de um plugin ou aplicação externa.
API da câmera
Permite o uso, manipulação e armazenamento de uma imagem diretamente da câmera do computador.
Track e WebVTT
O elemento <track> permite legendas e capítulos. WebVTT é o formato de texto do track <track>.

Gráficos e efeitos 3D

Canvas
Aprenda sobre o novo elemento <canvas> e como utilizá-lo para desenhar gráficos e objetos no Firefox.
API de texto para <canvas>
O elemento <canvas> agora dá suporte à  API de texto do HTML5.
WebGL
WebGL traz gráficos 3D à Web, introduzindo uma API que se aproxima bastante à OpenGL ES 2.0, que pode ser usada em elementos <canvas>.
SVG
Um formato de imagens vetoriais baseada em XML que pode ser diretamente embutido no HTML5.

Performance e integração

Web Workers
Allows delegation of JavaScript evaluation to background threads, allowing these activities to prevent slowing down interactive events.
XMLHttpRequest level 2
Allows fetching asynchronously some parts of the page, allowing it to display dynamic content, varying according to the time and user actions. This is the technology behind Ajax.
JIT-compiling JavaScript engines
The new generation of JavaScript engines is much more powerful, leading to greater performance.
History API
Allows the manipulation of the browser history. This is especially useful for pages loading interactively new information.
The contentEditable Attribute: Transform your website to a wiki!
HTML5 has standardized the contentEditable attribute. Learn more about this feature.
Drag and drop
The HTML5 drag and drop API allows support for dragging and dropping items within and between web sites. This also provides a simpler API for use by extensions and Mozilla-based applications.
Focus management in HTML
The new HTML5 activeElement and hasFocus attributes are supported.
Web-based protocol handlers
You can now register web applications as protocol handlers using thenavigator.registerProtocolHandler() method.
requestAnimationFrame
Allows control of animations rendering to obtain optimal performance.
Fullscreen API
Controls the usage of the whole screen for a Web page or application, without the browser UI displayed.
Pointer Lock API
Allows locking the pointer to the content, so games and similar applications don't lose focus when the pointer reaches the window limit.
Online and offline events
In order to build a good offline-capable web application, you need to know when your application is actually offline. Incidentally, you also need to know when your application has returned to an online status again.

Acesso à dispositivos

Using the Camera API
Allows using, manipulating, and storing an image from the computer's camera.
Touch events
Handlers to react to events created by a user pressing touch screens.
Using geolocation
Let browsers locate the position of the user using geolocation.
Detecting device orientation
Get the information when the device on which the browser runs changes orientation. This can be used as an input device (e.g., to make games that react to the position of the device) or to adapt the layout of a page to the orientation of the screen (portrait or landscape).
Pointer Lock API
Allows locking the pointer to the content, so games and similar application don't lose focus when the pointer reaches the window limit.

Estilização

CSS has been extended to be able to style elements in a much more complex way. This is often referred as CSS3, though CSS is not a monolithic specification any more and the different modules are not all at level 3: some are at level 1 and others at level 4, with all the intermediate levels covered.

New background styling features
It is now possible to put a shadow to a box, using box-shadow and multiple backgrounds can be set.
More fancy borders
Not only it is now possible to use images to style borders, using border-image and its associated longhand properties, but rounded borders are supported via theborder-radius property.
Animating your style
Using CSS Transitions to animate between different states or using CSS Animationsto animate parts of the page without a triggering event, you can now control mobile elements on your page.
Typography improvement
Authors have better control to reach better typography. They can control text-overflow and hyphenation, but also can add a shadow to it or control more precisely its decorations. Custom typefaces can be downloaded and applied thanks to the new@font-face at-rule.
New presentational layouts
In order to improve the flexibility of designs, two new layouts have been added: theCSS multi-column layouts and CSS flexible box layout.

 

(Alguns outros artigos relacionados com HTML5.)

Introdução ao HTML5

Introdução ao HTML5
Este artigo introduz como utilizar HTML5 no desenho de site ou de sua aplicação.

Elementos do HTML5

Lista de tags / elementos do HTML5
Esta página contém uma tabela com todos os elementos (tags) baseado no rascunho atual das especificações do HTML5.
Utilizando audio e video
Adicionando suporte aos elementos do HTML5 <audio> e <video> ao Firefox 3.5.
Formulários em HTML5
Veja as melhorias para formulários web em HTML5: a API de validação de restrição, vários novos atributos, novos valores para <input> atributo type e os novo elemento <output>.
Seções e esboços em HTML5
Veja os novos elementos para delinear e seccionar em HTML5: <section>, <article>, <nav>, <header>, <footer>, <aside> and <hgroup>.
O elemento <mark>
Este elemento é usado para marcar em destaque um texto de especial relevância.
O elemento <figure> e <figcaption>
Este elemento permite adicionar figuras e ilustrações, com uma eventual legenda, colocado abaixo do texto principal.

Suporte Canvas

Tutorial Canvas
 Apreda sobre o novo elemento <canvas> e como desenhar gráficos e outros objetos no Firefox.
HTML5 API texto para elemento <canvas>
HTML5 API texto agora é suportado pelo <canvas>.

Recursos de aplicações web

Recursos Offline
O Firefox suporta completamente as especificações de HTML5 para  recurso offline. A maioria dos outros navegadores tem algum nível de suporte aos recursos offline.
Eventos online e offline
O Firefox 3 suporta WHATWG eventos online e offline, que permitem que aplicações e extensões detectem se há ou não uma conexão ativa com Internet, bem como detecta quando a conexão conecta e desconecta.
Sessão WHATWG do lado cliente e armazenamento persistente (aka DOM Storage)
A sessão do lado cliente e o armazenamento persistente permitem que as aplicações web armazenem dados estruturados no lado  cliente.
O atributo contentEditable: transforma seu website em um wiki!
O HTML5 tem um atributo padronizado contentEditable. Saiba mais sobre este recurso.
Usando arquivos de aplicações web
Suporta para a nova HTML5 API de arquivo foi adicionada ao Gecko, tornando possível as aplicações web para acessarem arquivos locais selecionados pelo usuário. Isso inclui suporte para selecionar vários arquivos usando o novo elemento HTML <input> do type arquivo de multiplos atributos.

Recursos DOM

getElementsByClassName
O método getElementsByClassName no Document e Element nodes são suportados. Estes métodos permitem encontrar elementos de uma classe ou de uma lista de classes.
Arrastar e soltar
A HTML5 API drag and drop permite suporte para arrastar e soltar itens dentro e entre web sites. Isto também proporciona uma API simples para uso de extensões e aplicativos baseados em Mozilla.
Foco na gestão do HTML
Os novos activeElement e hasFocus são atributos suportados pelo HTML5..
Manipuladores de protocolo baseado em web
Agora você pode registrar uma aplicação web como um manipulador de protocolo usando o método  navigator.registerProtocolHandler().

HTML parser

O Gecko é compatível com HTML5 parser—que transforma os bytes de documento HTML em um DOM—foi ativado por padrão a partir de maio de 2010. (Note que a versão do HTML5 parser que foi incluída no Gecko 1.9.2 / Firefox 3.6 tem bastante erros e não é recomendado para uso real.)

Alterações adicionais

  • localName e namespaceURI em documentos HTML agora  se comportam como em documentos XML: localName retorna em minúsculas e  namespaceURI para elementos HTML é "http://www.w3.org/1999/xhtml"
  • Quando a URI da página muda o identificador de fragmento de documento (a parte depois do caracter "#" (hash)), um novo evento hashchange é enviado para a página. Veja window.onhashchange para mais informação.
  • Suporte para element.classList para facilitar o manuseio de atributo de classe.
  • evnto de documento pronto document.onreadystatechange  e document.readyState são propriedades suportadas.
  • Cores em atributos de apresentação são interpretados de acordo com o HTML5.

Tecnologias muitas vezes chamado de parte do HTML5 que não são

Estas são muitas vezes consideradas em conjunto com um uso amplo termo de "HTML5", mas não são realmente parte do W3C HTML5 Spec.

Veja também

Alterações nas versões do Firefox que afetam os desenvolvedores da Web:

 

Etiquetas do documento e colaboradores

 Última atualização por: macalha,