todo sobre html5

Download Todo sobre HTML5

Post on 18-Nov-2014

8.151 views

Category:

Technology

3 download

Embed Size (px)

DESCRIPTION

Conceptos Fundamentales sobre HTML5: - Definición - Historia - Etiquetas Nuevas - Etiquetas Eliminadas - Doctype - Etiqueta HTML - Encabezado - La Codificación - Nueva Organización del Sitio - Incorporar Video - Otras Características - Validación de HTML5 - Soporte De Los Navegadores - Referencias

TRANSCRIPT

  • 1. Andrs Felipe Montoya Ros re.vu/AndresMontoya @montoya118
  • 2. HTML5 es una combinacin de nuevas etiquetas de markup (lenguaje) HTML, propiedades CSS3, JavaScript y algunas tecnologas complementarias de apoyo, pero que tcnicamente son independientes de la propia especificacin HTML5.
  • 3. La familia HTML5 incluye las nuevas etiquetas y tecnologas como: CSS3 Geolocalizacin Almacenamiento Web (Web Storage) Web Workers Web SocketsTodas ellas suponen una actualizacin de gran potencia al conjunto de herramientas ya existente, y con ellas se pueden crear pginas web ms sofisticadas y tiles.
  • 4. HTML4 se dio en 1998 Los diseadores y desarrolladores lo han utilizado por muchos aos, combinndola con CSS y JavaScript para mayor funcionalidad Continuando con la evolucin de la Web, se comenz con XHTML1.0 el cual era ms estricto y ms valorado por los desarrolladores
  • 5. En 2004 se cre el grupo WHATWG (Web Hypertext Application Technology Working Group) integrado por representantes de fabricantes de navegadores y desarrolladores webSu misin consista en crear una especificacin de lenguaje HTML mejor, orientada a crear un nuevo tipo de aplicaciones web pero manteniendo la compatibilidad con las versiones en activo de los navegadores existentes.
  • 6. Durante unos dos aos y medio el W3C y el grupo WHATWG trabajaron en paralelo y de manera independiente En 2006, Tim Berners-Lee, creador de la World Wide Web y fundador del W3C, anunci que el W3C y WHATWG trabajaran juntos en la elaboracin del estndar. Como resultado de ello, se abandon el desarrollo de XHTML 2.0 y la especificacin HTML 4.0 se reform con el nombre HTML5.
  • 7. No obstante, conviene recordar que HTML5 empez siendo Web Applications 1.0, y eso nos da una pista muy clara para entender para qu fue diseado realmente HTML5. Gracias a que el W3C tom el liderazgo para el desarrollo de HTML5, ahora los desarrolladores tenemos la garanta de que HTML5 ser realmente un estndar gratuito y con las suficientes garantas de no incurrir en problemas de propiedad intelectual.
  • 8.
  • 9.
  • 10. El DOCTYPE, tambin llamado DTD, sirve para indicar al navegador a qu reglas de escritura obedece el cdigo fuente de la pgina Html o Xhtml. En ausencia de un doctype el navegador no sabe segn qu reglas debe procesar la pgina. Se conforma con acogerse a reglas genricas para renderizar a toda costa la pgina Html. Doctype Antes: Ahora:
  • 11. La etiqueta indica al navegador que se trata de un documento Html. La etiqueta puede incluir el atributo lang="es. Especifica que el documento est en lengua espaola. Esta informacin es muy valiosa para los motores de bsqueda como Google y para los programas de sntesis de voz usados por personas con dificultades visuales. Quedara algo as: ...
  • 12. En la etiqueta Script cambia de la siguiente manera:Por:
  • 13. En la etiqueta Style, usada para los css, quedara de la siguiente manera:Por:
  • 14. El juego de caracteres determina la forma en que los caracteres de un alfabeto se convierten en bytes en un archivo informtico (y viceversa).Con HTML 4.0:Con HTML 5.0:
  • 15. La etiqueta es para la informacin de la cabecera (logo, texto introductorio...) para los mens de navegacin y para organizar los contenidos principales,
  • 16. para los contenidos secundarios, como anotaciones laterales o espacios publicitarios para incluir la informacin a pie de web (ao, autor, informaci n legal, etc.).
  • 17. Antes de la llegada de HTML5 dependamos del uso de complementos instalables, como Flash, QuickTime o Silverlight para poder mostrar contenidos de vdeo. Con HTML5 se resuelve esta necesidad ya que especifica un elemento HTML llamado que funciona de manera nativa en el navegador y se integra con Javascript.
  • 18. Algunos atributos de la etiqueta: Autoplay: sirve para que el video comience automticamente. Controls: activa los controles de reproduccion del video. Poster: permite poner una imagen antes de reproducir el video. Una vez comience, la imagen desaparece. Width, Height: permite definir un tamao para el video Ejemplo:
  • 19. Existen otras caractersticas importantes, que pueden consultar en las referencias que se encuentran al final, las cuales son mas complejas. Estas son: Drag&Drop Canvas Geolocalizacin
  • 20. Las ventajas de un cdigo fuente perfecto y por tanto de la validacin son: Comprensin y verificacin en profundidad de Html5 por parte de programadores iniciados (y avanzados). Asegurar que la pgina se mostrar siempre de forma correcta en la mayora de los navegadores. Una pgina invlida puede llevar a los navegadores a interpretarla de forma muy distinta. Demostracin de su propia capacidad y profesionalidad a la hora de realizar un cdigo de calidad, conforme a los estndares de Html5. Los programas de sntesis vocal y otras ayudas tcnicas dirigidas a personas con problemas de accesibilidad se basan en un cdigo vlido a la hora de procesar las pginas de la red.
  • 21. Los validadores Html5 (en lnea) disponibles son: El validador de W3C:W3C presenta un validador de cdigo (validator.w3c.org). Lo cual es garanta de calidad. No obstante la validacin de Html5 se anuncia todava en un estado experimental.Destaquemos: Que est en ingls. Que ofrece la validacin de un archivo a partir de su direccin http, un archivo que est alojado en su ordenador o cdigo que insertemos en una zona de texto. Que es muy potente. Que sus notas y explicaciones son muy tcnicas o a veces incluso sibilinas. Que es "la" referencia de los profesionales.
  • 22. El validador de W3QubecW3Qubec es un organismo sin nimo de lucro cuya labor consiste en promover el conjunto de normas, estndares abiertos y buenas prcticas de la Web y del mundo multimedia.Proporciona un validador: En francs. Con la posibilidad de validar un archivo a partir de su direccin http, un archivo que est alojado en su ordenador o cdigo que insertemos en una zona de texto. Las advertencias y errores proporcionados estn en francs. Le faltan explicaciones ms explcitas para corregir el cdigo enviado. Se trata de una traduccin al francs del sitio Web de W3C. No existe una versin espaola a da de hoy. El validador de W3Qubec (www.w3qc.org/validateur/)
  • 23. El validador validator.nuEl sitio Web validator.nu proporciona, tambin en estado experimental, un validador de Html5 (html5.validator.nu/).Fue el primero en proporcionar un validador de Html5.Se puede subrayar: Que est en ingls. Que su interfaz es muy sencilla. Que ofrece la posibilidad de validar un archivo a partir de su direccin http, un archivo que est alojado en su ordenador o cdigo que insertemos en una zona de texto. Que parece de excelente calidad.
  • 24. Si quieres saber que tan eficiente es el navegador que usas, puedes ingresar a la siguiente direccin: http://www.html5test.com/ sta pgina califica al navegador desde el cual ests accediendo.
  • 25. http://msdn.microsoft.com/es- es/ie/hh749019 Libro: HTML5 y CSS3 Domine los estndares de las aplicaciones Web, Luc VAN LANCKER PC ACTUAL: http://www.pcactual.com/articulo/zona_prac tica/paso_a_paso/paso_a_paso_internet/968 4/haz_tus_primeros_pinitos_con_html5.html? utm_source=dlvr.it&utm_medium=twitter