Equipo 5 LINKS
Que es un Link? Es un enlace o nexo de unión clickeable, que aparece resaltando en un documento HTML. Este nos une con otros elementos, bien sean otros documentos, imágenes o archivos, dentro o fuera del mismos servidor, etc. Hay 3 tipos fundamentales: Enlaces a otras paginas, dentro o fuera de nuestro servidor Enlaces a puntos concretos de paginas, dentro o fuera de nuestro servidor Enlaces a objetos, imágenes, etc. Un link normalmente aparece coloreado en azul, si no ha sido clickeado, o en rojo si lo ha sido ya. Recordaremos que no tienen por que ser necesariamente estos colores, pues se pueden modificar a nuestro gusto
Links a otras paginas Por norma general los tags <A> </A> delimitara una parte del documento que representara un link. Ejemplo: Si escribimos <A HREF=“ ../libro.html“> Pagina principal del libro de HTML. </A> Lo que estamos haciendo es crear un enlace con la pagina principal del libro de HTML. Esto presentaría el siguiente aspecto: Pagina Principal del libro de HTML. Si clickeabamos sobre la parte azul nos conectaríamos, como ya hemos dicho, con la pagina principal del libro de HTML. Esto era un link a una pagina dentro del mismo servidor.
Veamos un ejemplo con otro servidor: Si escribimos <A HREF= “http://www.upv.es“ > UPV </A> Esto presentara el siguiente aspecto: UPV Otro seria: <A HREF= http://navel.upv.es/~rsoria/libro/libro.html> Libro de HTML </A> El cual presentaría el siguiente aspecto Libro de HTML Aquí le hemos dado la dirección de la maquina, la ruta y la pagina En general la forma de hacerlo es: <A HREF=“ protocolo://direccion y si es necesario ruta y pagina“ >texto, o no necesariamente texto </A>
A lo que va entre comillas, protocolo, dirección, etc A lo que va entre comillas, protocolo, dirección, etc., se le llama URL Los protocolos pueden ser: HTTP FTP MAILTO GOPHER TELNET NEWS WAIS….. Ejemplos de ellos serán: <A HREF= “ http://navel.upv.es“ > Servidor UNIX de la EUG. </A> <A HREF=“ ftp://ftp.microsoft.com>Microsoft</A> También se pueden utilizar los links para enviar un correo electrónico: <A HREF=“ mailto:rsoria@novel.eugan.upv.es“ >Escríbeme.</A> Tras mailto: podemos poner cualquier dirección de correo electrónico . El browser o lector se encargara de abrir la ventana correspondiente si se clickea sobre el.
El aspecto de esto seria: Escríbeme http significa: (HyperText Transfer Protocol), Protocolo que transfiere las paginas HTML y los documentos en ellas puestos, así como las imágenes, videos, gráficos, etc.
Links a partes concretas de otras paginas Para acceder a una parte en concreto de una pagina hemos de colocar en esta y en la posición deseada lo que se conoce como puntero o etiqueta, y que presenta el siguiente aspecto: <A NAME=“nombre“ > Esto no se visualizara en la pagina Para acceder al citado puntero o etiqueta hemos de realizar un link, al igual que antes, pero especificando el nombre: <A HREF= “#nombre“>texto o lo que sea </A> Para ir a unas parte de un documento en una maquina cualquiera pondremos:
<A HREF=“protocolo://dirección y si es necesario ruta y pagina#nombre“>texto, o lo que sea </A> Ejemplo: Al comienzo de <BODY> <A NAME=“Principio“> Si escribimos <A HREF=“htpp://navel.upv.es/~rsorial/www/libro/links/links.html#principio“>Principio del documento </A> O si escribimos <A HREF=“#principio“>Principio del documento </A> Veremos: Principio del documento
Al pulsar sobre cualquiera de ellos iremos a donde pusimos la etiqueta principio. Si deseamos acceder a una etiqueta de otro documento situado en nuestro servidor debemos indicar el documento y el nombre de la etiqueta, por ejemplo, para ir a la pagina principal del libro, y concretamente a la botonera de selección de termas, hacemos lo siguiente: 1.- Poner una etiqueta en el punto de la pagina deseado, por ejemplo: <A NAME=“main“> 2.-Escribir el correspondiente link: <A HREF=“./libro.html#main“>Ir a la botonera de la pagina principal.</A> Esto presentaría lo siguiente: Ir a la botonera de la pagina principal Aplicando todo esto podemos hacer cosas como: <CENTER><A HREF=“#uno</A>|<A HREF=“#dos“>Dos</A>|<HREF=“»tres</A></CENTER> Que se vería como: Uno|Dos|Tres
LINKS QUE TRAEN COSAS También se pueden utilizar los links para que cuando alguien clikee sobre ellos se les proporcione objetos como ficheros, imágenes, videos… lo único que se debe de hacer es un link y en lugar de una pagina poner el objeto deseado. Ejemplo: <A HREF=“links.jpg“>Trae una imagen.</A> Quedando como: Trae una imagen Si se clikea sobre el se indicara al lector o browser que traiga el objeto al que apunta el link.
CLICKEABLE QUE NO SEA TEXTO LINKS CON UN ELEMENTO CLICKEABLE QUE NO SEA TEXTO También podemos hacer que el elemento a clickear no sea necesariamente texto, puede ser una imagen, por ejemplo, incluso la misma imagen que deseamos obtener. Ejemplo: <CENTER><A HREF=“../imágenes/img01.jpg“><IMG SRC=“../imágenes/img01.jpg BORDER=1></A></CENTER> Que se vería como:
También se puede poner sin borde: <CENTER><A HREF=“../imágenes/img01.jpg“><IMG SRC=“../imágenes/img01.jpg BORDER=0></A></CENTER> Del mismo modo se puede utilizar una imagen para hacer un link a otra pagina o a parte de una. Ejemplo: <A HREF=“#cuatro“><IMG SRC=“../imágenes/img02.jpg“></A> Quedaría así: este nos puede desplazar al punto o etiqueta cuatro De esta pagina
LINKS QUE CREAN NUEVAS VENTANAS Otra peculiaridad de los links es la propiedad de mantener la ventana desde la que pulsamos y hacer que el elemento clickeado aparezca en una nueva ventana. Esto se puede aprecias si pulsamos la tecla WINDOW de nuestro browser o lector. En le aparecerá la nueva ventana. La forma de hacer esto es la siguiente: 1.- escribimos un link tal cual lo conocemos <A HREF=“ejem01.html“>pincha</A> 2.- añadiremos el comando TARGET=“blank“tras el URL, la opcion_blank significa nueva ventana. 3.- <A HREF=“ejem01.html“ TARGET=“_blank“>Pincha</A> El efecto de esto seria el ver como emerge una nueva ventana con el elemento al que apunte el link.