Webinario Online

1

Introducción a HTML5

Docente: Gabriel Falcone

2 Webinario Online //

Un poco de historia

1989 – HTML 1.0, World Wide Web

1993 – HTML+

1994 – Se crea W3C

1995 – HTML 3.0

1997 – HTML 4.0

2004 – Comienza HTML 5.0

2014 – HTML 5.0 es oficial

3 Webinario Online //

Pero… ¿qué es HTML5?

4 Webinario Online //

Pero… ¿qué es HTML5?

5 Webinario Online //

Pero… ¿qué es HTML5?

6 Webinario Online //

Novedades en HTML5

Nuevos elementos estructurales

Nuevos elementos multimedia

Nuevos elementos gráficos

Mejoras en el manejo de formularios

Nuevas APIs

7 Webinario Online //

Nuevos elementos estructurales

<div class="header">...</div>

<header>...</header>

<div class="aside">...</div>

<aside>...</aside>

8 Webinario Online //

Nuevos elementos estructurales

9 Webinario Online //

Nuevos elementos multimedia

<video width="400" controls> <source src=http://www.w3schools.com/html/mov_bbb.mp4 type="video/mp4"> </video>

http://jsbin.com/cogifo/edit?html,output

10 Webinario Online //

Nuevos elementos gráficos

<svg height="140" width="500"> <ellipse cx="200" cy="80" rx="100" ry="50" style="fill:yellow;stroke:purple;stroke-width:2"/> </svg>

https://jsbin.com/gezane/edit?html,output

11 Webinario Online //

Nuevos elementos gráficos

<canvas id="myCanvas" height="140" width="500"></canvas> <script> var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.beginPath(); ctx.ellipse(200, 80, 100, 50, 0, 0, Math.PI*2); ctx.fillStyle='yellow'; ctx.fill(); ctx.strokeStyle='purple'; ctx.lineWidth = 2; ctx.stroke(); </script>

https://jsbin.com/hikiwu/edit?html,output

12 Webinario Online //

Mejora en el manejo de formularios

https://jsbin.com/bizeda/edit?html,output

13 Webinario Online //

Nuevas APIs

Geolocation

Web Storage

File

Cache

WebSockets

History

IndexedDB

https://jsbin.com/kesalu/edit?html,output

https://jsbin.com/niqoju/edit?html,output

14 Webinario Online //

¿Cómo es el curso?

•Videos y material de lectura

•Cada uno a su propio ritmo

•Una unidad por semana

•Reuniones virtuales con el instructor

•Actividades a realizar

15 Webinario Online //

¿Dónde obtengo más información?

http://www.sceu.frba.utn.edu.ar/e-learning/cursos-a-distancia/Certificaciones-

IT/Microsoft/MCSD-Web-Applications/MCSD-3A-70%E2%80%93480-

Programming-in-HTML5-with-JavaScript-and-CSS3/temario.html

16 Webinario Online //

¿Dónde obtengo más información?

http://bit.ly/1UE3Ywt

17 Webinario Online //

Muchas gracias