Ardilla Quio Ardilla Quio

04 de Julio de 2012

HTML5: Introducción

HTML5 es la nueva versión de HTML, el lenguaje de marcado con el que se crea la estructura y el contenido de las páginas web. Esta nueva versión intenta aumentar la potencia del lenguaje para conseguir aplicaciones web cada vez más complejas.

Con este fin se añaden etiquetas para reproducir multimedia (video y audio), nuevas etiquetas de marcado semántico, nuevos tipos de campos de entrada de datos en formularios y también se define el DOM con nuevas funcionalidades y sus respectivas API para añadir características tales como: geoposicionamiento, dibujo, arrastrar y soltar, ...

El doctype

El <!DOCTYPE> no es una etiqueta sino una instrucción que se usa para especificar a los navegadores la versión de HTML en la que está escrito un documento.

Esta instrucción debe escribirse antes que cualquier otra cosa en el documento, antes incluso que la etiqueta <html>. En el caso de HTML5 esta declaración se ha simplificado mucho, quedando así:

<!DOCTYPE html>

La etiqueta <html>

En XHTML 1.0 la etiqueta <html> tenía este aspecto:

<html xmlns="http://www.w3.org/1999/xhtml" lang="es"

Con esto, se indicaba el espacio de nombres en el que se englobaría el documento y el idioma del mismo. En HTML5 ya no hace falta declarar explícitamente el espacio de nombres y la declaración de idioma sólo es necesaria con el atributo lang; quedaría así:

<html lang="es">

Codificación de caracteres

Aunque no es estrictamente obligatorio, es conveniente que la primera etiqueta que se ponga dentro del <head> sea la que indica la codificación de caracteres del documento. Esta declaración, en versiones anteriores se hacía así:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

En HTML5 no hace falta aclarar que el contenido es de tipo "text/html" y la etiqueta se ha modificado, quedando así:

<meta charset="utf-8" />

Añadir javascript y CSS

Con HTML5 ya no es necesario el atributo type al añadir javascript y CSS, ya que el valor por defecto del mismo ya es el correcto. Así, lo que en versiones anteriores pondríamos así:

<script src="script.js" type="text/javascript"></script>
<link rel="stylesheet" href="estilos.css" type="text/css" />

Ahora será muy parecido, sólo que un poco más corto:

<script src="script.js"></script>
<link rel="stylesheet" href="estilos.css" />

Soporte en navegadores

HTML5 no es una característica de los navegadores en si misma, sino un conjunto de funcionalidades. Esto quiere decir que no se puede decir si un navegador soporta HTML5; lo que se hace es comprobar si el navegador soporta alguna de sus funcionalidades como geoposicionamiento, video, dibujo, ...

En la Wikipedia podemos encontrar una tabla de características HTML5 soportadas por los distintos navegadores.

Dado que los navegadores no soportan todas las características de HTML5, es recomendable utilizar una librería como Modernizr que puede detectar las funcionalidades del navegador y, en algunos casos, ofrece alternativas para aquellas que el mismo no tiene implementadas.

0 comentarios

Comentario anónimo
Comentar como usuario