Ya vimos anteriormente que la cabecera del documento HTML contiene información sobre el propio documento u otros datos que no forman parte de su contenido. La cabecera de un documento HTML se delimita con el elemento ‘head‘, tal y como ya habíamos visto.
El elemento ‘title’
De entre los componentes de la cabecera del documento, el único obligatorio y, por lo tanto, el más importante es el elemento ‘title‘, que permite especificar el título de la página.
<title>El título de mi página</title>
El título de la página web no se mostrará junto al contenido del documento pero los navegadores gráficos (Internet Explorer, Opera, Firefox, etc.) suelen presentarlo como título de la ventana (en la barra de títulos).
El elemento ‘meta’
Además del título del documento, en la cabecera de un documento HTML se pueden incluir también elemento ‘meta‘.
Este elemento puede utilizarse para indicar una serie de propiedades del documento (como por ejemplo el autor, una lista de palabras clave, etc), por lo que puede aparecer cualquier número de veces.
Con el atributo ‘name‘ del elemento ‘meta‘ indicaremos el nombre de la propiedad y con el atributo ‘content‘ especificaremos su valor.
<meta name="author" content="miNombre" />
Opcionalmente podemos utilizar el atributo ‘lang‘ para indicar el idioma del valor del atributo ‘content‘ o también podemos utilizar el atributo ‘http-equiv‘ en lugar de ‘name‘ para crear una cabecera específica en la respuesta HTTP, por ejemplo, para indicar la codificación de la página.
<meta name="author" lang="es" content="miNombre" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
Más adelante veremos un listado de etiquetas meta que puede ser útil incluir en nuestras páginas.
El elemento ‘link’
Sirve para establecer enlaces entre recursos. Con el atributo ‘rel‘ podemos definir las relaciones entre los documentos y con el atributo ‘href‘ indicaremos la URL del elemento.
Con esta etiqueta podemos indicar por ejemplo una feed RSS relacionada con nuestra página o la hoja de estilos que utilizamos en el documento y también puede aparecer varias veces en la cabecera de un documento HTML.
<link rel="alternate" href="miFeed.rss" type="application/rss+xml" title="Feed RSS" /> <link rel="stylesheet" href="misEstilos.css" type="text/css" />
En los artículos sucesivos veremos diferentes aplicaciones de este elemento.
El elemento ‘style’
El elemento ‘style‘ nos permite incluir directamente en nuestra página los estilos que serán utilizados en el cuerpo del documento.
Aunque suele ser más común tener esta información en una hoja de estilos separada y referenciarla con ‘link‘ como hemos visto antes, también tenemos esta posibilidad. La etiqueta ‘style‘ también puede aparecer cualquier número de veces.
<style type="text/css">
h1 {text-align:center}
h2 {text-align:right}
</style>
Con el atributo ‘type‘ indicamos el tipo de lenguaje de estilos.
Al igual que con el resto de elementos mencionados antes, veremos mucho más sobre estilos y sobre cómo utilizar esta etiqueta en próximos artículos.
El elemento ‘script’
El elemento ‘script‘ permite incluir instrucciones JavaScript dentro de documentos HTML. Con el atributo ‘languaje‘ indicaremos el lenguaje y con el atributo ‘type‘ el tipo de documento.
<script language="javascript" type="text/javascript">
alert("hola mundo");
</script>
Como suele ser habitual mantener todo el código JavaScript en ficheros a parte, podemos referenciarlos de la siguiente forma en lugar de incluir todo el código en cada página. Por supuesto que esta etiqueta también puede aparecer cualquier número de veces, ya sea para referenciar varios ficheros como para incluir código JavaScript directamente en la página.
<script language="javascript" type="text/javascript" src="miScript.js"></script>
También iremos viendo cómo utilizar esta etiqueta y para qué en próximos artículos.