CAPTULO 1 1 Informacin general sobre HTML5 Este libro trata sobre programacin HTML5.

Para poder entender la programacin HTML5, sin embargo, es necesario dar un paso atrs y entender lo que HTML5 es, un poco de la historia detrs de ella, y la diferencias entre HTML 4 y HTML 5. En este captulo, tenemos derecho a las cuestiones prcticas a las que todo el mundo quiere respuestas.Por qu HTML5, y por qu todo el entusiasmo en este momento?Cules son los nuevos principios de diseo que hacen HTML5 verdaderamente revolucionario-pero tambin muy complaciente?Cules son las implicaciones de un plug-in gratuito paradigma, lo que est dentro y lo que est fuera?Qu hay de nuevo en HTML, y cmo esta patada de una nueva era para la desarrolladores web? Vamos a llegar a ella. La historia hasta ahora-La historia de HTML5 HTML se remonta a un largo camino. Fue publicado por primera vez como un proyecto de Internet en 1993.Los aos 90 vieron una enorme cantidad de actividad en torno a HTML, con la versin 2.0, las versiones 3.2 y 4.0 (en el mismo ao!) y, finalmente, en 1999, versin 4.01. En el curso de su desarrollo, el Consorcio World Wide Web (W3C) asumi el control de la especificacin. Despus de la rpida entrega de estas cuatro versiones embargo, HTML fue ampliamente considerado como un callejn sin salida, la el enfoque de los estndares web desplaz a XML y XHTML, HTML y fue puesto en un segundo plano.En el Mientras tanto, el HTML se neg a morir, y la mayora del contenido en la web continu siendo servido como HTML.Para habilitar nuevas aplicaciones web y hacer frente a las deficiencias de HTML, nuevas caractersticas y se necesitan especificaciones para HTML. Queriendo tomar la plataforma web a un nuevo nivel, un pequeo grupo de personas comenz el hipertexto Web Grupo de Trabajo de Aplicacin (WHATWG) en 2004. Crearon la especificacin HTML5.Tambin comenzaron trabajando en nuevas caractersticas orientadas especficamente para aplicaciones web, la zona en que se sentan ms deficiente.Lo

Fue en ese momento que el trmino Web 2.0 fue acuado. Y realmente fue como una segunda nueva web, como algo esttico sitios web dejaron paso a los sitios ms dinmicos y sociales que requieren ms funciones de muchas ms caractersticas. El W3C se involucr con HTML de nuevo en 2006 y public el primer borrador de trabajo para HTML5 en 2008, y el grupo de trabajo XHTML 2 detuvieron en 2009. Otros dos aos pasaron, y que es donde nos encontramos hoy.Debido a HTML5 resuelve problemas muy prcticos (como se ver ms adelante), el navegador proveedores estn implementando febrilmente sus nuevas caractersticas, a pesar de que la especificacin no ha sido completamente bloqueado. Experimentacin de los navegadores retroalimenta y mejora la especificacin.HTML5 est evolucionando rpidamente para hacer frente a las mejoras reales y prcticas a la web consigo mismo. Por lo general, consisti de imgenes mal escaneados, <blink> etiquetas, informacin sobre dnde vivido y lo que estaba leyendo, y que relacionados con la informtica del proyecto ests trabajando ahora. Yo y la mayora de 'los desarrolladores de World Wide Web' mis compaeros asistan o contratados por las universidades. En ese momento, HTML era primitiva y las herramientas estaban disponibles.Aplicaciones Web apenas existan, que no sea un algunos scripts de procesamiento de textos primitivos.Pginas fueron codificados con la mano con su editor de texto favorito. Eran actualiza cada pocas semanas o meses, o nunca. Hemos recorrido un largo camino en quince aos. Hoy en da, no es raro que los usuarios para actualizar sus perfiles en lnea muchas veces al da.Este tipo de interaccin no habra sido posible si no fuera por las constantes y tambaleantes avances en herramientas en lnea que construyeron en cada generacin anterior. Tenga esto en cuenta al leer este libro.Los ejemplos que mostramos aqu pueden parecer simplistas a veces, pero el potencial es ilimitado. Aquellos de nosotros que utiliz por primera vez <img> etiquetas en la dcada de 1990 probablemente no tenan idea de que

dentro de diez aos, muchas personas se almacenar y editar sus fotos en lnea, pero debemos tener predicho. Esperamos que los ejemplos que presentamos en este libro te inspire ms all de los conceptos bsicos y la creacin de la nueva fundacin de la Web para la prxima dcada ". El mito de 2022 y por qu No Importa La especificacin HTML5 que vemos hoy se ha publicado como un proyecto de trabajo-que an no es definitiva.As cuando no se consigue inamovible? Estas son las fechas clave que usted necesita saber.El primero es 2012, que es la fecha lmite para la recomendacin candidata. La segunda fecha es 2022, que es la propuesta recomendacin. Espera! No tan rpido! No cierre este libro dej a un lado durante diez aos antes de considerar lo que estas dos fechas realmente significan. La primera y ms cercana la fecha es sin duda el ms importante, porque una vez que se llega a esa etapa, HTML5 ser completa. Es a la vuelta de la esquina. La importancia de la propuesta recomendacin (que todos estamos de acuerdo es un poco distante) es que entonces habr dos interoperable implementaciones. En otras palabras, dos navegadores equipadas con completamente interoperables implementaciones de las especificaciones-a toda noble objetivo que en realidad hace que la fecha lmite de 2022 parecen ambicioso. Despus de todo, ni siquiera hemos conseguido que en HTML4 y slo recientemente para CSS2! Lo importante, en este momento, es que los fabricantes de navegadores estn agregando activamente el apoyo de muchos y muy fresco nuevas caractersticas, y algunos de los que ya estn en la convocatoria final para la fase de comentarios.Dependiendo de su audiencia, usted puede comenzar a usar muchas de estas caractersticas en la actualidad.Claro, cualquier nmero de cambios de menor importancia se necesidad de realizar en el futuro, pero eso es un pequeo precio a pagar para disfrutar de los beneficios de vivir en el vanguardia.Por supuesto, si los usuarios utilizan Internet Explorer 6.0, muchas de las nuevas caractersticas no funcionar y requerir la emulacin, pero que an no es una buena razn para descartar HTML5.Despus de todo, los usuarios,

