Html 5 presente y futuro de la web

HTML5Presente yfuturo de laWebJuan Eladio Sánchez RosasMozilla Perú

Hablemos deestándares web

HTML• HyperText Markup LanguageLenguaje reconocido universalmente y que permite publicar información de forma global

CSS• Cascading Style SheetsLenguaje creado para controlar el aspecto de los documentos en HTML y XHTML

JavaScript Lenguaje de programación interpretado que se utiliza principalmente para crear páginas web dinámicas.

Un poco dehistoria

Los primeros estándares Web• 1991: HTML (Tags)• 1994: HTML 2• 1996: CSS 1 + JavaScript

Lo que utilizamos ahora• 1997: HTML 4 <p>Esto es HTML• 1998: CSS 2• 2000: XHTML 1 <p>Esto es XHTML</p>• 2002: Diseño web sin tablas <div id=”contenedor1”>• 2005: AJAX

¿Todo esto es nuevopara ti?

librosweb.es

Entonces,¿qué es HTML5?

HTML 5• Nuevo estándar para el desarrollo de páginas web• Iniciado por WHATWG• En desarrollo por World Wide Web Consortium (W3C)• Ya existen implementaciones preliminares

Esto aún es trabajo en progreso

Ahora sí, qué traeHTML5

Menos atributos innecesarios<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script type="text/javascript" src="micodigo.js"></script><link rel="stylesheet" href="path/to/stylesheet.css"type="text/css" />

Nuevas etiquetas semánticas<section> <article> <header> <h1>Título de artículo</h1> </header> <section> Contenido de la nota ... </section> </article> <article> .. </article></section>

Nuevas relaciones en enlaces<link rel="alternate" type="application/rss+xml"href="http://myblog.com/feed" /><link rel="icon" href="/favicon.ico" /><link rel="pingback" href="http://myblog.com/xmlrpc.php"><link rel="prefetch" href="http://myblog.com/main.php">...

Atributos ARIA• Accessible Rich Internet Applications Accesibilidad de contenido web dinámico para personas con discapacidades

Atributos ARIA<ul id="tree1" role="tree" tabindex="0" aria-labelledby="label_1" > <li role="treeitem" tabindex="-1" aria-expanded="true">Fruits</li> <li role="group"> <ul> <li role="treeitem" tabindex="-1">Oranges</li> <li role="treeitem" tabindex="-1">Pineapples</li> </ul> </li></ul>

Nuevos tipos de formularios<input type=”url”> <input type=”color”> ...

Validaciones

Audio y Video<audio src="sound.mp3" controls></audio><video src="movie.mp4" autoplay controls></video>

Estándares de video• H.264/AVC• OGG/Theora• WebM (Youtube VP8)

Vid.ly

Youtube + HTML5

HTML5Canvas

¿Eso es todo?¡No, HTML5 ahora esmás!

HTML5 ahora también incluyeCSS 3• Selectores• Espacios de nombres• Colores• Fondos• Transiciones• Bordes• Sombras• Fuentes

HTML5 ahora también incluyeGeolocalización Permite acceder a la ubicación física del usuario. (y mostrar contenido personalizado)

HTML5 ahora también esWeb WorkersEjecutar scripts ensegundo planosin bloquearel navegador

HTML5 también esDOM StorageExpande capacidades de cookiesAlmacenar mayor cantidad de información deusuario que puedan ser usadas por el navegador

Y mucho, muchomás ...

¿Cómo lo pruebo?

Navegadores “Modernos”• Firefox• Chrome• Safari• Opera• ¿Internet Explorer 9?

Dispositivos móviles• Apple iPhone / iPod / iPad• Android OS

¿Cómo estoy segurode que mi navegadorsoporta HTML5?

HTML5 Test

El caso Navegadores antiguos • Internet Explorer 9 tiene soporte mínimo de HTML5 • ¿Otras versiones?

Y si no es suficiente: Modernizr

HTML5 Readiness

¿Qué hace Mozillaal respecto?

Firefox 7 (Estable), 9 (Aurora) firefox.com/channelFirefox Portable (ejecutable desde USB) ir.pe/firefoxportable

Firefox MobileLleva la experiencia deFirefox a todas partes

Dispositivos móvilessoportados• Meego• Android OS

Mozilla Developer Network

Dev Derby

Mozilla Perú

Mozilla Campus Day*Promover el desarrollo de Internet y la web en nuestro país Para estudiantes y docentes de universidades e institutos peruanosConferencias y talleres sobretecnologías de vanguardia en Internet mozilla.pe/mozilla-campus-day

HTML 5Presente y futuro de la Web Mozilla Perú mozilla.pe www.facebook.com/mozillaperu twitter.com/mozillaperu Juan Eladio Sánchez Rosas jesanchez(a)mozilla.pe blogs.antartec.com/opensource slideshare.net/juaneladio

Html 5 presente y futuro de la web

by Juan Eladio Sánchez Rosas on Sep 04, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

2 Embeds 15

Statistics

Html 5 presente y futuro de la web — Presentation Transcript

http://infoeduka.com	13
http://juansanchez.webcindario.com	2