Todo esto lo consigue el elemento <A> (por Anchor, en inglés = ancla o punto de anclaje). En lo sucesivo le llamaremos enlace o sinplemente link (en inglés link=eslabón o enlace).
Pero seguramente te preguntarás qué es eso de un "link". Pues un link es un área de la pantalla, que puede contener una o varias palabras o una imagen, que es "sensible" al puntero del ratón, y al ponerlo sobre ella y pulsar el botón izquierdo el visualizador llamará a la página que tiene asignada el link. Habitualmente por defecto los visualizadores señalan un área linkada subrayándola, si es texto, o poniéndole un borde si es una imagen, ambas cosas en color azul. Por supuesto, eso se puede cambiar en las configuraciones de visualizador. Si no se desea que aparezca el subrayado para mejorar la estética en algunos casos, se puede parametrizar con una instrucción de estilo.
Se escribirá:
<A HREF="http://www.miservidor.es/mifichero.htm"> Link de prueba </A>.Y se vería así: Link de prueba
Si lo que se desea es que aparezca sin subrayado o de otro color, o ambas cosas, se puede recurrir a una instrucción de estilo. Así:
<A HREF="http://www.miservidor.es/mifichero.htm"
style="color:red; text-decoration:none";> Link de prueba </A>.
Y se vería así: Link de prueba
(Esto puede que no funcione en algunos navegadores antiguos)El elemento <A> tiene dos atributos: HREF y NAME.
En el ejemplo de arriba al atributo HREF se le asigna el valor que aparece entre comillas: "http://www.miservidor.es/mifichero.htm". El texto sobre el que se monta el enlace es Link de prueba y realiza un link con el fichero mifichero.htm que está en el servidor www.miservidor.es.
Esta forma de escribir la ruta del link de forma completa, se utiliza cuando hay que saltar de una máquina a otra, si el enlace es para otra página de nuestro propio servidor es suficiente escribir la ruta virtual corta: /mifichero.htm o bien: /otro_directorio/mifichero.htm según proceda.
Como has visto, el punto de enlace se realiza en el texto escrito antes del cierre del elemento </A>, pero también puede hacerse con una imagen cualquiera, que iría en lugar del texto, incluso puedes poner el texto junto con una imagen. Por ejemplo para hacer un link que nos lleve al índice desde una bola roja, se escribe:
Ir al índice <A HREF="indice.htm"> <img src="bolaroja.gif"> </A>.Y este sería el resultado:
Ir al índice <A HREF="indice.htm"> <img src="bolaroja.gif" border=0> </A>.Y este sería el resultado:
Estas precauciones son ineludibles en el caso de servidores montados en máquinas con sistema operativo UNIX. En el caso de que el servidor resida en una máquina con Windows NT o Windows 95/98, es indiferente. Si no se sabe el sistema que tiene la máquina, es mejor atenerse a la forma UNIX.
Dentro de los parámetros pasados a HREF, podrás ver que al principio pone http://, esto es, el tipo de servicio al que el visualizador va a llamar, y hay varios :
| Servicio | Descripción | Ejemplo | Efecto |
|---|---|---|---|
| http:// | Servicios WWW | <A HREF="http://www.uv.es/"> WWW</A> | WWW |
| ftp:// | Servicios FTP | <A HREF="ftp://ftp.uv.es/">FTP</A> | FTP |
| news:// | Servicios NEWS | <A HREF="news://news.uv.es/">NEWS</A> | NEWS |
| mailto:// | Servicios E-mail | <A HREF="mailto:jac@uv.es/">E-mail</A> | |
| file:///C| | Fichero local | <A HREF="indice.htm/">Fichero</A> | Fichero |
<A HREF="indice.htm" TARGET="Ventana-2"> </A>Esta instrucción mostrará la página indice.htm pero con otra ventana del visualizador, es decir tendremos lanzado el visualizador 2 veces. Del mismo modo, el atributo TARGET puede utilizarse para salir de una pantalla compuesta de frames. En efecto, si estamos en una pantalla con, por ejemplo, dos frames, cualquier link invocado desde cualquiera de ellos, hace que la página llamada aparezca en ese mismo frame. Para volver a una pantalla "normal" sin frames, se puede escribir un link con la sintaxis siguiente:
<A HREF="indice.htm" TARGET="_parent"> </A>Existen otros valores para TARGET: TARGET="_blank": Para que el enlace se muestre en una nueva ventana vacía. También puede darse un nombre cualquiera con el mismo efecto.
TARGET="_self": Para mostrar el enlace en la misma ventana o frame que lo referencia (valor por defecto).
TARGET="_top": El documento solicitado se cargará en la pantalla actual, ocupando toda la ventana y destruyendo la estructura de frames anterior, si existe.
Como se acaba de ver, el atributo HREF sirve para enlazar con otro documento, que puede estar en un servidor o ser un fichero local, pero que siempre se nos presentará desde la primera línea del mismo.
El atributo NAME se utiliza para definir algo así como "un punto de aterrizaje" en cualquier línea del documento de destino, de forma que nos aparecerá en pantalla desde la línea deseada y no desde el principio. Esto es muy útil cuando se trata de documentos largos divididos en secciones.
Se escribirá así:
En el documento activo:
<A HREF="http://www.miservidor.es/mifichero.htm#punto1"> Ir al punto 1</A>En el documento destino:
<A NAME="punto1"></A>NAME también puede utilizarse para saltar de una línea a otra dentro de un mismo documento. Se escribirá así: Dentro del documento activo En la línea de partida:
<A HREF="#punto1">Ir al punto 1</A>En la línea de destino
<A NAME="punto1"></A>Por ejemplo, si haces "clik" aquí con el ratón, saltarás al principio de esta página. Como habrás visto en el cuadro de arriba, es posible enviar un e-mail desde un link con la instrucción: <A HREF="mailto:jac@uv.es">Enviar e-mail</A>. Con esta sintaxis se invoca al cliente de correo predeterminado para que abra una ventana con la dirección deseada ya escrita. Si además quieres que dicha ventana se abra con el asunto (subject) y el texto (body) ya escritos se puede conseguir así:
<A HREF="mailto:jac@uv.es?&subject=Asunto de prueba&body=Texto de prueba">Enviar e-mail</A>
Con los links, al igual que con los formularios, es posible moverse usando la tecla de tabulación, para conseguir que el enfoque salte de un link a otro en un cierto orden. Para ello se utiliza el atributo tabindex. Por ejemplo, pulsa la tecla "Tab":
<A HREF="tablas.htm" tabindex="2">Tablas</A>
<A HREF="imagen1.htm" tabindex="3">Imágenes</A>
<A HREF="body.htm" tabindex="1">Body</A>
Esto solamente funciona con versiones recientes de navegadores. Otro atributo reciente de los links es title que permite escribir una descripción del link sin necesidad de pulsar en él, simplemente poniendo encima el puntero del ratón. Por ejemplo:
<A HREF="tablas.htm" title="Saltar a la sección de tablas">Tablas</A>
Se obtiene: Tablas
Debes saber que...
- El texto que pongas después del símbolo # puede ser cualquiera, siempre que no tenga espacios en blanco, caracteres especiales ni caracteres codificados, y por supuesto, que no esté repetido en el mismo documento de destino.
- Si en el documento de destino no existe el punto definido en el documento de origen, el visualizador nos presentará en pantalla la última línea del mismo.
- Cuando hagas un link, es preferible utilizar direcciones relativas. Si utilizas direcciones absolutas y después tienes que mover los ficheros por cualquier razón, tendrás que modificar todas las direcciones.
- Si al hacer un link, después del nombre de la máquina no pones el nombre de un fichero, por defecto el servidor entiende que se le pide la "home page" (página inicial) de ese directorio. Generalmente (aunque depende de la configuración del servidor) el fichero inicial de un directorio suele ser index.htm o default.htm
- Si un servidor no tiene definida página inicial, simplemente nos mostrará una lista de todos los ficheros y directorios que tenga en el directorio definido como raíz si el servidor tiene activada la opción de listar directorios, en caso contrario, dará un error.
- Si después de la dirección de la máquina a la que le haces el link en lugar de un nombre de fichero pones el de un directorio, generalmente el servidor nos mostrará un simple listado de los ficheros y directorios que éste contenga si el servidor tiene activada la opción de listar directorios, en caso contrario, dará un error.
- No sólo puedes montar el link sobre un texto, también puedes hacerlo sobre una imagen cualquiera. Es decir, después del link y antes de </A> puedes poner lo que quieras.
- El arte de escribir buen HTML reside en dar una buena estructura a la información. Siempre que puedas huye de crear páginas muy largas. Crea cuantas necesites, con buena estructura y enlázalas con cuantos links sean precisos.
- Recuerda: si tu trabajo HTML no va a residir en un servidor en red, y has utilizado direcciones absolutas, al hacer un link, no empieces con aquello de: "http://....". No funcionará.
- Si continuas deseando poner direcciones absolutas con ficheros locales, tendrá que ser así file:///C:/MIDIRECTORIO/mifichero.htm
- Después de C (que puede ser A, B, D o la unidad de disco que quieras) fíjate en que las barras que separan los directorios y ficheros son barras a la derecha.
No hay comentarios:
Publicar un comentario