Módulo 4. Creación de enlaces.
Uno de los elementos más característicos del World Wide Web es la integración del concepto de hipertexto. Como ya se indicó en el Módulo 1, mediante enlaces hipertextuales podemos enlazar documentos entre sí, de manera que pasamos de unos a otros simplemente haciendo clic con el ratón sobre el texto que funciona como elemento activo del enlace (y que normalmente aparece en el documento resaltado en diferente color y subrayado).
Pero lo más importante de este tipo de enlaces, es que no se limitan a documentos que estén
dentro de nuestro mismo Web, ni siquiera de nuestra misma máquina(servidor), sino que
podemos crear enlaces a cualquier documento que se encuentre en la red, en cualquier parte del mundo. Y aun más, podemos no sólo crear enlaces entre documentos HTML, sino enlazar también con imágenes, sonidos, otras herramientas de Internet (gopher, FTP, etc.) e incluso con sistemas de correo electrónico.
El elemento central de todo esto son los llamados enlaces (en inglés "Links"). Estos enlaces pueden crearse a partir de textos o imágenes, y se activan, como se ha indicado anteriormente, haciendo simplemente clic con el ratón. En este módulo veremos cómo crear enlaces dentro de un documento HTML, y los distintos tipos de enlaces que podemos utilizar.
En los capítulos anteriores nos hemos encontrado con frecuencia una frase como la siguiente:
Veamos un ejemplo.
Y simplemente haciendo clic sobre la palabra "ejemplo", que aparece realzada, hemos conseguido que se abra en pantalla una nueva página.
Esto es lo que se conoce normalmente como enlace hipertexto, o simplemente enlace. Los enlaces son la base de la estructura del World Wide Web, y lo que ha dado a esta herramienta la supremacía sobre otras(como el Gopher), debido a su flexibilidad y al hecho de que podemos situar los enlaces en cualquier punto de nuestra página.
Crear un enlace no es complicado, de hecho es bastante más simple que algunas otras cosas de las que hemos hecho hasta ahora. Sin embargo, para ello es necesario que conozcamos previamente la dirección de la página, imagen, sonido, o en general del recurso que vayamos a invocar por medio del enlace.
De modo que la etiqueta <A></A>es la que define un enlace hipertexto dentro de un documento HTML.
En HTML hay varios tipos de enlaces, como veremos más adelante, pero todos tienen una estructura muy semejante, que podemos representar del modo siguiente:
<A HREF="xxx">aaaaa</A>
Donde:
xxx(entre comillas, por ser el valor de un atributo) representa la URL del recurso (página HTML, imagen, sonido, etc.) que será invocado (se cargará o ejecutará) al activar el enlace.
aaaaarepresenta el texto que actuará como elemento activo del enlace (es decir, en el que habrá que hacer clic para activar el enlace en cuestión).
Hasta ahora hemos visto un solo tipo de enlace, que es aquel que usamos para enlazar nuestra página con otra, que esta localizada fuera de nuestra máquina. Esto es lo que se llama un enlace remoto, y puede considerarse como la forma más genérica de enlace. Se caracteriza por que como valor del atributo HREF se introduce la URL completa del recurso a invocar.
Sin embargo hay otros muchos tipos de enlaces posibles. Nosotros sólo vamos a ver los principales, que son:
Enlaces Remotos (ya los hemos visto).
Enlaces Locales (en los que el recurso invocado por el enlace esta en nuestra misma máquina).
Enlaces a otras herramientas Internet (Gopher, FTP).
Enlaces a correo electrónico.
Enlaces internos (dentro de una misma pagina).
Otras formas de enlaces.
A continuación veremos con cierto detalle cada uno de estos tipos de enlace, cómo crearlos y que estructuras y códigos se utilizan.
Se denominan enlaces locales (por oposición a los enlaces remotos que ya hemos visto) a aquellos que invocan recursos localizados en la misma máquina (ordenador o servidor) que la página en la que se encuentra el enlace.
Los enlaces locales son probablemente los más comunes. Por ejemplo, todas las páginas de un mismo web se encuentran normalmente unidas por medio de enlaces locales (salvo que el web se encuentre distribuido entre varios servidores).
En este curso, todos los enlaces que utilizamos para enlazar el documento principal con los distintos subdocumentos, son enlaces locales. Veamos esto con mayor detalle (enlace local)
En realidad, los enlaces locales no son sino un caso específico de los enlaces remotos. Es posible hacer un enlace local poniendo la URL completa, pero por razones de economía, no suele hacerse.
En los últimos años hemos asistido a un enorme auge del WWW, hasta el punto de hacer desaparecer prácticamente otras herramientas que no hace mucho eran de uso común, aunque muchas de éstas aún son utilizadas. Una de las características más sobresalientes del WWW y del HTML es que nos permite enlazar con estas herramientas del mismo modo y con la misma facilidad como lo haríamos con otra página HTML.
A continuación veremos dos casos concretos: Gopher y FTP.
GOPHER.
El Gopher fue la primera herramienta de navegación interactiva que se utilizó en Internet para substituir al sistema de terminales remotos (telnet).
Gopher se basaba en sistemas de menús jerárquicos, que permitían un tipo de navegación asistida, mucho más rígida y menos versátil que la que obtenemos por medio del WWW. Tuvo unos años de predominio, hasta que la aparición del WWW prácticamente lo borró del mapa.
Sin embargo, aún existen algunos gophers (no muchos) en funcionamiento, y podemos enlazar con ellos desde nuestras páginas HTML por medio de enlace hipertexto, muy semejantes a los enlaces remotos que hemos utilizado para enlazar entre sí páginas HTML.
FTP.
FTP son las iniciales de "File Transfer Protocol" (Protocolo de Transferencia de Archivos en inglés). El FTP fue el primer protocolo implementado en Internet para permitir la transferencia de diversos tipos de archivos a través de la red. Al igual que en el caso del Gopher, es posible enlazar con servidores FTP desde nuestras páginas HTML, de un modo similar al que emplearíamos para crear un enlace remoto.
Veamos algunos ejemplos.
La estructura de enlaces hipertexto implementada en la especificación HTML es tan flexible, que incluso nos permite crear enlaces directamente a sistemas de correo electrónico, haciendo uso de las prestaciones de algunos navegadores que incluyen sistemas de gestión de correo electrónico integrados.
Un ejemplo de enlace a correo electrónico podría ser el siguiente:
apareja@brix.extro.es(Dirección falsa)
Si hacemos clic en el enlace de arriba, se nos abrirá una ventana de correo electrónico. En el campo "To:" (Para:), aparece ya introducida de forma automática la dirección de correo electrónico a la que se enviará el mensaje (apareja@brix.extro.es), de modo que no tenemos necesidad de introducirla nosotros manualmente.
Ahora sólo tenemos que introducir el texto que deseemos, y pulsar el botón "Send", y el mensaje será enviado a la dirección correspondiente, siempre que tengamos bien configurado el correo electrónico de nuestro navegador. (Pero es mejor que no lo intentemos con el enlace de arriba, porque no conseguiremos que nuestro mensaje llegue a ninguna parte: se trata de una dirección totalmente falsa).
Hay que tener en cuenta que para que estos enlaces sean operativos (para que funcionen), es preciso que nuestro navegador tenga un sistema de gestión de correo electrónico integrado. Por lo demás, los enlaces a correo electrónico son muy semejantes a todos los enlaces que hemos visto hasta ahora, con mínimas diferencias.
La principal ventaja de este tipo de enlaces es que nos permite conectar directamente con las direcciones de correo electrónico que figuran en la página web que visitamos, sin necesidad de abandonar el navegador, y sin tener que introducir manualmente las direcciones (que a veces no son demasiado nemotécnicas) en nuestro programa de correo electrónico.
El principal inconveniente, como ya se ha indicado, es que no todos los navegadores poseen sistemas integrados de gestión de correo electrónico. Aquellos que no lo tengan, no podrán aprovechar este tipo de enlaces, por lo que es conveniente que indiquemos claramente en nuestra página las direcciones de correo electrónico, al margen de que creemos o no enlaces directos.
Hemos dejado para el final los enlaces internos, porque son los que más difieren del esquema general, y en cierto modo los más difíciles de comprender.
Se denominan enlaces internos a aquellos que se crean para enlazar partes de una página con otras, es decir: no se invoca ningún recurso HTML, sino que al activarlos simplemente se "salta" a otra parte de la página.
Veamos un ejemplo.
Los enlaces internos son especialmente útiles cuando trabajamos en páginas muy largas, o cuando queremos crear páginas muy estructuradas, por ejemplo creando índices al principio de las páginas que nos permitan ir directamente a secciones determinadas, sin necesidad de desplazarnos a lo largo de la página entera.
Un ejemplo de enlaces internos se puede ver al principio de cada módulo de este curso: los enlaces que aparecen en la sección de contenido son simplemente enlaces internos que nos permiten saltar directamente a la sección correspondiente.
Todos los enlaces que hemos visto hasta ahora utilizaban texto como elemento activo del enlace. Sin embargo es posible crear enlaces utilizando como elemento activo otros elementos HTML. Los más corrientes son aquellos enlaces que como elemento activo utiliza una imagen (estática o en movimiento). Sin embargo, estos enlaces los veremos con detalle más adelante, cuando veamos las imágenes y los mapas activos.