HTML5 es el principal lenguaje de la web. Es uno de los primeros lenguajes que debes dominar si deseas dedicarte al diseño y desarrollo web. Pero, ¿por qué es tan importante? ¿cuál es el alcance de este popular lenguaje? Estas y otras preguntas serán respondidas en este artículo, en el que comenzaremos explicando qué es el lenguaje HTML5 y por qué es tan importante en la actualidad.
¿Qué es el lenguaje HTML5?
HTML5 (HyperText Markup Language) es la quinta revisión del lenguaje de marcado estándar que se emplea para la web. Es uno de los lenguajes de marcado más usados en todo el mundo y la razón es bastante obvia: gracias a HTML5 podemos crear la estructura de una página web. Texto, imágenes y material multimedia pueden mostrarse correctamente gracias a HTML5.
Aparte de HTML5, existen otros lenguajes que son necesarios para dar formato e interactividad a un sitio, pero la estructura básica de toda página se define primero en lenguaje HTML5.
¿Y qué es un lenguaje de marcado?
Un lenguaje de marcado hace referencia a aquellos lenguajes que emplean etiquetas. Estas etiquetas ya están predefinidas dentro del lenguaje respectivo y contienen la información que “ayudan” a leer el texto. Es decir, tanto para los desarrolladores como para las plataformas que pueden leer este lenguaje, las etiquetas contienen información adicional de la estructura del texto.
Su principal diferencia con los lenguajes de programación es que éstos últimos poseen funciones aritméticas o variables, mientras que los lenguajes de marcado no.
¿Para que sirve HTML5? ¿Cuáles son los principales usos que puedo darle?
Como ya habíamos mencionado anteriormente, el lenguaje HTML5 se usa para definir la estructura básica de una página web. Sin embargo, una de sus más grandes adiciones en esta nueva versión es poder añadir audio y video sin necesidad de usar Flash u otro reproductor multimedia. A continuación, te mencionamos las posibilidades que se te abren cuando empleas HTML5:
Página web con elementos multimedia
Por medio de las etiquetas <video>y <audio> de HTML5, ahora puedes añadir videos o audio sin necesidad de usar Adobe Flash o cualquier otro plugin de tercero. Toda la acción sucede desde el propio navegador, lo que puede ayudar a disminuir al tamaño del archivo final de tu página. Los desarrolladores pueden tener acceso a una API que les permitirá determinar como estas nuevas etiquetas son presentadas a los usuarios. En otras palabras, puedes incluir videos de presentación de algún producto, críticas en video, podcasts, muestras de música, etc. La adición de estas dos etiquetas expande el uso que le puedes dar al lenguaje HTML5.
También, puedes subir tus videos a páginas de terceros como Vimeo o Youtube e incrustarlos en tu nuevo sitio web, esta es una de las opciones más viables pues a pesar de colocar elementos multimedia, el peso final de tu archivo no se ve afectado.
Funciones de geolocalización
La geolocalización permite al sitio detectar la ubicación de cada usuario que ingresa al sitio web. Esto puede tener diversos usos, por ejemplo, para ofrecer opción de idiomas según el lugar de ubicación del usuario o para enlazarlo a la página oficial de la marca en el país en el que se encuentra, entre otras opciones útiles que, dependiendo como las uses, pueden mejorar la experiencia de usuario.
Es una característica con la que hay que tener bastante cuidado e informar al cliente al respecto pues de lo contrario, sería una violación a su privacidad. Es por ello que esta opción no se puede activar si el usuario no lo aprueba.
Animaciones
Así es, ahora en HTML5 puedes crear animaciones en 2D gracias a la etiqueta <canvas>. La API para esta etiqueta te permite dibujar elementos en 2D y animarlos. El resultado final bien podrías incluirlo en la página de inicio de tu sitio web pues la API te da bastante control sobre los elementos.
Pero no es todo, la API te permite añadir eventos de teclado, ratón y cualquier otro mando que desees incluir. Esta posibilidad ha emocionado a muchos desarrolladores que se han dedicado a realizar sus juegos en HTML5. Así es, los puedes jugar desde cualquier navegador.
Aplicaciones web
La gran ventaja de desarrollar aplicaciones HTML5 es que el resultado final es completamente accesible, es decir, se puede acceder a esta aplicación desde un ordenador, tablet o móvil. Incluso si cambias de dispositivo, podrás acceder a la aplicación web mediante la URL respectiva, cosa que no sucede con una aplicación móvil.
La gran parte de aplicaciones web funcionan desde la nube. Un ejemplo común son los clientes de correo como Gmail, que también cuenta con una aplicación móvil. Es probable que muchos usuarios probablemente prefieran la aplicación móvil, pero le da la facilidad a sus usuarios de elegir la opción que les atraiga más.
Ventajas de usar HTML5
Es gratuito
No necesitas ningún tipo de programa especial para empezar a programar en HTML5, incluso puedes hacerlo en un bloc de notas, guardar el documento como HTML y podrás visualizarlo desde cualquier navegador. Sin embargo, aunque esto es posible no es realmente recomendable pues en un bloc de notas no separa las etiquetas del contenido y puede ser más complicado realizar correcciones.
Pero no necesitas ningún software costoso, puedes usar un editor de código gratuito como Notepad++ que ofrece funciones básicas como diferenciación por color entre etiquetas y contenido.
Código más ordenado
Debido a la adición de nuevas etiquetas que ayudan a nombrar partes de la estructura básica de toda página web (como <header>, por ejemplo), así como la eliminación de ciertas etiquetas, el código HTML se puede separar fácilmente entre etiquetas y contenido, permitiendo así que el desarrollador pueda trabajar de manera más efectiva y detectar errores de manera más rápida.
Las etiquetas son claras y descriptivas, de modo que el desarrollador puede comenzar a codificar sin ningún problema. Es realmente un lenguaje bastante sencillo de comprender en esta nueva versión.
Compatibilidad en navegadores
Los navegadores modernos y populares como Chrome, Firefox, Safari y Opera) soportan HTML5, es decir, sin importar qué navegador empleen tus usuarios el contenido se puede visualizar correctamente. El único problema sería considerar a usuarios que emplean navegadores más antiguos, ya que en éstos no todas las nuevas funciones y etiquetas de HTML5 están disponibles.
Puedes verificar qué funciones de HTML5 soporta cada navegador en la página Can I use y saber de antemano si hay alguna función de tu sitio web que podría resultar ser un problema en estas versiones pasadas de los navegadores. También puedes hacer uso de herramientas como Modernizr, que te permiten determinar la compatibilidad de tu página en diversos navegadores.
Almacenamiento mejorado
Otra nueva adición en HTML5 ha sido el almacenamiento local que se define a sí mismo como “mejor que las cookies” pues la información nunca se transfiere al servidor. De esta manera, la información se mantiene segura. Asimismo, esta nueva característica permite que la información se mantenga almacenada incluso después de haber cerrado el navegador y como funciona desde el lado de cliente, la información se mantiene a salvo incluso si el usuario decide borrar sus cookies.
Ya que la información se guarda en el navegador del usuario, da muchas más posibilidad a las aplicaciones web como por ejemplo el uso de caché que mejora el tiempo de respuesta de la aplicación.
HMTL5 y el diseño adaptativo
HTML5 es compatible con los navegadores móviles, de modo que cada página realizada en HTML5 que se ve en ordenadores, también se puede adaptar a los dispositivos móviles. Esta especificación para móviles puedes hacerla desde el mismo documento HTML o puedes emplear una framework especializada para mejorar tu productividad.
Esta característica del lenguaje HTML5 es probablemente una de las más útiles, pues se puede acceder a cualquier página o aplicación web desde un dispositivo móvil y permite que la experiencia sea igual de buena que al visitar una página web en ordenadores.