tambin, con el tiempo se salta a una versin posterior.Muchos de ellos probablemente pasar a Internet Explorer 9,0 de inmediato, y que la versin de IE apoya muchas ms funciones HTML5.En la prctica, la combinacin de nuevos navegadores y mejora de las tcnicas de emulacin significa que puede utilizar muchas caractersticas HTML5 hoy o en un futuro muy prximo.
Pgina 6

CAPTULO 1 RESUMEN DE HTML5 3 La OMS est elaborando HTML5? Todos sabemos que es necesario un cierto grado de estructura, y alguien debe, obviamente, a cargo de la la especificacin de HTML5. Ese desafo es el trabajo de tres importantes organizaciones: Web de hipertexto Aplicacin de Tecnologa del Grupo de Trabajo (WHATWG): Fundada en 2004 por personas que trabajan para el navegador vendedores Apple, Mozilla, Google, y Opera, WHATWG desarrolla HTML y APIs para el desarrollo de aplicaciones web y ofrece la colaboracin abierta de los proveedores de navegadores y otras partes interesadas. Consorcio World Wide Web (W3C): El W3C contiene el grupo de trabajo de HTML que se cobra en la actualidad con la entrega de la especificacin HTML5. Internet Engineering Task Force (IETF): Este grupo contiene los grupos responsable de protocolos de Internet como HTTP. HTML5 define un nuevo API WebSocket que se basa en un nuevo protocolo WebSocket, que est bajo el desarrollo de un grupo de trabajo IETF. Una nueva visin HTML5 se basa en varios principios de diseo, detallados en el pliego de condiciones WHATWG, que verdaderamente incorporar una nueva visin de la posibilidad y viabilidad. Compatibilidad

Utilidad Interoperabilidad El acceso universal Compatibilidad y pavimentacin de las rutas de la vaca No te preocupes, HTML5 no es un tipo molesto de la revolucin.De hecho, uno de sus principios fundamentales es mantener todo funcionando sin problemas.Si no se admiten caractersticas de HTML5, el comportamiento debe degradar con gracia. Adems, ya que es de unos 20 aos de contenido HTML por ah, apoyando todo lo que contenido existente es importante. Mucho esfuerzo se ha puesto en la investigacin de la conducta comn. Por ejemplo, Google analiza millones de pginas para descubrir el identificador comn y nombres de clase de etiquetas DIV y encontraron una gran cantidad de repeticin.Por ejemplo, muchas personas utilizan div id = "cabecera" para delimitar el contenido del encabezado.HTML5 es todo sobre la solucin de problemas reales, verdad? Por qu no basta con crear un elemento <header>? Aunque algunas de las caractersticas del estndar HTML5 son bastante revolucionario, el nombre del juego es evolucin, no revolucin. Despus de todo, por qu reinventar la rueda?(O, si es necesario, por lo menos hacer una mejor uno!) Utilidades y la prioridad de las circunscripciones La especificacin HTML5 est escrito en base a una prioridad definida de distritos electorales. Y como van las prioridades, "El usuario es el rey." Esto significa que, en caso de duda, la especificacin de los valores de los usuarios sobre los autores, a lo largo ejecutores (browsers), ms de especificadores (W3C/WHATWG), y ms de la pureza terica.Como resultado de ello, HTML5 es abrumadoramente prctica, aunque en algunos casos, menos que perfecto.
Page 7

CAPTULO 1 RESUMEN DE HTML5 4 Considere este ejemplo. Los siguientes fragmentos de cdigo son igualmente vlidas en HTML5:

id = "prohtml5" id = prohtml5 ID = "prohtml5" Claro, algunos se oponen a esta sintaxis relajada, pero la conclusin es que el usuario final no muy cuidado.No estamos sugiriendo que usted comience a escribir cdigo descuidado, pero en ltima instancia, es el usuario final quien sufre cuando cualquiera de los ejemplos anteriores genera errores y no hace que el resto de la pgina. HTML5 tambin ha dado lugar a la creacin de XHTML5 para que las cadenas de herramientas XML para generar vlida Cdigo HTML5. Los serializaciones del HTML o la versin XHTML deben producir el mismo DOM rboles con diferencias mnimas.Obviamente, la sintaxis XHTML es mucho ms estricta, y el cdigo en los dos ltimos ejemplos no seran vlidos. Seguridad por diseo Mucha atencin se ha prestado a hacer de HTML5 asegurar a la derecha de la puerta de salida.Cada parte de la especificacin tiene secciones sobre consideraciones de seguridad, y la seguridad se ha considerado en la delantera.HTML5 introduce un nuevo modelo de seguridad basado en origen, que no slo es fcil de usar, pero tambin se utiliza sistemticamente por diferentes APIs.Este modelo de seguridad que nos permite hacer las cosas de una manera que antes eran imposibles. Para ejemplo, que nos permite comunicarnos con seguridad entre dominios sin tener que volver a todo tipo de hacks inteligentes, creativos, pero en ltima instancia no segura.A este respecto, no cabe duda de que no estar viendo de nuevo a los buenos viejos tiempos. La separacin de presentacin y contenido HTML5 da un paso de gigante hacia la clara separacin de la presentacin y contenido.HTML5 se esfuerza por crear esta separacin siempre que sea posible, y lo hace utilizando CSS.De hecho, la mayor parte de la presentacin caractersticas de las versiones anteriores de HTML ya no son compatibles, pero seguirn funcionando, gracias a la principio de diseo de compatibilidad se mencion anteriormente.Esta idea no es del todo nueva, aunque, ya se encontraba en Las obras de Transicin y HTML4 XHTML1.1.Los diseadores web han estado usando esto como una buena prctica

durante mucho tiempo, pero ahora, es an ms importante separar limpiamente las dos.Los problemas con los marcado de presentacin son: Pobre accesibilidad La complejidad innecesaria (es ms difcil de leer el cdigo con todo el estilo en lnea) Aumentar el tamao del documento (debido a la repeticin de los contenidos de estilo), que se traduce en pginas ms lento de carga Simplificacin de Interoperabilidad HTML5 es todo acerca de la simplificacin y de evitar la complejidad innecesaria. El mantra HTML5?"Lo simple es mejor. . Simplifique la medida de lo posible "stos son algunos ejemplos de esto: Habilidad navegador nativo en lugar del cdigo JavaScript complejo Un nuevo DOCTYPE simplificado Una nueva declaracin simplificada conjunto, carcter
Pgina 8

