Las características del HTML5

Beneficios prácticos y ventajas que aporta el uso del nuevo estándar HTML5 en las páginas web, como crear las paginas usando esta declaración. Diferencias con los formatos anteriores, como solucionar conflictos al validar una página en HTML5. Códigos de ejemplos para crear paginas en HTML5.

¿Qué es HTML5?

Un breve resumen de las características del HTML5 para los que no poseen conocimientos de la edición web.

HTML es el lenguaje usado para escribir las páginas web, describe la estructura y el contenido usando solo texto y lo complementa con objetos tales como imágenes, flash y otros.

Los archivos así creados son guardados con la extensión de archivo HTM o HTML.

Su estructura se compone de etiquetas o tags entre las cuales van insertados los diferentes elementos que componen la pagina como son los bloques de texto, scripts y la ruta a la ubicación de archivos externos como imágenes y otros archivos multimedia. Al navegador cargar dichos archivos representa todos los elementos en ella de forma adecuada.

Existen varias versiones o especificaciones de HTML, son las siguientes:

• HTML la primera especificación de 1991

• HTML 3.0 propuesta por el recién formado W3C en 1995

• HTML 4 1999

• XHTML 2002

• HTML5 usándose actualmente pero aun en desarrollo

HTML5 surge como una evolución lógica de las especificaciones anteriores y por la necesidad de lograr los siguientes objetivos:

✔ Lograr que la información, y la forma de presentarla estén lo más separadas posible.

✔ Resumir, simplificar y hacer más sencillo el código utilizado.

✔ Un lenguaje que haga las páginas compatibles con todos los navegadores web, incluyendo los de los teléfonos móviles y otros dispositivos modernos usados en la actualidad para navegar en Internet.

✔ Eliminar restricciones que hagan el código más popular y asequible

Principales estandar en el lenguaje HTML

HTML4

Posiblemente el lenguaje mas usado en las paginas de Internet es el HTML4, a pesar de estar ya casi obsoleto debido a sus limitaciones.

Muchos CMS (software hechos para crear de forma fácil paginas web en Internet), están diseñados para crear las paginas usando dicha especificación, por lo que se siguen sumando muchas de ellas a los millones acumuladas en los servidores de Internet.

Una página escrita en HTML4 puede ser que se muestre de forma diferente en distintos navegadores, o que no se muestre en lo absoluto.

Es imposible representar en dicho lenguaje multitud de caracteres especiales como los Unicode, que son tan comunes en las páginas de este sitio.

XHTML

Después del HTML4 surge el XHTML en dos versiones, Transitional y Strict, lenguaje desde sus inicio considerado de transición y de uso temporal, no obstante representa un adelanto enorme respecto a las posibilidades que introduce, limitado siempre al tratar de mantener la compatibilidad con la especificación anterior.

Es más ligero y compatible con cualquier navegador, su desventaja es que posee muchas restricciones, por lo que muchos no se habituaron fácilmente, al salto que representó su introducción y aun siguen atrapados en el lenguaje anterior.

La mayor parte de las páginas de este sitio han sido escritas usando este lenguaje, desde hace un tiempo acá todas las que se crean. utilizan HTML5.

HTML5

Finalmente llega HTML5, recoge todas las ventajas que introdujo el XHTML y elimina bastante restricciones y limitaciones.

Es más ligero al ser más sencillo y simple el código, lo que permite que las paginas escritas en este lenguaje carguen mas rápido en el navegador.

Si aun no fuera suficiente, introduce infinidad de opciones que hasta ahora estaban vedadas a las páginas web, como insertar directamente video (no flash), música, y casi cualquier elemento.

Si te interesa el posicionamiento de tu pagina en Google, debes saber que una pagina escrita en este lenguaje es priorizada por el buscador, respecto a otras con el mismo contenido pero escritas usando otros lenguajes.

________________________________________

Diferencias del código de HTML5 con lenguajes anteriores

Solo algunas de las diferencias más notables son las siguientes:

✔ No es necesario el cierre de las etiquetas img, br, hr, input, etc.

Por ejemplo:

<br /> ahora se sustituye por: <br>

<hr /> por: <hr>

<img src=""……/> por: <img src=""……>

<input …./> por: <input ….>

