1. Introducción

Los hipervínculos, enlaces o links nos permiten enlazar con otro “sitio”, sea dentro o fuera de nuestra página; es decir, nos permiten navegar por Internet. Un hipervínculo supone enlazar la página web que estamos visualizando con:

• Otra página web
• Otra sección de la misma página
• Un archivo
• Un servidor FTP
• Un archivo o una aplicación para descargar
• Una secuencia de sonido
• Vídeo o multimedia
• Una dirección de correo
• Etc.

En esta unidad añadiremos unos enlaces a nuestra sitio web.

2. Crear enlaces

Con Kompozer es muy sencillo crear un hipervínculo a través del menú Insertar → Enlace o a través del icono correspondiente de la barra de herramientas.

Podemos crear los hipervínculos a partir de texto e imágenes, de forma que pulsando en ellos nos lleve a otra parte de la misma página, a otro archivo o página de nuestro sitio web o a una dirección URL. Para ello seleccionamos el texto o la imagen y pulsamos Insertar → Enlace. También podemos hacer clic con el botón derecho del ratón y seleccionar la opción Crear enlace.

• Vamos a crear otro documento html que vamos a llamar indice.html.
• Este documento va a ser el índice de nuestra página web por lo que pondremos lo siguiente:

• Y el título de la página será "Índice" y el color de fondo #EEFFAD.

2.1. Enlaces a otras páginas de nuestra web

• Seleccionamos la palabra "Inicio" y pulsamos Insertar → Enlace.
• En el cuadro de diálogo que se abre nos informa del texto seleccionado en Texto del enlace, Y nos permite elegir la Ubicación del enlace. En este caso queremos que enlace a una archivo local de nuestra propia web, en concreto a inicial.html por lo que hacemos clic en la carpeta y lo seleccionamos.
• Después tenemos dos opciones para marcar pero no marcaremos ninguna.
• También podemos definir el Destino. Es decir, dónde se abrirá la web a la que enlazamos.Las opciones que nos interesan son las siguientes:
  • En la misma ventana, sin marcos: La nueva web se abrirá en la ventana del navegador que estamos actualmente y perderemos de vista lo que estamos visualizando en este momento.
  • En una ventana nueva: El navegador abrirá una ventana o pestaña nueva con el contenido del enlace.
• Nosotros seleccionamos de momento la opción En una ventana nueva.
• Hacemos clic en Aceptar.
• Vemos que ahora la palabra Inicio aparece en color azul y subrayada. Ya tenemos nuestro primer enlace.
• Guardamos el archivo.
• Para probarlo podemos abrir nuestro archivo desde un navegador y hacer clic en Inicio. Comprobamos que se abre una nueva ventana/pestaña con el contenido de inicial.html.

• Acaba de poner los enlaces en las opciones Productos, Ofertas, Quienes somos y Contáctanos.
• Tendrás que crear un nuevo documento llamado productos.html y de título "Nuestros productos" para poder enlazarlo con Productos.
• Las opciones deben ser las mismas que en el caso de Inicio.
• Guarda el archivo indice.html.
• No hace falta que lo subas todavía a la plataforma porque vas a seguir trabajando en él.

2.2. Enlazar a una página externa

Ya tenemos creados los enlaces hacia nuestras páginas creadas, pero hemos dejado para el final dos enlaces de interés que está en Internet. El funcionamiento para crear estos dos enlaces es exactamente el mismo que en los casos anteriores sólo que en lugar de elegir un fichero de los que tenemos en nuestro disco duro pondremos la URL de la web a la que queremos enlazar.

• Seleccionamos la palabra Google y pulsamos Insertar → Enlace.
• En el cuadro de diálogo que se abre nos informa del texto seleccionado en Texto del enlace, Y nos permite elegir la Ubicación del enlace. En este caso NO queremos que enlace a una archivo local por lo que no usaremos la carpeta sino que escribiremos la dirección de Google. Lo mejor es abrir Google en un navegador y copiar el contenido de la barra de direcciones, para no equivocarnos.
• Después seleccionamos la opción En una ventana nueva.
• Hacemos clic en Aceptar.
• Vemos que ahora la palabra Google aparece en color azul y subrayada igual que el resto. Ya tenemos nuestro primer enlace externo.
• Guardamos el archivo.
• Para probarlo podemos abrir nuestro archivo desde un navegador y hacer clic en Google. Comprobamos que se abre una nueva ventana/pestaña con el buscador Google.

• Acaba de poner los enlaces en la opción YouTube.
• Las opciones deben ser las mismas que en el caso de Google.
• Guarda el archivo indice.html y súbelo a la plataforma

2.3. Enlazar a una dirección de correo

Pero también podemos enlazar a una dirección de correo para que cuando pinchen en cierta parte de nuestro documento al visitante se le abra su cliente de correo con nuestra dirección para que nos haga llegar un mensaje.

El sistema es el mismo, pero en este caso la dirección del enlace será una dirección de correo electrónico y marcaremos la opción Lo anterior es una dirección de correo electrónico.

Abrimos el documento contacta.html.

• Seleccionamos las primera dirección de correo que aparece "dudas@mitiendadeinformatica.es" y pulsamos Insertar → Enlace.
• En el cuadro de diálogo que se abre rellenamos la dirección de correo a la que llegarán los mensajes "dudas@mitiendadeinformatica.es".
• Marcamos la opción Lo anterior es una dirección de correo electrónico.
• Hacemos clic en Aceptar.
• Vemos que ahora la dirección de correo selecionada aparece en color azul y subrayada. Ya tenemos nuestro enlace a un correo.
• Guardamos el archivo.
• Para probarlo podemos abrir nuestro archivo desde un navegador y hacer clic en la dirección de correo. Comprobamos que se abre el cliente de correo que tengamos instalado.

• Acaba de poner los enlaces al resto de direcciones de correo.
• Las opciones deben ser las mismas que en el caso dedudas@mitiendadeinformatica.es.
• Guarda el archivo contacta.html y súbelo a la plataforma