CAPTULO 1 RESUMEN DE HTML5 5 Potente y sencilla API HTML5 Diremos ms acerca de algunos de ellos ms tarde. Para lograr todo esto la sencillez, la especificacin se ha convertido en mucho ms grande, ya que tiene que ser mucho ms precisa, mucho ms precisa, de hecho, que cualquier versin anterior de la especificacin de HTML.Lo especifica una legin de comportamientos bien definidos, en un esfuerzo para lograr una verdadera interoperabilidad del explorador para el ao 2022. La vaguedad simplemente no va a hacer que eso suceda. La especificacin HTML5 tambin es ms detallada que las anteriores para evitar malas interpretaciones.Lo tiene como objetivo definir las cosas a fondo, especialmente aplicaciones web.No es de extraar, entonces, que el pliego de condiciones es ms de 900 pginas!

HTML 5 tambin est diseado para manejar as errores, con una variedad de mejora y ambicioso de errores planes de manejo.Muy prctico, se prefiere la recuperacin de errores graciosa al fracaso duro, de nuevo dando A-1 superior prioridad a los intereses del usuario final.Por ejemplo, los errores en documentos no resultarn en catastrfica fallas en la que las pginas no se muestran.En cambio, la recuperacin de errores se define precisamente para los navegadores pueden mostrar marcado "roto" de una manera estndar. Acceso Universal Este principio se divide en tres conceptos: Accesibilidad: Para ayudar a los usuarios con discapacidad, HTML5 trabaja en estrecha colaboracin con un Iniciativa relacionada estndar llamado Web Accessibility (WAI) Accesible Rich Internet Aplicaciones (ARIA). Roles de WAI-ARIA, que son compatibles con lectores de pantalla, puede se puede aadir ya a los elementos HTML. Independencia de los medios: la funcionalidad de HTML5 debera funcionar en todos los dispositivos diferentes y las plataformas, si es posible. Apoyo a todos los idiomas del mundo: por ejemplo, el nuevo elemento <ruby> apoya las anotaciones de Ruby que se utilizan en la tipografa de Asia Oriental. Un paradigma Plugin gratuito HTML5 ofrece soporte nativo para muchas caractersticas que antes slo ser posible con plugins o complejos hacks (una API nativa dibujo, vdeo nativo, tomas de corriente nativos, etc). Plugins, por supuesto, presentan muchos problemas: Plugins no siempre pueden ser instalados. Plugins se pueden desactivar o bloquear (por ejemplo, el iPad de Apple no viene con un plugin de Flash). Los plugins son un vector de ataque separado.

Los plugins son difciles de integrar con el resto de un documento HTML (por lmites plugin, recorte, y las cuestiones de transparencia). Aunque algunos plugins tienen altas tasas de instalacin (Adobe Flash, por ejemplo), que a menudo son bloqueados en controlada entornos corporativos. Adems, algunos usuarios optan por desactivar estos plug-ins, debido a la la publicidad no deseada muestra que le ayuden. Sin embargo, si los usuarios deshabilitar el plugin, tambin desactivar el programa que est confiando en para mostrar su contenido. Plugins a menudo tienen dificultades para la integracin de sus pantallas con el resto del contenido del navegador, lo que hace que recorte o la transparencia problemas con ciertos diseos de sitios.Debido plugins utilizan un autoPgina 9

CAPTULO 1 RESUMEN DE HTML5 6 contena modelo de representacin que es diferente de la de la pgina web de base, los desarrolladores se enfrentan a dificultades si mens emergentes u otros elementos visuales tienen que cruzar los lmites del plugin en una pgina.Aqu es donde HTML5 entra en escena, las sonrisas, y las ondas de la varita mgica de la funcionalidad nativa. Puede estilo elementos con CSS y script con JavaScript.De hecho, este es el lugar donde se flexiona HTML5 su mayor muscular, nos muestra un poder que no exista en las versiones anteriores de HTML. No es slo que el nuevo elementos proporcionan nuevas funcionalidades.Es tambin la interaccin nativa agregado con secuencias de comandos y el estilo que nos permite hacer mucho ms de lo que podramos hacer antes. Tome el nuevo elemento canvas, por ejemplo.Esto nos permite hacer algunas cosas muy fundamentales que antes no eran posibles (trate de dibujar una lnea diagonal en una pgina web en HTML 4).Sin embargo, lo que es ms interesante es el poder que podemos abrir con el API y el estilo se puede aplicar con unos pocos lneas de cdigo CSS.Al igual que los nios bien educados, los elementos de HTML5 tambin juegan muy bien juntos. Para Por ejemplo, puede tomar un fotograma de un elemento de vdeo y mostrarlo en un lienzo, y el usuario slo puede

haga clic en el lienzo para reproducir el vdeo desde el marco que acaba de aparecer.Este es slo un ejemplo de lo que un cdigo nativo tiene que ofrecer ms de un plugin. De hecho, prcticamente todo se vuelve ms fcil cuando no ests trabajar con un cuadro negro.Lo que todo esto se suma a un nuevo medio realmente potente, que es por eso que decidido a escribir un libro sobre programacin HTML5, y no slo de los nuevos elementos! Qu hay en este lugar y lo que est fuera? Por lo tanto, lo que realmente es parte de HTML5? Si usted lee la especificacin cuidadosamente, usted no puede encontrar toda la caractersticas se describen en este libro.Por ejemplo, usted no encontrar Geolocalizacin y Web Workers all. As que estamos slo haciendo estas cosas? Es todo el bombo? No, en absoluto! Muchas piezas de los esfuerzos HTML5 eran originalmente parte de la especificacin HTML5 y fueron entonces trasladado a separar documentos de normas para mantener la especificacin enfocado.Se consideraba ms inteligente discutir y editar algunas de estas caractersticas en una pista separada antes de convertirlos en oficiales especificaciones.De esta manera, una cuestin pequea marcado contencioso no soportara el espectculo de todo el especificacin. Los expertos en reas especficas pueden reunirse en listas de correo para discutir una determinada caracterstica sin la fuego cruzado de un exceso de parloteo.La industria todava se refiere a la serie original de caractersticas, incluyendo Geolocalizacin, y as sucesivamente como HTML5.Piense en HTML5, entonces, como un trmino general que cubre el ncleo margen de beneficio, as como muchas nuevas API cool.En el momento de escribir estas lneas, estas caractersticas son parte de HTML5: Canvas (2D y 3D) Mensajes entre documentos Geolocalizacin Audio y Vdeo Formas

 MathML Microdatos Eventos de servidor enviados Grficos vectoriales escalables (SVG) WebSocket API y el protocolo Concepto de origen Web
