8. HIPERENLACES
Una de las grandes características de una página Web es que se pueden insertas hiperenlaces. Un hiperenlace es un elemento que permite el acceso a otro recurso, página Web o archivo. Para incluirlos se utiliza la instrucción <A></A>. El texto o imagen que se encuentre dentro de los límites de la instrucción será sensible, esto quiere decir que si pulsamos con el ratón sobre él, se realzará la función de hiperenlace indicada por la instrucción <A></A>. Si el hiperenlace está indicado por un texto, éste aparecerá subrayado y en distinto color, si se trata de una imagen, ésta aparecerá con un borde rodeándola. Esta directiva tiene el parámetro href que indica el lugar a donde nos llevará el hiperenlace si lo pulsamos.
SI PONEMOS | SE VERÁ ASÍ |
<A href="portada.htm" target="_blank"> Pulsa aquí | Pulsa aquí |
<A href= "portada.htm"target="_blank"> <IMG src="imagen.jpg" width="120" height="90"></A> |
![]() |
Si situamos el ratón encima de la frase o imagen y pulsamos, el navegador accederá a la página Web indicada por el parámetro href, es decir, accederá a la página portada.htm. Compruebalo si quieres. Te falta por conocer el parámetro target que aprenderás al final de este capítulo.
Un hiperenlace también puede llevarnos a una zona de nuestra página. Para ello debemos marcar en nuestra página las diferentes secciones en las que se divide. Lo haremos con el parámetro name.
<A name="sección1"></A>
Esta instrucción marca el inicio de una sección dentro de nuestra página. La sección se llamará sección1. Para hacer un enlace a esta sección dentro de nuestra página lo haríamos de la siguiente forma:
<A href="#sección1">Primera Parte</A>
Un hiperenlace puede hacerse a cualquier tipo de fichero. Hemos visto cómo hacer enlaces a páginas Web o secciones dentro de una página Web, pero podríamos hacer un enlace a un grupo de noticias, a una dirección de correo o a un fichero cualquiera:
<A href="news://news.actualidad.es/">Noticias
de actualidad</A>
El segundo y tercer ejemplo resultan muy interesantes, pues en un caso puedes hacer que te escriban a tu dirección de correo electrónico y con el otro puedes permitir a tus visitantes que descargen ficheros a su ordenador pues el navegador intentará ejecutar el fichero, y si no puede hacerlo, como sería el caso de un fichero comprimido, preguntará al visitante si desea grabarlo en su ordenador.
Si estamos usando frames, debemos tener en cuenta en que ventana queremos que se muestre la nueva página enlazada. Por defecto se mostrará en la ventana donde se encuentre el enlace. Para poder escoger otra ventana debe añadirse un nuevo parámetro a la instrucción <A href= > </A>. Este parámetro se llama target y puede tener los siguientes valores :
target = "nombre_ventana"
Muestra el hiperenlace en la ventana cuyo nombre se indica.
target = "_blank"
Abre una nueva copia del visor y muestra el hiperenlace en ella.
(Si usamos Netscape esto provoca que tengamos funcionando dos
copias del programa).
target = "_self" Se
muestra el hiperenlace en la subventana activa.
target = "_parent" El
hiperenlace se muestra en el <FRAMESET>
definido anteriormente al actual. Si no hay ninguno se muestra a
pantalla completa suprimiendo todas las subventanas de la
pantalla.
target = "_top"
Suprime todas las subventanas de la pantalla y muestra el
hiperenlace a pantalla completa.
Ya has visto un ejemplo más arriba, cuando hemos hecho abrir una ventana para ver la página portada.htm.
Vamos a abrir nuestra página menu.htm e insertaremos enlaces en cada uno de los elementos de la lista; Uno en el primer elemento de la lista para que nos abra la página tablero htm, otro en el segundo elemento que abrirá la página form.htm y el tercero para que nos permita volver a la portada. Recordemos que nuestra web se iniciará con frames y por lo tanto vamos a hacer que cuando se abran las páginas lo hagan en la subventana inferior derecha, a la que pusimos el nombre de "portada":
<HTML> <HEAD> <TITLE>Indice</TITLE> </HEAD> <!-- A continuación se pone fondo azul y texto en negro--> <BODY bgcolor ="#FFFF00" text"#000000"> <OL> <LI> <A href="tablero.htm" target="portada"></A>Tablero <LI><A href="form.htm" target="portada"></A>Formulario <LI><A href="portada.htm" target="portada"></A>Volver </OL> </BODY> </HTML> |