html5

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

  • É 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.

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> e <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
Permite a delegação da evolução do JavaScript para threads em segundo plano, permitindo que essas atividades sejam prevenidas e assim não deixando as interações dos eventos lentas.
XMLHttpRequest level 2
Permite buscar de forma assíncrona algumas partes da página, permitindo apresentar na tela conteúdo dinâmico, variando de acordo com o tempo e ações do usuário. Está é a tecnologia por trás do Ajax.
Motor JIT-compiling para JavaScript
A nova e poderosa geração de motores JavaScript é muito mais poderosa, levando para uma maior performance.
History API
Permite a manipulação do histórico do navegador. Isso é especialmente útil para páginas que carregam novas informações interativas.
O atributo contentEditable: Transforme seu website em uma wiki!
O HTML5 padronizou o atributo contentEditable. Saiba mais sobre este recurso.
Arrastar e soltar
A API do HTML5 permite suportar o recurso de arrastar e soltar (dragging and dropping) items dentro e entre sites da web. Isso também fornece uma simples API para fazer o uso de extensões e aplicações baseadas na Mozilla.
Foco de gestão em HTML
O novo HTML5 activeElement e hasFocus são atributos suportados.
Manipuladores de protocolos beseados na web
Agora você pode registrar aplicações web com manipuladores de protocolos utilizando o método thenavigator.registerProtocolHandler().
requestAnimationFrame
Permite o controle de animações de renderização para obter a performance ideal.
API Fullscreen
Controla o uso de toda a tela para uma página web ou aplicação, sem mostrar a interface de UI do navegador.
API bloqueio de ponteiro
Permite o bloqueio do ponteiro para o conteúdo, para jogos e aplicações semelhantes para não perder o foco quanto o ponteiro atinge o limite da janela.
Eventos online e offline
A fim de construir uma boa aplicação web offline, você precisa saber quando sua aplicação é realmente offline. Aliás, você também precisa saber quando sua aplicação foi retornada por um status online novamente.

Acesso à dispositivos

Usando a API da câmera
É permitido o uso, manipulação, e armazenar imagens através câmeras dos computadores.
Eventos touch
Manipuladores para reagir a eventos criados por um usuário ao pressionar em telas sensíveis ao toque (touch screens).
Utilizando geolocalização
Deixa que os navegadores localizem a posição do usuário utilizando a geolocalização.
Detectando a orientaçåo do dispositivo
Coleta a informação quando o dispositivo em que o browser está rodando muda sua orientação de tela. Isto pode ser utilizado como um dispositivo de entrada (por exemplo, para fazer jogos que utiliza à posiçao do dispositivo) ou para adaptar o layout de uma pagina para a orientaçao da tela (vertical ou horizontal).
Pointer Lock API
Permite que o cursor fique limitado às medidas do conteúdo da aplicação, assim, jogos e outras aplicações não perdem o foto quando o cursos ultrapassa os limites do conteúdo.

Estilização

CSS foi estendido para ser capaz de estilo elementos de uma forma muito mais complexa. Sua extensão, também conhecido como CSS3, mas, como o CSS não segue uma especificação padrão, alguns módulos podem não estar necessariamente na versão 3,. Alguns estão na versão 3 e outros até na 1. Chamar de CSS3 é apenas uma convenção.

Novas caracteristicas dos estilos de background
Agora é possível determinar uma sombra à um elemento, usando a propriedade box-shadow e também podemos definir diversos backgrounds para um elemento.
More fancy borders
Também é possível utilizar imagens para estilizar bordas, usando a propriedade border-image. Bordas arredondadas são suportadas através da propriedade border-radius.
Animating your style
Utilizando transition para animar diferentes estágios de determinadas propriedades ou usando animation para animar trechos da página sem precisar usar o JavaScript com algum evento vinculado, permitindo total controle sobre movimentação de elementos.
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. Eles podem controlar text-overflow e hyphenation, mas tambem pode adicionar um shadow a ele ou controlar mais precisamente a sua decorations. Tipos de letras personalizadas podem ser baixadas e aplicadas gracas a nova@font-face at-rule.
Novos layouts de apresentaçoes
A fim de melhorar a flexibilidade dos modelos, foram adicionados, dois novos esquemas: o CSS multi-column layouts e CSS flexible box layout.