Pgina 10

CAPTULO 1 RESUMEN DE HTML5 7 Almacenamiento Web Base de datos indexada Memoria cach de aplicaciones (Desconectado Web Apps) Web Workers Arrastrar y soltar XMLHttpRequest Nivel 2 Como puede ver, una gran cantidad de las API que cubrimos en este libro estn en esta lista.Cmo elegimos que las API cubrir? Elegimos para cubrir funciones que fueron al menos un poco al horno. Traduccin?Estn disponibles en alguna forma en ms de un navegador.Otras caractersticas (menos horneados) slo pueden trabajar en una beta especial versin de un navegador, mientras que otros siguen siendo slo ideas en este punto. En cuanto a la compatibilidad con exploradores va, hay algunos excelentes recursos en lnea que puede utilizar para comprobar soporte de los navegadores actuales (y futuras). El sitio www.caniuse.com pro provee una lista exhaustiva de caractersticas

y el soporte de los navegadores desglosado por versin de navegador y el sitio www.html5test.com ch Ecks la soporte para caractersticas de HTML5 en el navegador que usted utiliza para acceder a ella. Por otra parte, este libro no se centra en proporcionarle las soluciones de emulacin de hacer sus aplicaciones HTML5 funcionan perfectamente en los navegadores antiguos.En su lugar, nos centraremos principalmente en el la especificacin de HTML5 y cmo utilizarlo.Dicho esto, para cada una de las API que hacemos proporcionar algn ejemplo cdigo que puede utilizar para detectar su disponibilidad. En lugar de utilizar la deteccin de agente de usuario, que es a menudo poco fiable, se utiliza la deteccin de caractersticas. Por eso, tambin se puede utilizar Modernizr, una librera JavaScript que ofrece HTML5 y CSS3 muy avanzados de deteccin de funcin.Le recomendamos encarecidamente que utilice Modernizr en sus aplicaciones, ya que es, de lejos la mejor herramienta para ello. MS MOMENTOS EN HTML Frank dice: "Hola, soy Frank, y yo a veces pinto. Una de las primeras manifestaciones de lona HTML que vi fue una aplicacin bsica de la pintura que imitaba la interfaz de usuario de Microsoft Paint.A pesar de que era dcadas atrs del estado de la tcnica en la pintura digital y, en ese momento, corri en slo una fraccin de los navegadores existentes, que me hizo pensar en las posibilidades que representado. Cuando pinto digitalmente, que suelen utilizar software de escritorio instalado localmente.Mientras que algunos de estos programas son excelente, que carecen de las caractersticas que hacen que las aplicaciones web tan grande.En resumen, son desconectada.Compartiendo pinturas digitales, hasta la fecha, implicaba exportar una imagen de una pintura aplicacin y subirlo a la web. Colaboracin o crticas sobre un lienzo vivo estn fuera de la cuestin. Aplicaciones HTML5 pueden cortocircuitar el ciclo de exportacin y hacer el ajuste en el proceso creativo en lnea mundo junto con imgenes acabadas. El nmero de aplicaciones que no se pueden implementar con HTML5 est disminuyendo.Para el texto, la Web es ya el medio de comunicacin de dos vas ltimo.Aplicaciones basadas en texto estn disponibles en su totalidad

formularios web.Sus contrapartes grficas, como la pintura, edicin de vdeo y software de modelado 3D, son acaba de llegar ahora.
Pgina 11

CAPTULO 1 RESUMEN DE HTML5 8 Ahora podemos construir un gran software para crear y disfrutar de imgenes, msica, pelculas y mucho ms.An mejor, el software hacemos ser por intervalos el Web: una plataforma que est en todas partes, el empoderamiento, y en lnea ". Qu hay de nuevo en HTML 5? Antes de empezar la programacin HTML5, vamos a echar un rpido vistazo a las novedades de HTML5. Nueva DOCTYPE y conjuntos de caracteres En primer lugar, el DOCTYPE para las pginas web se ha simplificado en gran medida.Comparar, por ejemplo, la siguiente HTML4 DOCTYPE: <DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.01 Transitional / / EN" " http://www.w3.org/TR/html4/loose.dtd "> Quin podra recordar alguno de estos? Desde luego, no poda.Nosotros siempre slo tienes que copiar y pegar algunos largos DOCTYPE en la pgina, siempre con una preocupacin en el fondo de nuestras mentes: "Ests absolutamente Seguro que ha pegado el ms adecuado "HTML5 perfectamente resuelve este problema de la siguiente?: <! DOCTYPE html> Ahora que es un DOCTYPE que slo podra recordar. Al igual que la nueva DOCTYPE, el conjunto de caracteres de declaracin Tambin se ha abreviado. Lo que sola ser <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> Ahora bien, es: <meta charset="utf-8"> Usted puede incluso dejar fuera de la comillas en "utf-8", si as lo desea. Usando el nuevo DOCTYPE provoca que el navegador muestre pginas en modo estndar.Por ejemplo, la Figura 1-1 muestra la informacin ver si abre una pgina HTML5 en Firefox, y haga clic en Herramientas Pgina de Informacin.En este ejemplo, la

pgina se representa en modo estndar.

Pgina 12

CAPTULO 1 RESUMEN DE HTML5 9 Figura 1-1. A Pgina mostrada en modo compatible con los estndares Cuando se utiliza el nuevo DOCTYPE HTML5, se dispara navegadores para representar la pgina en los estndares modo compatible.Como ustedes saben, las pginas web pueden tener diferentes modos de representacin, tales como manas, Casi Normas y Estndares (o si no se caprichos) de modo. El DOCTYPE indica al navegador que reglas del modo de usar y lo que se utilizan para validar sus pginas.En modo no estndar, los navegadores tratan de evitar rompiendo pginas y hacerlos incluso si no son totalmente vlida. HTML5 introduce nuevos elementos y ha marcado a los dems como obsoleto (ms sobre esto en la siguiente seccin).Si utiliza estos elementos obsoletos, la pgina no ser vlida. Sin embargo, los navegadores seguirn hacerlos como antes. Elementos nuevos y en desuso HTML5 introduce muchos nuevos elementos de marcado, que agrupa en siete tipos de contenido diferentes. Estos se muestran a continuacin en la Tabla 1-1. Tabla 1-1. Tipos de contenido HTML5 Tipo de contenido Descripcin Embedded Contenido que importa otros recursos en el documento, por ejemplo, audio, vdeo, lona, y iframe Flujo Los elementos utilizados en el cuerpo de documentos y aplicaciones, por ejemplo, forma, h1, y pequeo
Pgina 13

