html5

21
Cristian Porras – [email protected] William García – [email protected] Comunidad Universitaria de Software Libre, Cusol UIS

Upload: ricardo-andres-collante-villalobos

Post on 12-Jun-2015

820 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Html5

Cristian Porras – [email protected] García – [email protected]

Comunidad Universitaria de Software Libre, Cusol UIS

Page 2: Html5

Contenido

HTML y su historia Aplicaciones Ricas de Internet y

HTML Inconvenientes de la dependencia en

tecnologías privativas/propietarias HTML5 Novedades Ejemplos Enlaces

Page 3: Html5

HTML y su historia HTML es un estándar para la

estructuración y presentación de contenidos en la World Wide Web.

Permite dotar de formato enriquecido documentos de texto.

HTML se pensócomo un lenguajesencillo.

Page 4: Html5

HTML y su historia

A medida que ha ido avanzando la web la implementación inicial de HTML se fue quedando corta.

Con esta evolución gradual se han agregado etiquetas poco a poco, por ejemplo <font>

Debido a la guerra entre navegadores se ha tenido especial énfasis en el seguimiento de HTML como estándar

Page 5: Html5

HTML y su historia

1991 HTML 1994 HTML 2 1996 CSS 1 + JavaScript 1997 HTML 4 1998 CSS 2 2000 XHTML 1 2002 Maquetación web sin tablas 2005 AJAX 2009 HTML 5

Page 6: Html5

Aplicaciones Ricas de Internet (RIAs) y HTML

El desarrollo de Aplicaciones Enriquecidas para Internet, tradicionalmente se ha apoyado en el uso de tecnologías privativas no estandarizadas que debilitan la neutralidad e interoperabilidad de la red.

La tecnología más usada es Adobe Flash, que fue creada para suplir las falencias de la actual implementación de HTML/XHTML.

Otras tecnologías usadas son Java, ActiveX y Silverlight.

Page 7: Html5

Inconvenientes de la dependencia en tecnologías privativas/propietarias

Su naturaleza cerrada, que no responde a una entidad neutral como por ejemplo el W3C

Problemas de rendimiento por su implementación en algunas plataformas.

La necesidad de instalar plug-ins o extensiones de terceros, con posibles riesgos de seguridad.

Poca usabilidad. No son estándares.

Page 8: Html5

HTML5

HTML5 ~= HTML + CSS + JavaScript APIs

El objetivo principal de esta

nueva revisión es reducir la

necesidad de usar complementos

y tecnologías propietarias en la

web. El desarrollo de este estándar es

regulado por el consorcio W3C

(World Wide Web Consortium).   

Page 9: Html5

HTML5

La web 1.0 se basó en el formato de sus contenidos.

La web 2.0 se basa en la experiencia del usuario. Separa presentación de contenido.

La web 3.0 buscará dotar de sentido y significado a los contenidos. 

Page 10: Html5

HTML5

La web 2.0 y el uso de divs

Page 11: Html5

HTML5

La web 3.0 intenta dar sentido al contenido

Page 12: Html5

Novedades en HTML5

Define un solo lenguaje llamado HTML5 el cual puede ser escrito en sintaxis HTML y en sintaxis XML.

Define los modelos detallados de procesamiento para fomentar las implementaciones interoperables.

Mejora el etiquetado en los documentos. Introduce etiquetas y APIs para

paradigmas emergentes, tales como el de las Aplicaciones Enriquecidas para la web.

Page 13: Html5

Novedades en HTML5

Elementos Eliminados Acronym Applet Basefont Big Center Dir Font frame

Frameset Isindex Noframes Noscript S Strike Tt u

Page 14: Html5

Novedades en HTML5

Elementos nuevos Article Aside Dialog Figure Footer Header Nav Section Details Datagrid Datalist

Audio Video Canvas

Page 15: Html5

Estado actual de implementaciónSegún tests realizados en http://www.html5test.com/

●Firefox 3.6.10 139/300●Firefox 4beta6 204/300●Chromium 6.0.472.59 217/300●Chromium 7beta 231/300●Opera 10.62 159/300●Internet Explorer 8 27/300●Internet Explorer 9beta 96/300●Safari 5.0.2 165/300

Page 16: Html5

Ejemplos

Canvas

http://www.chromeexperiments.com/detail/ball-pool/ http://www.chromeexperiments.com/detail/gravity/ http://www.chromeexperiments.com/detail/monster/ http://www.chromeexperiments.com/detail/sketchpad/ http://www.zynaps.com/jslab.xml?id=envmap

Page 17: Html5

Ejemplos

Audio y Video

http://people.mozilla.com/~prouget/demos/DynamicContentInjection/play.xhtml

Page 18: Html5

Enlaces

http://dev.w3.org/html5/spec/spec.html Actual Borrador de las especificaciones del

estándar.

http://dev.w3.org/html5/html-design-principles/ Principios del diseño de HTML5

http://html5demos.com/ Demostraciones y ejemplos

Page 19: Html5

Enlaces

http://www.canvasdemos.com/ Demostraciones del elemento Canvas.

http://slides.html5rocks.com/ Presentación que implementa algunas

novedades de HTML5

Page 20: Html5

Preguntas

Page 21: Html5

¡Gracias!

Cristian Porras – [email protected] García – [email protected] Universitaria de Software Libre, Cusol

UISGlobal TICs S.A.S.

Esta presentación se encuentra bajo la licencia Creative Commos Atribución – Compartir igual: Puede ser distribuida, copiada y exhibida por terceros dando créditos a los autores originales. Se permiten obras derivadas que tienen que estar bajo los mismos términos de licencia que el trabajo original.