HTML5 Rocks

HTML5 Rocks

HTML5 Features

Semântica

Semântica é um dos recursos que mais se destacam na Plataforma da web em comparação com outras plataformas de aplicativos. Os desenvolvedores geralmente ignoram ou deixam de priorizar esse recurso, mas saber usá-lo pode trazer muitos benefícios para nossos projetos.

A web é um texto e os textos têm significado. Em última análise, o conteúdo que nossos navegadores leem é texto puro. Os sites e aplicativos da web foram criados em um ecossistema onde o conteúdo baseado em texto pode ser vinculado, pesquisado e misturado. No cenário da web aberta, nosso conteúdo pode ser exibido, alimentado e reelaborado por terceiros, mecanismos de pesquisa e ferramentas de acessibilidade. Todos esses benefícios têm um preço. As ferramentas automatizadas só podem fazer metade do trabalho de reconhecer a natureza do conteúdo. Quanto melhor o trabalho do desenvolvedor em marcar a semântica correta do conteúdo, mais fácil será para o restante dos agentes lidar com ele. O HTML5 fornece uma série de ferramentas para facilitar também a vida dos desenvolvedores:

  • Novos elementos de mídia.
  • Novos elementos estruturais.
  • Nova semântica para a internacionalização.
  • Novos tipos de relação de links.
  • Novos atributos
  • Novos tipos de formulário.
  • Nova sintaxe de microdados para semântica adicional.

O que há de novo

Demos

Google Rich Snippets Testing Tool
Input form types for mobile
New form types demo
HTML5 <progress> and <meter> tags

In the Wild

Check any wordpress blog source code to see how their templates use new link relations like: next, prev, tag, bookmark, search, etc
Check how the reviews in The Telegraph are using validated schema.org microdata in their source code.
Apple is one of the few big brands using new HTML5 elements (nav, article, footer, etc) on their main site.

Resources