html 5 a evolução do html 4 para o html 5
Post on 17-Dec-2014
5.764 Views
Preview:
DESCRIPTION
TRANSCRIPT
VISÃO GERAL
TIMELINE HTML
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
MARKUP
HYPERTEXTO
MARKUP
O começo e a interoperabilidade
MARKUP
MARKUP
- WHAT Working Group- O HTML5 e suas mudanças
MARKUPO HTML5 e suas mudanças
O Que e o HTML 5?
MARKUP
SAIA DO ANTIGO CLUBE
ESQUECA OS PLUGINS
A morte eminente- Ou foram- Ou estão- Ou serão
TESTE NOVOS SUPER PODERES
Entre para a Liga
Comparati vo EstruturalHTML 4 X HTML 5
Comparati vo EstruturalHTML 4 X HTML 5
MARKUP
Análise do suporte e estratégias de uso nos navegadores
- O desenvolvimento modular- Motores de Renderização- Compatibilidade com HTML5
MARKUP
O Desenvolvimento modular
MARKUPNavegadores e Seus Motores
MARKUPMotor de Renderização WEBKIT
Navegadores - Safari - Google - Chrome
MARKUPMotor de Renderização GECK
Navegadores - Firefox - Mozilla - Camino
MARKUPMotor de Renderização TRIDENT
Navegadores - Internet Explorer 4 a 9
MARKUPMotor de Renderização PRESTO
Navegadores - Opera 7 ao 10
MARKUPCompatibilidade com HTML 5
MARKUPTécnicas de Detecção com Modernizr
JavaScript utilizando Modernizr com método de GêoLocalização
FORMULÁRIOS
Novos tipos de input
• tel • search • url• email• datetime• date• month• week• time
• range• color• number
FORMULÁRIOS• Email – com atributo multiple
Cc <label>: <input type=email multiple name=cc> </ label>
FORMULÁRIOS• Date Time
FORMULÁRIOS
Validação de formulários
• O novo atributo pattern <input name="CEP" id="CEP" required pattern="\d{5}-?\d{3}" />
• Novalidate• Formvalidate• Oninput• setCustomValidity
ÁUDIO E VÍDEOVÍ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
ÁUDIO E VÍDEOO 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
ÁUDIO E VÍDEOPRINCIPAIS CODECS DE VÍDEO
H.264
Ogg Theora
WebM
ÁUDIO E VÍDEOVÍDEO
TAG
<video src="u.ogv" width="400" height="300" />
ATRIBUTOS
Poster, Preload, Autoplay, Mediagroup, Loop, Muted, Controls, Width, Height.
ÁUDIO E VÍDEOÁ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>
ÁUDIO E VÍDEOPRINCIPAIS CODECS DE ÁUDIO
WAV
MP3
Ogg Vorbis
A nova geração de aplicações web II
A nova geração de aplicações web II
MICRODATA
A nova geração de aplicações web II
MICRODATA
Exemplo 2
A nova geração de aplicações web II
A nova geração de aplicações web II
HISTÓRICO DE SESSÃO
API STORAGE
A nova geração de aplicações web II
APLICAÇÕES OFFLINE
Exemplo 1
A nova geração de aplicações web II
APLICAÇÕES OFFLINE
Exemplo 2
A nova geração de aplicações web II
UNDOMANAGER
top related