CAPTULO 1 RESUMEN DE HTML5 10 Ttulo Los encabezados de seccin, por ejemplo, h1, h2, y hgroup

Interactivo El contenido que los usuarios interactan con, por ejemplo, controles de audio o vdeo, el botn, y textarea Metadatos Elementos-que se encuentran comnmente en el jefe de seccin, que cre la presentacin o comportamiento del resto del documento, por ejemplo, secuencia de comandos, el estilo, y el ttulo Fraseo Texto y el texto elementos de marcado, por ejemplo, marca, kbd, sub y sup Seccionamiento Elementos que definen secciones en el documento, por ejemplo, el artculo, a un lado, y el ttulo La mayora de estos elementos puede ser de estilo con CSS.Adems, algunos de ellos, como la lona, de audio, y vdeo, se puede utilizar por s mismos, a pesar de que son acompaados por APIs que permiten para grano fino control de programacin nativo. Estas API se discutir con ms detalle ms adelante en este libro. Est ms all del alcance de este libro para discutir todos estos nuevos elementos, pero la mayor parte del seccionamiento elementos (que se examinan en la siguiente seccin) son nuevos.El lienzo, de audio y elementos de vdeo tambin son nuevos en HTML5. Del mismo modo, nosotros no vamos a proporcionar una lista exhaustiva de todas las etiquetas obsoletas (hay muchos buenos recursos en lnea en lnea para esto), pero muchos de los elementos que llevan a cabo un estilo en lnea han sido marcado como obsoleto en favor del uso de CSS, como el grande, el centro, la fuente, y la fuente base. Semntica de marcado Un tipo de contenido que contiene muchos de los nuevos elementos de HTML5 es el tipo de contenido de seccionamiento. HTML5 define una nueva semntica para describir el contenido de un elemento. Con marcado semntico no proporcionar los beneficios inmediatos para el usuario final, pero simplifica el diseo de sus pginas HTML. Lo que es ms, que har que sus pginas ms legible y accesible. Por ejemplo, la bsqueda y

motores de sindicacin sin duda se estn aprovechando de estos elementos, se arrastran y pginas de ndice. Como hemos dicho antes, HTML5 es todo acerca de la pavimentacin de las rutas de vaca.Google y Opera analizaron millones de pginas para descubrir los nombres de ID comunes para etiquetas DIV y se encontr una gran cantidad de repeticin.Para ejemplo, ya que muchas personas utilizan div id = "pie de pgina" para marcar el contenido pie de pgina, HTML5 ofrece un conjunto de nuevos elementos de seccionamiento que se pueden utilizar en los navegadores modernos en estos momentos.La Tabla 1-2 muestra los diferentes elementos de marcado semntico. Tabla 1-2. Nuevas seccionamiento elementos HTML5 Seccionamiento Element Descripcin encabezamiento Header (para una pgina o una seccin de la pgina) pie de pgina Contenido Pie de pgina (para una pgina o una seccin de la pgina) seccin Una seccin de una pgina web artculo Contenido del artculo Independent
Pgina 14

CAPTULO 1 RESUMEN DE HTML5 11 aparte Contenido o tirn relacionados cotizaciones nav Ayudas para la navegacin Todos estos elementos pueden ser de estilo con CSS.De hecho, como hemos descrito en el principio de utilidad antes, empuja HTML5 la separacin de contenido y presentacin, por lo que tiene el estilo de su pgina utilizando Estilos CSS en HTML5. Listado 1-1 muestra una pgina HTML5 podra ser similar.Utiliza el nuevo DOCTYPE, conjunto de caracteres y semnticos elementos-en marcado resumen, el nuevo contenido de seccionamiento.El archivo de cdigo (Sample.html) est disponible en la carpeta de cdigo / introduccin. Listado 1-1. Ejemplo HTML5 pgina <! DOCTYPE html>

<html> <head> <meta charset="utf-8"> <title> HTML5 </ title> <link rel="stylesheet" href="html5.css"> </ Head> <body> <header> <h1> Header </ h1> <h2> Subttulo </ h2> <h4> HTML5 Rocks! </ h4> </ Header> <div id="container"> <nav> <h3> Nav </ h3> <A href = " http://www.example.com "> Li nk 1 </ a> <A href = " http://www.example.com "> Li nk 2 </ a> <A href = " http://www.example.com "> Li nk 3 </ a> </ Nav> <section> <article> <header> <h1> artculo Header </ h1> </ Header> <p> Lorem ipsum dolor HTML5 nunc aut Nunquam sit amet, consectetur adipiscing elit. Vivamus en est eros, vel fringilla urna. </ p> <p> Por himenaeos inceptos. Quisque feugiat, justo en vehicula pellentesque, turpis lorem dictum nunc. </ p> <footer> <h2> Artculo Pie </ h2> </ Pie> </ Article>
Pgina 15

CAPTULO 1 RESUMEN DE HTML5 12 <article> <header>

