Palestra html5 e CSS3
•
4 likes•878 views
Uma demosntração de como o html5 e o css3 vão mudar a cara da web e de como esses recursos já podem ser utilizados !!!
Recommended
Recommended
More Related Content
Viewers also liked
Viewers also liked (16)
Similar to Palestra html5 e CSS3
Similar to Palestra html5 e CSS3 (20)
Recently uploaded
Recently uploaded (8)
Palestra html5 e CSS3
- 1. Novos horizontes e oportunidades com Emiliano Barreto @ebarreto contato@emilianobarreto.com.br
- 2. HTML 5 ....PORQUE, ONDE, COMO E QUANDO ?
- 7. NEGÓCIOS ONLINE MUITAS EMPRESAS DESCOBRIRAM QUE A INTERNET
- 8. Enxurrada de informações e serviços
- 12. Tudo tem que ser mais fácil
- 13. Tudo tem que ser mais acessível
- 16. PENSE MULTI
- 22. E quem vai acessar o seu site ? • Somente quem estiver no pc / windows com internet explorer ????
- 23. Que tal o HTML 5 ????
- 24. Apresentando HTML 5.0 É A MAIS NOVA ATUALIZAÇÃO DA LINGUAGEM HTML
- 25. Porque aprender a desenvolver utilizando HTML 5.0 ???
- 26. Motivos para aprender • Mercado – sair na frente, pois ainda faltam profissionais com esse conhecimento • Mais poder e recursos no HTML • Conteúdo acessível de vários dispositivos e plataformas
- 27. Principais Características • Web Semantica - <header><footer><section><nav><aside> • Melhorias com css 3 – Animações / @FontFace ; media; transform; transitions • Multimídia – Vídeos e Audio • SVG / Canvas • Web Apps – Web Storage, etc • GeoLocation • 3D ( Web GL)
- 28. Estrutura do HTML 5 <!DOCTYPE html> <html lang=“en”> <head> <title></title> <meta charset=“utf-8”> </head> <body> </body> </html>
- 29. Estrutura do HTML 5 <header id="topo"> topo do site</header> <nav id="menu"> menu do site</nav> <section id="conteudo"> area de conteúdo do site</section> <footer id="rodape"> rodapé </footer>
- 30. Estrutura do HTML 5.0
- 32. Gráficos ricos e dinâmicos • Audio & Video • Canvas • Open GL • SVG 1.1 – Formas Básicas – Paths – Text – Transforms – Gradientes – Preenchimentos padrões • 3D
- 36. Video Tag <video src=“videos/video.mp4” id”myVideo” preload=“auto” type=“video/mp4”> </video>
- 39. Border radius
- 42. Transitions
- 43. @Media
- 46. @Media
- 49. GEO LOCATION
- 50. Já posso utilizar esses recursos ?
- 51. Pode sim mais antes.... Adequação e necessidade para cada projeto Polyfills – modernizr.com Shims Google - http://code.google.com/p/html5shiv/
- 52. Calma calma......Pode sim mais antes.... Adequação e necessidade para cada projeto Polyfills – modernizr.com Shims Google html
- 53. Calma calma......Pode sim mais antes.... Adequação e necessidade para cada projeto Polyfills – modernizr.com Shims Google html
- 54. Calma calma......Pode sim mais antes.... Adequação e necessidade para cada projeto Polyfills – modernizr.com Shims Google html Dados de maio/11 – by netmarketingshare
- 56. Market share dos navegadores • Ie 6 • Ie 8 • Firefox • Chome • safari
- 57. E o Flash morreu ?????
- 58. Opss......
- 59. Tabela de recursos e navegadores – percentual de aceitação dos padrões html 5 • Firefox 50% • Chome 70% • IE • Rock melt • Safari • Opera
- 60. Faltam elementos a serem concluidos <device> - microfone e cameras
- 61. Novos horizontes e possibilidades
- 62. HTML 5.0 E CSS 3.0 Novos horizontes e oportunidades Obrigado Emiliano Barreto contato@emilianobarreto.com.br @ebarreto