Markup
  - Visão geral do HTML5
  - Análise do suporte atual pelos navegadores e estratégias de uso
  - Estrutura básica, DOCTYPE e charsets
  - Modelos de conteúdo
  - Novos elementos e atributos
  - Elementos modificados e ausentes
HYPERTEXTO
O começo e a interoperabilidade
- WHAT Working Group
- O HTML5 e suas mudanças
O HTML5 e suas mudanças
O Que e o HTML 5?
A morte eminente
- Ou foram
- Ou estão
- Ou serão
Entre para a Liga
HTML 4 X HTML 5
HTML 4 X HTML 5
Análise do suporte e estratégias de uso nos navegadores

       - O desenvolvimento modular
       - Motores de Renderização
       - Compatibilidade com HTML5
O Desenvolvimento modular
Navegadores e Seus Motores
Motor de Renderização WEBKIT

Navegadores
- Safari
- Google
- Chrome
Motor de Renderização GECK

Navegadores
- Firefox
- Mozilla
- Camino
Motor de Renderização TRIDENT

Navegadores
- Internet Explorer 4 a 9
Motor de Renderização PRESTO

Navegadores
- Opera 7 ao 10
Compatibilidade com HTML 5
Técnicas de Detecção com Modernizr

 JavaScript utilizando Modernizr com
 método de GêoLocalização
Novos tipos de input
  •tel                 •range
  •search              •color
  •url                 •number
  •email
  •datetime
  •date
  •month
  •week
  •time
• Email – com atributo multiple

        Cc <label>: <input type=email multiple name=cc> </ label>
• Date Time
Validação de formulários
  • O novo atributo pattern <input name="CEP" id="CEP" required
  pattern="d{5}-?d{3}" />

  • Novalidate
  • Formvalidate
  • Oninput
  •setCustomValidity
VÍDEO       <video src=“teste.mp4" width="400" height="300" />



 Controle embutido (NATIVO) de conteúdo multimídia

 HTML 5 e a morte do Flash (Carta de Steve Jobs)

 A guerra dos Codecs
O QUE É CODEC?

  EXEMPLO:
     Infelizmente não poderei estar no horário combinado porque
     apareceu uma situação de emergência para resolver. Eu te ligo
     quando chegar em casa.

 CODIFICADO
     nflzmnt Ñ Pdr stR N Hrr Cmbnd Pq prc 1 Stçõ D mrgnc P RslvR. T Lg Qd
    ChgR m Cs
PRINCIPAIS CODECS DE VÍDEO

  H.264

 Ogg Theora

 WebM
VÍDEO

 TAG

 <video src="u.ogv" width="400" height="300" />

 ATRIBUTOS

 Poster, Preload, Autoplay, Mediagroup, Loop, Muted, Controls, Width, Hei
 ght.
ÁUDIO
  TAG

 <audio src="mus.oga" controls="true" autoplay="true" />

 EXEMPLO

 <audio controls="true" autoplay="true">
  <source src="mus.oga" />
  <source src="mus.mp3" />
  <source src="mus.wma" />
 </audio>
PRINCIPAIS CODECS DE ÁUDIO
  WAV

  MP3

  Ogg Vorbis
A nova geração de aplicações web II

MICRODATA
MICRODATA

Exemplo 2
HISTÓRICO DE SESSÃO

   API STORAGE
APLICAÇÕES OFFLINE

Exemplo 1
APLICAÇÕES OFFLINE

Exemplo 2
UNDOMANAGER

HTML 5 A evolução do HTML 4 para o HTML 5