✔ Se puede usar tanto minúsculas como mayúsculas en el código a diferencia del XHTML que solo admite minúsculas.

✔ El Doctype o declaración del documento está completamente minimizado, en HTML5 solo es necesario emplear:

<!DOCTYPE html>

✔ Introduce nuevos marcadores para sumarlos a los existentes <div> en usos específicos, por ejemplo: <nav>, <footer>, <audio>, <video>, etc.

Elementos obsoletos en HTML5

Un breve vistazo a los elementos que ya no se pueden emplear en el código de las páginas en HTML5 y los nuevos que se introducen. Más información sobre las características de cada uno, puedes encontrarlas en forma detallada en las páginas especializadas cuyos vínculos están al final de este artículo.

acronym, applet, basefont, bgsound. big. blink, center, dir, font, frame, frameset, isindex, listing, marquee, nobr, noembed, noframes, plaintext, s, spacer, strike, tt, u, wbr, xmp

Todos los elementos que admite HTML5

a, abbr, address, area, article, aside, audio, b, base, bb, bdo, blockquote, body, br, button, canvas, caption, cite, code, col, colgroup, command, datagrid, datalist, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figure, footer, form, h1, h2, h3, h4, h5, h6, head, header, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, mark, menu, meta, meter, nav, noscript, object, ol, optgroup, option, output, p, param, pre, progress, q, rp, rt, ruby, samp, script, section, select, small, source, span, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, time, title, tr, ul, var, video

________________________________________

¿Por qué usar el lenguaje HTML5 en las paginas web?

Escribir páginas usando HTML 5 nos brinda varios beneficios, por ejemplo:

✓ Al ser el código más sencillo y simplificado, cargan más rápido las páginas en el navegador.

✓ Las páginas y los elementos que contienen, se ven perfectamente en todos los navegadores. La gran mayoría de los navegadores de los teléfonos Smartphone y las tabletas, son compatibles con HTML5, si posees uno de estos dispositivos puedes comprobarlo, accediendo con él a la siguiente página: Detector e identificador de dispositivos móviles

✓ Los plugins, widgets y botones que ofrecen los desarrolladores de las redes como Facebook, Twitter y otras, escritos en HTML 5 funcionan excelentemente, con más opciones que los clásicos en XHTML o que los iframes.

✓ Es posible insertar directamente videos en las páginas sin tener que acudir a los iframes o usar la etiqueta object.

✓ HTML 5 incluye etiquetas orientadas principalmente a los buscadores, para facilitarles comprender el contenido de las páginas, lo que nos beneficia, por ejemplo: header, footer, article, nav, etc.

✓ Permite la Geolocalizacion del usuario.

✓ Otras de las razones es el empleo del microformato en las páginas web, que algunos son totalmente incompatibles con otros lenguajes por lo que no validan correctamente a no ser que se use HTML5.

Todavía HTML5 no es un estándar aprobado por el W3C, aunque se puede validar correctamente las páginas usando elValidador W3C de este organismo.

Lee más información detallada sobre cómo usar el validador del W3C para comprobar el código HTML y CSS de las páginas:Como validar y comprobar el código HTML y CSS de las páginas web

Desgraciadamente los grandes CMS de la red como Wordpress, Blogger u otros y programas para la PC, aun no dan la opción de crear páginas en este formato, pero si posees un sitio web al que puedes subir las paginas manualmente, puedes crear algunas para aprovechar los beneficios que admite solo este lenguaje.

Que es el microformato y que son los marcadores o snippets

Los lenguajes de marcado es una forma agregarle contenido en forma de texto al código HTML, que pueda ser significativo para el usuario.

Tradicionalmente se han usado microdata, microformato y RDFa, recientemente Google con los otros principales buscadores como Yahoo y Bing, han llegado a un consenso para decidirse por el desarrollo del microformato, de forma tal que las páginas que incorporen contenido en ese formato, sean compatibles al usar cualquier buscador.

schema.org es donde Google ha centrado su objetivo, el uso de este estándar permite a los usuarios agregar y crear marcadores, también conocidos como snippets enriquecidos, similar a los widgets, en las páginas de acuerdo al tema del que traten.

Algunos ejemplos:

________________________________________

• Es posible usando marcadores de schema.org, que en los resultados de las búsquedas, una página que incorpore en un marcador

...