En la primera parte del tutorial de introducción al HTML conocíamos un poco la historia del HTML, veíamos la estructura HTML de la que empezaremos todas las plantillas y la explicábamos a grandes rasgos.

En esta segunda entrega vamos a ver la cabecera del sitio web y trataré de explicar un poco, aunque sea por encima, las funciones (más que importantes) que cumplen las diferentes partes de la cabecera.

Si analizamos el código de una web (por ejemplo el de Katharsix) veremos que siempre empieza con el Doctype y después vienen las etiquetas head.

El doctype fue explicado en el capitulo anterior de este tutorial.

Etiquetas title

Una parte fundamental, y uno de los pilares, es el título del sitio web. Este título se coloca en la cabecera del sitio con las etiquetas <title> y </title>. De cara al posicionamiento es importante que sea único para cada página del sitio web, pero esto ya lo explicaré más adelante o en otras entradas.

Las etiquetas meta

Por otro lado, la cabecera contendrá etiquetas meta, que son leidas por los buscadores (al menos por parte de ellos) rastreando información como palabras clave o descripción del sitio web.

Hay muchos tipos de etiquetas meta con diferentes funcionalidades, pero las más utilizadas (y prácticamente las únicas) son:

Scripts

En la cabecera del documento también podemos incluir scripts de diferentes lenguajes de programación, pero en especial hojas de estilos, javascript...
Si queremos incluir la librería en nuestro sitio deberemos insertar algo así:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

Incluimos la librearía JQuery desde el repositorio de Google.

Por otro lado, si deseamos incluir una hoja de estilos (CSS) la instrucción sería la siguiente:

<link rel="stylesheet" href="ruta_del_fichero/style.css" type="text/css" media="screen" />

Realmente todas estas llamadas a ficheros externos y scripts son siempre iguales, con un poco de práctica las manejarás y recordarás con total facilidad.

Hasta aquí queda explicada (aunque por encima) la cabecera de nuestro sitio web.

Seguir con el tutorial

Volver al índice
Anterior: Introducción al HTML
Siguiente: Etiquetas estructurales