<h1> artculo Header </ h1> </ Header> <p> HTML5: "Lorem ipsum dolor nunc aut Nunquam sit amet, consectetur adipiscing elit. Vivamus en est eros, vel fringilla urna. Pellentesque odio </ p> <footer> <h2> Artculo Pie </ h2> </ Pie> </ Article> </ Section> <aside> <h3> Aparte </ h3> <p> HTML5: "Lorem ipsum dolor nunc aut Nunquam sit amet, consectetur adipiscing elit. Vivamus en est eros, vel fringilla urna. Pellentesque odio rhoncus </ p> </ Aside> <footer> <h2> Pie </ h2> </ Pie> </ Div> </ Body> </ Html> Sin estilos, la pgina sera bastante aburrido de ver. Listado 1-2 muestra una parte del cdigo CSS que se puede utilizar para el contenido de estilo.El archivo de cdigo (html5.css) est disponible en la carpeta de cdigo / introduccin. Este estilo Hoja utiliza algunas de las nuevas caractersticas de CSS3, como las esquinas redondeadas (border-radius) y gire transformacin (transform: rotate () ;). CSS3, HTML5 como s-an est en fase de desarrollo, y que es modular con subspecifications para la captacin de navegador ms fcil (por ejemplo, transformacin, animacin y transicin son reas que estn en subspecifications separadas). Caractersticas de CSS3 experimentales son prefijadas con cadenas de proveedores para evitar conflictos de nombres debe el cambio de las especificaciones.Para mostrar las aristas redondeadas, gradientes, sombras, y transformaciones, es Actualmente necesario utilizar prefijos como-moz-(de Mozilla), o-(por Opera),webkit-(para WebKit-

navegadores basados tales como Safari y Chrome), y-ms-(para Internet Explorer) en sus declaraciones. Listado 1-2. Archivo CSS para la pgina HTML5 body { background-color: # CCCCCC; font-family: Geneva, Arial, Helvetica, sans-serif; margin: auto 0px; max-width: 900px; frontera: slido; border-color: # FFFFFF; } header { background-color: # F47D31; display: block; color: # FFFFFF; text-align: center;
Pgina 16

CAPTULO 1 RESUMEN DE HTML5 13 } encabezado h2 { margen: 0px; } h1 { font-size: 72px; margen: 0px; } h2 { font-size: 24px; margen: 0px; text-align: center; color: # F47D31; } h3 { font-size: 18px; margen: 0px; text-align: center; color: # F47D31; } h4 {

color: # F47D31; background-color: # fff; -Webkit-box-shadow: 2px 2px 20px # 888; -Webkit-transform: rotate (-45deg); -Moz-box-shadow: 2px 2px 20px # 888; -Moz-transform: rotate (-45deg); position: absolute; padding: 0px 150px; top: 50px; izquierda:-120px; text-align: center; } nav { display: block; anchura: 25%; float: left; } nav a: link, nav a: visited { display: block; border-bottom: 3px slido # fff; padding: 10px; text-decoration: none; font-weight: bold;
Pgina 17

CAPTULO 1 RESUMEN DE HTML5 14 margen: 5px; } nav a: hover { color: blanco; background-color: # F47D31; } nav h3 { margen: 15px; color: blanco; } # Container { background-color: # 888; } section {

display: block; anchura: 50%; float: left; } article { background-color: # eee; display: block; margen: 10px; padding: 10px; -Webkit-border-radius: 10px; -Moz-border-radius: 10px; border-radius: 10px; -Webkit-box-shadow: 2px 2px 20px # 888; -Webkit-transform: rotate (-10deg); -Moz-box-shadow: 2px 2px 20px # 888; -Moz-transform: rotate (-10deg); } cabecera del artculo { -Webkit-border-radius: 10px; -Moz-border-radius: 10px; border-radius: 10px; padding: 5px; } Artculo pie de pgina { -Webkit-border-radius: 10px; -Moz-border-radius: 10px; border-radius: 10px; padding: 5px; }
Pgina 18

CAPTULO 1 RESUMEN DE HTML5 15 artculo h1 { font-size: 18px; } lado { display: block; anchura: 25%; float: left; }

lado h3 { margen: 15px; color: blanco; } a un lado p { margen: 15px; color: blanco; font-weight: bold; font-style: cursiva; } pie de pgina { claro: ambos; display: block; background-color: # F47D31; color: # FFFFFF; text-align: center; padding: 15px; } pie h2 { font-size: 14px; color: blanco; } / * Enlaces * / un { color: # F47D31; } a: hover { text-decoration: underline; }
Pgina 19

CAPTULO 1 RESUMEN DE HTML5 16 La Figura 1-2 muestra un ejemplo de la pgina de perfil, decoradas con estilos CSS (y un poco de CSS3) 1-1.Mantener en cuenta, sin embargo, que no hay tal cosa como una pgina tpica HTML5. Todo vale, realmente, y esto ejemplo, se utiliza muchas de las nuevas etiquetas principalmente con fines de demostracin. Figura 1-2. Una pgina HTML5 con todos los nuevos elementos de marcado semntico

Una ltima cosa a tener en cuenta es que los navegadores puedan parecer para hacer las cosas como si en realidad entender estos nuevos elementos.La verdad es, sin embargo, que estos elementos podran haber cambiado el nombre foo y bar y decoradas, y hubieran sido prestados de la misma manera (pero por supuesto, no tendra ningn beneficio en la optimizacin de motores de bsqueda).La nica excepcin a esto es Internet Explorer, el cual requiere que los elementos sean parte del DOM.As que, si quieres ver estos elementos en IE, debe programacin insertarlos en el DOM y los muestra como elementos de bloque. Un prctico script que lo hace por usted es html5shi v (http://code.google.com/p/html5shiv/).
Pgina 20

CAPTULO 1 RESUMEN DE HTML5 17 Simplificacin de seleccin a travs de la API de selectores Junto con los nuevos elementos semnticos, HTML5 tambin introduce nuevas formas sencillas de encontrar elementos en tu pgina de DOM.La Tabla 1-3 muestra las versiones anteriores de los documentos objeto de desarrolladores autorizados a hacer algunas llamadas para encontrar elementos especficos en la pgina. Tabla 1-3. Mtodos de JavaScript anterior de encontrar elementos Funcin Descripcin Ejemplo getElementById () Devuelve el elemento con el valor del atributo id especificado <div id="foo"> getElementById ("foo"); getElementsByName () Devuelve todos los elementos cuyo nombre atributo tiene el valor especificado <input type="text" name="foo"> getElementsByName ("foo"); getElementsByTagName () Devolver todos los elementos cuyo nombre de etiqueta coincide con el valor especificado <input type="text">

getElementsByTagName ("input"); Con la nueva API de selectores, ahora hay formas ms precisas para especificar qu elementos lo hara desea recuperar sin tener que recurrir a un bucle y la iteracin a travs de un documento utilizando el estndar DOM.La Selectores API expone a las mismas reglas del selector presentes en CSS como un medio para encontrar uno o ms elementos en la pgina.Por ejemplo, CSS ya dispone de reglas prcticas para la seleccin de los elementos en funcin de su anidacin, hermanos, y el nio patrones. Las versiones ms recientes de CSS aadir soporte para ms pseudo-clases-de ejemplo, si un objeto est habilitado, deshabilitado o facturado y casi cualquier combinacin de propiedades y la jerarqua que podan imaginar.Para seleccionar elementos en el DOM utilizando las reglas CSS, simplemente utilizar una de las funciones que se muestran en la Tabla 1-4. Tabla 1-4. Nuevos mtodos querySelector Funcin Descripcin Ejemplo Resultar querySelector () Devuelva el primero elemento de la pgina que coincide con el selector especificado reglas (s) document.querySelector ("input.error") Devuelve el primera entrada campo con un Clase de estilo de "Error" querySelectorAll () Devuelve todas las elementos que coincidir con el especificado norma o normas document.querySelectorAll ("# resultados td "); Vuelva a introducir los celdas de la tabla dentro de la

elemento con Resultados de Identificacin Tambin es posible enviar ms de una regla de seleccin de las funciones de la API de seleccin, por ejemplo: / / Seleccionar el primer elemento en el documento con la / HighClass clase / estilo o la lowClass clase de estilo var x = document.querySelector ("clase superior". "lowClass.");
Pgina 21

CAPTULO 1 RESUMEN DE HTML5 18 En el caso se selecciona de querySelector (), el primer elemento que coincida con cualquiera de regla.En el caso de los querySelectorAll (), se devuelve ningn elemento coincidente alguna de las reglas mencionadas.Varias reglas son comas separado. La nueva API de seleccin hace que sea fcil para seleccionar las secciones del documento que fue doloroso para seguir antes.Supongamos, por ejemplo, que quera la capacidad de encontrar el que sea celda de una tabla en la actualidad con el ratn se cierne sobre l. Listado 1-3 muestra cmo es trivialmente fcil con un selector.Los archivos de ejemplo para esto (querySelector.html y querySelectorAll.html) se encuentran en el directorio code / introduccin. Listado 1-3. Usando la API Selector <! DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title> Query Selector demo </ title> <style type="text/css"> td { border-style: solid; border-width: 1px; font-size: 300%; } td: hover { background-color: cian; } # HoverResult { color: green;

font-size: 200%; } </ Style> </ Head> <body> <section> <- Crear una tabla con una pantalla de 3 por 3 celdas -> <table> <tr> <td> A1 </ td> <td> A2 </ td> <td> A3 </ td> </ Tr> <tr> <td> B1 </ td> <td> B2 </ td> <td> B3 </ td> </ Tr> <tr> <td> C1 </ td> <td> C2 </ td> <td> C3 </ td> </ Tr> </ Table> <div> Centrarse en el botn, coloque el cursor sobre las celdas de la tabla, y pulse Enter para identificarlos utilizando querySelector ('td: hover'). </ div>
Pgina 22

CAPTULO 1 RESUMEN DE HTML5 19 <button type="button" id="findHover" autofocus> Buscar 'td: hover' target </ button> <div id="hoverResult"> </ div> <script type="text/javascript"> . onclick = funcin document.getElementById ("findHover") () { / / Encuentra la celda de la tabla actualmente rondado en la pgina var cerna = document.querySelector ("td: hover"); if (mantenido) . document.getElementById ("hoverResult") innerHTML = hovered.innerHTML; } </ Script> </ Section> </ Body> </ Html> Como se puede ver en este ejemplo, encontrar el elemento de un usuario se cierne sobre un ejercicio de una sola lnea

usando: var cerna = document.querySelector ("td: hover"); Tenga en cuenta no slo las APIs Selector til, pero a menudo son ms rpidos que atraviesa el DOM utilizando el legado nio API de recuperacin.Los navegadores estn altamente optimizadas para la coincidencia de seleccin a fin de aplicar las hojas de estilos rpidos. No debera ser demasiado sorprendente encontrar que la especificacin formal de los selectores se separa de la especificacin de CSS en el W3C. Como has visto aqu, los selectores son generalmente tiles fuera de estilo. Todos los detalles de los nuevos selectores estn fuera del alcance de este libro, pero si usted es un desarrollador de la bsqueda el mejor modo de manipular el DOM, se les anima a utilizar la nueva API de selectores de forma rpida navegar por su estructura de la aplicacin. JavaScript registro y depuracin Aunque no son tcnicamente una caracterstica de HTML5, la tala y herramientas de depuracin de JavaScript en el navegador se han mejorado mucho en los ltimos aos.La primera gran herramienta para el anlisis de las pginas web y las cdigo que se ejecuta en ellos era la de Firefox, Firebug. Una funcionalidad similar se pueden encontrar en todos los navegadores otro "herramientas integradas de desarrollo: Safari de Web Inspector, Chrome Developer Tools de Google, herramientas de desarrollo de Internet Explorer, Opera y de Dragonfly.La Figura 1-3 muestra las herramientas de desarrollo de Google Chrome (utilizan la combinacin de teclas Ctrl + Shift + J en Windows o Comando + Opcin + J en Mac para acceder a esta) que proporcionan una gran cantidad de informacin acerca de sus pginas web, que incluyen una consola de depuracin, un elementos View, una vista de recursos, y un guin ver, por nombrar slo algunos.
Pgina 23

CAPTULO 1 RESUMEN DE HTML5 20 Figura 1-3. Herramientas para Desarrolladores ver en Chrome Muchas de las herramientas de depuracin ofrecen una manera de establecer puntos de interrupcin para detener la ejecucin de cdigo y analizar la estado del programa y el estado actual de las variables. El API console.log se ha convertido de facto

norma de registro para los desarrolladores de JavaScript.Muchos navegadores ofrecen una vista dividida-panel que le permite ver mensajes registrados en la consola.Usando console.log es mucho mejor que hacer una llamada para alertar (), ya que no detiene la ejecucin del programa. window.JSON JSON es una forma relativamente nuevo y cada vez ms popular para representar los datos.Es un subconjunto de la sintaxis de JavaScript que representa los datos como objetos literales.Debido a su simplicidad y en forma natural en la programacin JavaScript, JSON se ha convertido en el estndar de facto para el intercambio de datos en las aplicaciones de HTML5.La API cannica para JSON tiene dos funciones, parse () y stringify () (sentido serializar o convertir en cadena). Para utilizar JSON en los navegadores ms antiguos, que necesita una biblioteca JavaScript (varios se puede encontrar en http://json.org). Par cantar y la serializacin de JavaScript no son siempre tan rpido como le gustara, por lo que acelerar las cosas, los nuevos navegadores ahora tienen una implementacin nativa de JSON que se puede llamar desde JavaScript.El objeto nativo JSON est especificado como parte del estndar ECMAScript 5 para los prximos generacin del lenguaje JavaScript. Es una de las primeras partes de ECMAScript 5 a ser ampliamente implementado.Cada navegador moderno tiene ahora window.JSON, y usted puede esperar ver mucho de JSON utilizado en aplicaciones HTML5.
Pgina 24

CAPTULO 1 RESUMEN DE HTML5 21 DOM Nivel 3 Una de las partes ms calumniados de desarrollo de aplicaciones web ha sido la gestin de eventos.Mientras que la mayora navegadores son compatibles con las API estndar para eventos y elementos, Internet Explorer difiere.Al principio, Internet Explorador implement un modelo de eventos que se diferenciaba de la eventual norma.Internet Explorer 9 (IE9) ahora es compatible con DOM nivel 2 y 3 funciones, lo que finalmente puede utilizar el mismo cdigo para la manipulacin de DOM

y manejo de eventos en todos los navegadores HTML5.Esto incluye el addEventListener vez ms importante () y dispatchEvent () mtodos. Monos, Squirrelfish y otras rarezas Speedy La ltima ronda de las innovaciones del navegador no se trata slo de nuevas marcas y nuevas APIs.Uno de los ms recientes cambios significativos es la rpida evolucin de los motores de JavaScript / ECMAScript en la principal navegadores.As como nuevas API abrir capacidades que eran imposibles en los navegadores de ltima generacin, aceleraciones en la ejecucin del motor de scripting en general benefician tanto a las aplicaciones web existentes y los que utilizan las ltimas caractersticas de HTML5.Crees que tu navegador no puede manejar imgenes complejas o los datos procesamiento, o la edicin de largos manuscritos? Piense otra vez. En los ltimos aos, los fabricantes de navegadores han estado en una carrera armamentista virtual para ver quin podra desarrollar el motor de JavaScript ms rpido.Mientras que las primeras iteraciones de JavaScript se puramente interpretados, la motores nuevos compilar cdigo script directamente en cdigo mquina nativo, que ofrece aceleraciones de rdenes de magnitud en comparacin con los navegadores de los mediados de los aos 2000. La accin ms o menos comenz cuando Adobe don su motor de compilacin just-in-time (JIT) y mquina virtual para ECMAScript de cdigo llamado Tamarin-al proyecto Mozilla en 2006. Aunque slo piezas de la tecnologa Tamarin permanecen en las ltimas versiones de Mozilla, la donacin de Tamarin ayudado nuevos motores de secuencias de comandos de regeneracin en cada uno de los navegadores, con nombres que son tan intrigante como la desempeo que afirman tener. Tabla 1-5. Web Browser JavaScript Motores Navegador Motor Nombre Notas Apple Safari Nitro (conocido de otro modo como SquirrelFish Extreme) Lanzado en Safari 4 y refinado en versin 5, que introduce optimizaciones de cdigo de bytes y un

contexto de subproceso compilador nativo. Google Cromo V8 Dado que Chrome 2, utiliza la recoleccin de basura generacional para alta escalabilidad de memoria sin interrupciones. Microsoft Internet Explorador Chakra Introducido en IE 9, Chakra se centra en el fondo compilacin y un sistema de tipo eficiente y demuestra una mejora con respecto a diez veces IE8. Mozilla Firefox JgerMonkey Refinado de la versin 3.5, esto se combina interpretacin rpida con la compilacin nativa de los rboles traza. pera Carakan ste utiliza bytecode basado en registros y selectiva compilacin nativa y reclamaciones mejoras de 75% en versin 10.50.
Pgina 25

CAPTULO 1 RESUMEN DE HTML5 22 Con todo, esta sana competencia entre los proveedores de navegadores es lo que el rendimiento de JavaScript cada vez ms estrecha a la de cdigo de aplicacin de escritorio nativa. TODAVA MS MOMENTOS EN HTML Pedro dice: "Hablando de la competencia y rarezas rpidos, mi nombre es Pedro y correr es lo mo-a correr mucho. Funcionamiento Ultra es un gran deporte donde conocer gente estupenda.Durante la ejecucin de los ltimos kilmetros de una carrera de 100 millas o una carrera trail de 165 millas, realmente llegar a conocer a la gente en una forma muy nueva.En ese momento, usted es realmente despojado de su esencia, el lugar donde grandes amistades pueden suceder. Todava hay el elemento de competencia, sin duda, pero sobre todo hay un profundo sentido de la camaradera.Pero estoy divagando aqu.

Para realizar un seguimiento de cmo mis amigos estn haciendo en las carreras que no puedo asistir (por ejemplo, cuando estoy escribiendo un Libro HTML5), por lo general lo sigue en las pginas web de carreras.No es sorprendente que las opciones 'Seguir en vivo' son a menudo muy poco fiable. Hace unos aos, me encontr con un sitio para una carrera europea que tena todas las ideas correctas.Dieron GPS trackers a los pilotos de cabeza y luego se muestran estos corredores en un mapa (vamos a construir algunos similares manifestaciones en este libro mediante Geolocalizacin y WebSocket).A pesar del hecho de que era bastante aplicacin primitiva (los usuarios tenan que realmente haga clic en "actualizar la pgina" para ver las actualizaciones!), he podido instante ver el potencial increble. Ahora, pocos aos despus, HTML5 nos proporciona herramientas para construir este tipo de sitios web de seguimiento de carrera en directo con APIs como Geolocalizacin para aplicaciones basadas en la localizacin y WebSockets para actualizaciones en tiempo real. No hay duda en mi mente-HTML5 ha cruzado la lnea de meta un ganador! " Resumen En este captulo, le hemos dado una visin general de los elementos esenciales de HTML5. Hemos trazado la historia de su desarrollo y algunas de las fechas importantes por venir. Tambin describe los cuatro nuevos principios de diseo detrs de la era de HTML5 que ahora est amaneciendo: compatibilidad, utilidad, la interoperabilidad y el acceso universal.Cada uno de estos principios se abre la puerta a un mundo de posibilidades y cierra la puerta a una serie de prcticas y convenciones que ahora son obsoletos. A continuacin, presentamos sorprendente nuevo paradigma plugin-libre de HTML5, y se revisaron las novedades de HTML5, como una nueva DOCTYPE y juego de caracteres, un montn de nuevos elementos de marcado, y discutieron la carrera por la supremaca JavaScript. En el prximo captulo, vamos a empezar por explorar la parte de programacin de HTML5, empezando por el Canvas API