¿html5?


¿Qué es y por que debería preocuparme si aún no lo utilizo?


@html5facil / @ninjacodetv

#html5facil / #phpdaypuebla

¿Te conozco?


¡Hola!


Soy Luis Antonio Gómez

Fundador y Co-fundador de:


Para Cualquier pregunta...


Solo levante su mano, en Twitter pueden utilizar los hashtag #phpdaypubla #html5facil para dar seguimiento a la conferencia.




Pero vamos a lo importante...

¿Qué es html5?


HTML5 es una nueva actualización de HTML, el lenguaje en el que es creada la web.

Pero también...


Es un término de marketing que agrupa las nuevas tecnologías de desarrollo web: HTML5, CSS3 y nuevas capacidades de Javascript.

Pero ¿De dónde surge?

Antes de html5...


Teniamos XHTML, la web estaba en una etapa muy avanzada (web 2.0) y el estándar actual era bastante viejo.

La W3C intento resolver el problema


El estándar XHTML 2.0 fue un intento de dar solución a esto pero sin embargo, esta norma no fue bien recibida y en su mayor parte, ha sido abandonada. 

Mientras tanto...


La WHATWG una comunidad de personas interesadas en la evolución de HTML, empezó a trabajar en el estándar HTML5, el cual fue mucho mejor recibido.

W3C y WHATWG colaboran...


HTML5 hizo que por primera ves todos apuntaran a una tecnología en común para la web.

La W3C y WHATWG tienen diferencias pero trabajaron en una misma norma, aunque la W3C también tenia intensiones de mostrar XHTML5.




Pero lo difícil ya paso...

¿QUÉ HAY DE NUEVO EN HTML5?


  • <!Doctype html>   - Tipo de documento 
  • <header>           - Cabecera
  • <hgrup>  - Grupo de títulos
  • <nav>   - Menús o Navegación
  • <section>   - Secciones
  • <article>  - Artículos
  • <aside>  - Barra lateral
  • <footer>  - Pie de pagina
  • Entre otras más...

Estructura básica de un documento en HTML5


¡Y aún falta lo más importante!





Las Etiquetas más poderosas


<video>

<audio>

<input *>

<canvas>

<svg>

HTML5 también tiene mucho SIGNIFICADO...

El código ahora es más semántico



HTML5 sugiere que el código sea de fácil entendimiento para el desarrollador y los motores de búsqueda.

¿Cómo darle significado?


Existen muchas maneras de aprovechar esta nueva oportunidad:
  • La estructura
  • Etiquetas
  • Tipo de relación en los enlaces
  • Atributos
  • Formularios
  • Microdatos (¿Qué es?)
  • Microformatos (Describir)
  • RDFa (Descripción específica)

¿Cómo se que un sitio usa HTML5?


Muy simple:

  • Intenta abrir un sitio en IE (8, 7, 6  o 5)
  • ¿Funciona?
  • ¿No?
  • Entonces es ¡HTML5!

¿HTML5 revoluciona la web?







Si, pero ya ha SUCEDIDO antes...

XHTML


XHTML: eXtensible Hypertext Markup Language
(Lenguaje extensible de marcado de hipertexto)

AJAX


Asynchronous JavaScript And XML 
(JavaScript asíncrono y XML)

Ajax fue posible gracias al XMLhttpRequest de...

¡Internet Explorer 5!

¡De verdad!

Gmail lo redescubre


Google publica Gmail en beta y todos quieren saber como enviar y recibir información sin recargar un sitio web.




¿Qué hay de Javascript y CSS3?

Javascript viene con superpoderes


  • Web Storage: Almacenamiento en el cliente
  • Web SQL: Pequeña BD en el cliente
  • Web Workers: Multitarea en JavaScript
  • Web Sockets : Comunicación en tiempo real
  • Arrastrar y soltar: Manejo de archivos
  • Geolocalización: Ahora sabremos donde estas
  • Y mucho más...

imaginalo y css3 lo puede hacer


  • @font-face
  • Selectores CSS
  • Columnas de texto
  • Opacidad, contraste, saturación, brillo, etc.
  • Animaciones de transición y transformación
  • Bordes redondeados
  • Reflexiones, gradientes y sombras
  • Y mucho más...

¿Quiénes ya lo utilizan?



¿Aún no sabes HTML5?


No te preocupes, estás en el momento perfecto para aprenderlo.

¡Gracias por su atención!


Luis Antonio Gómez:

  • @jimmylagp
  • facebook.com/jimmylagp
  • contacto@html5facil.com


que es html5

By Luis Antonio Gómez

que es html5

  • 2,185