La etiqueta a

Un enlace o link es un texto o imagen que conecta una información o documento con otro al pulsar sobre este, la web se basa en enlaces así que internet no tendría sentido sin esta etiqueta, ya que no podríamos re direccionar a ningún sitio en internet, la etiqueta encargada de añadir enlaces es la etiqueta <a> de ancla o anclaje, la cual requiere de como minimo un atributo, el atributo href, el cual sirve para añadirle una ruta de hacia donde queremos que nos dirija.

<a href="ruta donde queremos dirigirnos"></a>

Entre medio de estas etiquetas es donde va el texto, imagen o cualquier otro elemento que una vez pulsado nos dirigirá a la URL, archivo, o dirección que le especifiquemos. El código de aqui abajo es un enlace que nos dirijirá a Google

<a href="http://www.google.es">Enlace a Google</a>

Acciones al pulsar sobre un link

Al pulsar sobre un link pueden suceder varias cosas.
- Saltar a otra página o a otro lugar de la misma página.
- Descargar un archivo a tu ordenador que estuviera enlazado en dicho link.
- Abrir una aplicación.
- Abrir tu programa de Email para que envies un mensaje, etc...

El atributo target

Este atributo es usado para indicarle como tiene abrirse la página a la que vamos a dirigirnos, si no se añade este atributo la página se abrira en la misma ventana donde se encuentra el documento en el que estamos, esto equivale a añadirle el valor _self a dicho atributo, sin embargo si deseamos abrir la nueva página a la que nos dirige el enlace en una nueva ventana podemos utilizar el valor _blank.

<a href="http://www.google.es" target="_self">Enlace a Google en la misma ventana</a>
<a href="http://www.google.es" target="_blank">Enlace a Google en una nueva ventana</a>
Ejercicios

Abre el documento pruebas.html en el editor de texto Sublime Text 3 y envuelve la etiqueta imagen con una etiqueta enlace la cual te dirija al buscador de Google. Recuerda añadir la ruta a Google y que se habra en una nueva ventana.

<!DOCTYPE html>
<html>
  <head> 
    <title>Título de la página</title>
  </head>
  <body> 
    <!-- Esto es un comentario -->
    <h1>Mi primer encabezado de nivel 1</h1>
    <h2>Mi primer encabezado de nivel 2</h2>
    <h3>Mi primer encabezado de nivel 3</h3>
    <h4>Mi primer encabezado de nivel 4</h4>
    <h5>Mi primer encabezado de nivel 5</h5>
    <h6>Mi primer encabezado de nivel 6</h6>
    <p>Este es mi primer <b>párrafo</b> en html con una palabra en negrita.</br>
    Aquí he insertado un salto de líne con la etiqueta br</p>
    <p><i>Este es un nuevo párrafo en html en cursiva.</i></p>
    <a href="http://www.google.es" target="_blank" ><img src="ico-google.png" title="enlace a google" alt="imagen de google"></a>
  </body>
</html>

Cuando hayas acabado, guárdalo.

Daniel Fernández Velázquez

Me encanta aprender y practicar la programación web, Autodidacta y apasionado de la tecnología.