Enlaces en HTML

Conocemos los fundamentos de los lenguajes de marcas y, en especial, de HTML. Pero aún nos quedan algunos conceptos que ver para poder introducir elementos un poco más sofisticados. Un ejemplo son los enlaces. Imaginemos que quisiéramos tener un párrafo con un texto que incluyera un enlace a la página web del INTEF. Sabiendo que la marca para los enlaces es a (de anchor, ancla en inglés), tendríamos algo parecido a lo que sigue:

<p>
  Visita la <a>página web del INTEF</a>, que hay muchas cosas interesantes.
</p>

Un enlace HTML

Elaboración propia.

Pues hemos creado un hipervínculo. Pero falta algo. Si guardamos lo anterior y lo abrimos con el navegador, el texto "página web del INTEF" sale subrayado en azul (así salen por defecto todos los enlaces), pero al pinchar sobre el mismo -aun cuando el puntero del ratón cambie- no parece hacer la acción que teníamos en mente. No nos lleva a la página web del INTEF. Esto es así, porque en ningún lado hemos indicado cuál es la página a la que el navegador debería ir si pinchamos sobre el enlace. Para incluir esa información, vamos a hacer uso del concepto de atributo. Como hemos visto, las marcas tienen un código (conocemos ya p, br, b e i). Además, les podemos añadir información adicional indicando el nombre del atributo y su valor. Por ejemplo, en este caso, el atributo tiene el nombre href (que viene de hypertext reference) y el valor será la URL de la página del INTEF. En HTML:

<p>
  Visita la <a href="http://www.ite.educacion.es/index.html">página web del INTEF</a>, que hay muchas cosas interesantes.
</p>

Un enlace HTML (con href)


El ávido lector habrá notado que la notación es muy sencilla: dentro de la misma marca de inicio, y dejando un espacio en blanco, se indica primero el nombre, luego un signo de igualdad y finalmente entre corchetes el valor del atributo. ¿Cómo sé qué atributos permiten cada una de las marcas? Pues al igual que el comité de estandarización de HTML define las marcas que podemos utilizar, también da indicaciones sobre los atributos que cada una de las marcas puede tener. Los atributos pueden ser obligatorios (por ejemplo, en el caso de href para la marca a lo es, ya que si no está presente la marca no tiene mucho sentido) u opcionales. Nótese que al pasar el puntero del ratón por encima del enlace, en la parte inferior izquierda del navegador aparece la URL a la que llevaría el enlace.

Abramos un pequeño paréntesis para ver cómo funciona todo esto. Si guardamos lo anterior como página web y lo abrimos con nuestro navegador, podremos identificar el enlace por la fuente azul y subrayada. Al pinchar sobre el mismo, el navegador lo que hará es una petición de HTTP, en particular la petición GET. ¿A quién? Pues al servidor www.ite.educacione.es. ¿Qué recurso pedirá? El recurso index.html. El servidor responderá mediante HTTP y en la respuesta incluirá una página web, que si investigamos (ver código fuente de la página), veremos que es... ¡una página HTML con sus etiquetas!