Aprenda a configurar la navegación entre sus páginas web. Enlace archivos y documentos, actualice, cambie y pruebe enlaces en Dreamweaver.

Antes de crear un vínculo, deberá saber cómo funcionan las rutas absolutas, las relativas al documento y las relativas a la raíz del sitio. Puede crear varios tipos de vínculos en un documento:

  • Un vínculo con otro documento o archivo, como un archivo gráfico, de película, PDF o de sonido.

  • Un vínculo de anclaje con nombre, que salta a un emplazamiento específico dentro de un documento.

  • Un vínculo de correo electrónico, que crea un mensaje de correo electrónico en blanco con la dirección del destinatario ya rellenada.

  • Vínculos nulos y de script, que permiten adjuntar comportamientos a un objeto o crear un vínculo que ejecuta código JavaScript.

Puede utilizar el inspector de propiedades y el icono de señalización de archivos para crear vínculos desde una imagen, un objeto o texto hasta otro documento o archivo.

Dreamweaver crea los vínculos con otras páginas del sitio empleando rutas relativas a documentos. También puede indicar a Dreamweaver que cree nuevos vínculos utilizando rutas relativas a la raíz del sitio.

Nota:

guarde siempre un archivo nuevo antes de crear una ruta relativa al documento, pues esta no es válida sin un punto de partida preciso. Si crea una ruta relativa al documento antes de guardar el archivo, Dreamweaver utilizará temporalmente una ruta absoluta que comenzará por file:// hasta que guarde el archivo. Cuando guarde el archivo, Dreamweaver convertirá la ruta file:// en una ruta relativa.

Puede adjuntar un comportamiento a cualquier vínculo de un documento. Puede emplear los comportamientos siguientes a la hora de insertar elementos vinculados a los documentos:

Establecer texto de la barra de estado

Determina el texto de un mensaje y lo muestra en la barra de estado, que se encuentra en la parte inferior izquierda de la ventana del navegador. Por ejemplo, puede usar este comportamiento para describir el destino de un vínculo en la barra de estado en lugar de mostrar el URL al que está asociado.

Abrir ventana del navegador

Abre un URL en una nueva ventana. Se pueden especificar las propiedades de la nueva ventana, incluidos su nombre, tamaño y atributos (si se puede cambiar su tamaño, si tiene barra de menús, etc.).

Menú de salto

Edita un menú de salto. Puede cambiar la lista del menú, especificar otro archivo vinculado o cambiar la ubicación del navegador en el que se abre el documento vinculado.

Puede utilizar el icono de carpeta o el cuadro Vínculo del inspector de propiedades para crear vínculos desde una imagen, un objeto o texto hasta otro documento o archivo.

  1. Seleccione texto o una imagen en la vista de Diseño de la ventana de documento.
  2. Abra el inspector de propiedades (Ventana > Propiedades) y siga uno de estos procedimientos:
    • Haga clic en el icono de carpeta situado a la derecha del cuadro Vínculo para localizar y seleccionar un archivo.

      La ruta del documento vinculado aparecerá en el cuadro URL. Utilice el menú emergente Relativa a del cuadro de diálogo Seleccionar archivo para indicar si la ruta es relativa al documento o a la raíz del sitio y, a continuación, haga clic en OK. El tipo de ruta que seleccione solo afectará al vínculo actual. (Puede cambiar la configuración predeterminada del cuadro Relativa a para el sitio).

    • Escriba la ruta y el nombre de archivo del documento en el cuadro Vínculo.

      Para establecer un vínculo con un documento del sitio, introduzca una ruta relativa al documento o relativa a la raíz del sitio. Para establecer un vínculo con un documento externo al sitio, introduzca una ruta absoluta que incluya el protocolo (por ejemplo, http://). Puede utilizar este método para introducir un vínculo para un archivo que aún no se ha creado.

  3. En la lista desplegable Destino, seleccione una ubicación en la que abrir el documento:

    • _blank carga el documento vinculado en una nueva ventana sin nombre del navegador.
    • _parent carga el documento vinculado en el marco padre o en la ventana padre del marco que contiene el vínculo. Si el marco que contiene el vínculo no está anidado, el documento vinculado se cargará en la ventana completa del navegador.
    • _self carga el documento vinculado en el mismo marco o la misma ventana que el vínculo. Este destino es el predeterminado, por lo que normalmente no es preciso especificarlo.
    • _top carga el documento vinculado en la ventana completa del navegador, eliminando de esta forma todos los marcos.
    • _new carga el documento vinculado en una ventana nueva.
  1. Seleccione texto o una imagen en la vista de Diseño de la ventana de documento.
  2. Cree un vínculo de una de estas dos formas:
    • Arrastre el icono de señalización de archivo  (icono de mira telescópica), situado a la derecha del cuadro Vínculo del inspector de propiedades, y señale a un anclaje visible en el documento actual, a un anclaje visible en otro documento abierto, a un elemento que tenga asignado un ID exclusivo o a un documento del panel Archivos.

    • Mantenga pulsada la tecla Mayús y arrastre desde la selección y señale a un anclaje visible en el documento actual, a un anclaje visible en otro documento abierto, a un elemento que tenga asignado un ID exclusivo o a un documento del panel Archivos.

    Nota:

    Solo puede establecer un vínculo con otro documento abierto si los documentos no están maximizados en la ventana de documento. Para organizar los documentos en mosaico, seleccione Ventana > Organizar > Cascada o Ventana > Organizar > Mosaico. Cuando se señala a un documento abierto, este pasa al primer plano de la pantalla mientras se realiza la selección.

El comando Hipervínculo permite crear un vínculo de texto hasta una imagen, un objeto u otro documento o archivo.

  1. Sitúe el punto de inserción en el documento donde desea que aparezca el vínculo.
  2. Siga uno de estos procedimientos para mostrar el cuadro de diálogo Hipervínculo:

    • Seleccione Insertar > Hipervínculo.

    • En la categoría Común del panel Insertar, haga clic en el icono Hipervínculo.

  3. En el campo Texto, introduzca el texto del vínculo.
    En el menú desplegable Vínculo, seleccione el nombre del archivo con el que desea establecer el vínculo. También puede hacer clic en el icono de carpeta para localizar el archivo al que desea establecer el vínculo.

  4. En el menú emergente Destino, seleccione la ventana en la que deberá abrirse el archivo o escriba su nombre.

    En la lista emergente figuran los nombres de todos los marcos a los que ha asignado nombres en el documento actual. Si especifica un marco que no existe, la página vinculada se abrirá en una ventana nueva con el nombre que haya especificado. También puede seleccionar estos nombres de destino reservados:

    • _blank carga el archivo vinculado en una ventana de navegador nueva y sin nombre.
    • _parent carga el archivo vinculado en el conjunto de marcos padre o en la ventana del marco que contiene el vínculo. Si el marco que contiene el vínculo no está anidado, el archivo vinculado se cargará en la ventana completa del navegador.
    • _self carga el archivo vinculado en el mismo marco o ventana que el vínculo. Este destino es el predeterminado, por lo que normalmente no es preciso especificarlo.
    • _top carga el archivo vinculado en la ventana completa del navegador, quitando así todos los marcos.
    • _new carga el documento vinculado en una ventana nueva.
  5. En el cuadro Índice de fichas, introduzca un número para el orden de fichas.
  6. En el cuadro Título, escriba un título de página para el vínculo.
  7. En el cuadro Clave de acceso, introduzca un equivalente de teclado (una letra) para seleccionar el vínculo en el navegador.
  8. Haga clic en Aceptar.

de manera predeterminada, Dreamweaver crea vínculos con otras páginas del sitio empleando rutas relativas a documentos. Para utilizar rutas relativas a la raíz del sitio, debe definir en primer lugar una carpeta local en Dreamweaver eligiendo una carpeta raíz local que actúe como equivalente de la raíz del documento en un servidor. Dreamweaver utiliza esta carpeta para determinar las rutas relativas a la raíz del sitio de los archivos.

  1. Seleccione Sitio > Administrar sitios.
  2. En el cuadro de diálogo Administrar sitios, haga doble clic en el sitio deseado en la lista.
  3. En el cuadro de diálogo Configuración del sitio, expanda la Configuración avanzada y seleccione la categoría Datos locales.
  4. Establezca la ruta relativa de los vínculos nuevos seleccionando la opción Documento o Raíz del sitio.

    El cambio de esta configuración no convierte la ruta de los vínculos existentes después de hacer clic en Aceptar. La configuración solo afecta a los nuevos vínculos que cree con Dreamweaver.

  5. Haga clic en Guardar.

    La nueva configuración de ruta afecta solo al sitio actual.

Puede utilizar el inspector de propiedades para establecer un vínculo con una determinada sección de un documento creando en primer lugar anclajes con nombre. Los anclajes con nombre permiten establecer marcadores en un documento, que a menudo se colocan en un tema específico o en la parte superior del documento. Posteriormente podrá crear vínculos con esos anclajes con nombre que llevarán rápidamente al visitante a la posición especificada.

Para crear un vínculo con un anclaje con nombre, siga este procedimiento de dos pasos. En primer lugar, cree un anclaje con nombre. A continuación, cree un vínculo con dicho anclaje.

Creación de un anclaje

  1. En la ventana de documento, seleccione y resalte el elemento que desea definir como anclaje.

  2. Abra el inspector de propiedades y compruebe si el elemento seleccionado tiene un ID. Si el campo ID está en blanco, añada un ID. Por ejemplo, Anclaje.

    Creación de un anclaje
    Creación de un anclaje

    Después de agregar el ID, observe el cambio en el código. id="<nombre de ID>" se inserta en el código en la selección.

    ID de anclaje en el código
    Adición de anclajes para establecer vínculos

  1. En la vista de Diseño de la ventana de documento, seleccione texto o una imagen para crear un vínculo a partir de ellos.
  2. En el cuadro Vínculo del inspector de propiedades, introduzca un signo de número (#) y el nombre del anclaje. Por ejemplo, para establecer un vínculo con un anclaje denominado “top” en el documento actual, escriba #top. Para establecer un vínculo con un anclaje denominado “top” en un documento distinto de la misma carpeta, escriba nombrearchivo.html#top.

    Nota:

    los nombres de anclaje distinguen entre mayúsculas y minúsculas.

  1. Abra el documento que contiene el anclaje con nombre.

    Nota:

    Si no ve el anclaje, para que se vea seleccione Vista > Opciones de vista de diseño > Ayudas visuales > Elementos invisibles en la vista de diseño.

  2. En la vista de Diseño de la ventana de documento, seleccione texto o una imagen para crear un vínculo a partir de ellos. (Si es otro documento abierto, deberá cambiar a él).
  3. Siga uno de estos procedimientos:
    • Haga clic en el icono de señalización de archivos  (icono de mira telescópica) situado a la derecha del cuadro de texto Vínculo del inspector de propiedades y arrástrelo hasta el anclaje con el que desea establecer el vínculo: un anclaje en el mismo documento o un anclaje en otro documento abierto.

    • En la ventana de documento, pulse la tecla Mayús mientras arrastra el texto o la imagen seleccionada hasta el anclaje con el que desea establecer el vínculo: un anclaje en el mismo documento o un anclaje en otro documento abierto.

Cuando el usuario hace clic en un vínculo de correo electrónico se abre una nueva ventana de mensaje en blanco (utilizando el programa de correo asociado al navegador del usuario). En la ventana de mensaje de correo electrónico, el cuadro Para se actualiza automáticamente con la dirección especificada en el vínculo del mensaje de correo electrónico.

  1. En la vista de Diseño de la ventana de documento, coloque el punto de inserción donde desea que aparezca el vínculo de correo electrónico o seleccione el texto o la imagen que desea que aparezca como vínculo de correo electrónico.
  2. Siga uno de estos procedimientos para insertar el vínculo:
    • Seleccione Insertar > Vínculo de correo electrónico.

    • En la categoría Común del panel Insertar, haga clic en el botón Vínculo de correo electrónico.

  3. En el cuadro Texto, escriba o edite el texto del correo electrónico.
  4. En el cuadro Correo electrónico, escriba la dirección de correo electrónico y haga clic en Aceptar.
  1. Seleccione texto o una imagen en la vista de Diseño de la ventana de documento.
  2. En el cuadro Vínculo del inspector de propiedades, escriba mailto: seguido de una dirección de correo electrónico.

    No escriba espacios entre los dos puntos y la dirección de correo electrónico.

Relleno automático de la línea de asunto de un mensaje de correo electrónico

  1. Cree un vínculo de correo electrónico empleando el inspector de propiedades como se indica más arriba.
  2. En el cuadro Vínculo del inspector de propiedades, añada ?subject= tras el mensaje de correo electrónico y escriba un asunto detrás del signo igual. No introduzca ningún espacio entre el signo de interrogación y el final de la dirección de correo electrónico.

    La entrada completa tendría el siguiente aspecto:

    mailto:someone@yoursite.com?subject=Mail from Our Site

Un vínculo nulo es un vínculo no designado. Los vínculos nulos se utilizan para adjuntar comportamientos a objetos o texto de una página. Por ejemplo, puede adjuntar un comportamiento a un vínculo nulo para que cambie una imagen o muestre un elemento con posición absoluta (elemento AP) cuando el puntero se desplace sobre el vínculo.

Los vínculos de script ejecutan código JavaScript o llaman a una función JavaScript. Sirven para proporcionar a los usuarios información adicional sobre un elemento sin salir de la página actual. Los vínculos de script también pueden emplearse para realizar cálculos, validar formularios y otras tareas de procesamiento cuando el usuario hace clic en un elemento específico.

  1. Seleccione texto, una imagen o un objeto en la vista de Diseño de la ventana de documento.
  2. En el inspector de propiedades, escriba javascript:; (la palabra javascript, seguida de dos puntos, seguidos de punto y coma) en el cuadro Vínculo.
  1. Seleccione texto, una imagen o un objeto en la vista de Diseño de la ventana de documento.
  2. En el cuadro Vínculo del inspector de propiedades, escriba javascript: y, a continuación, código JavaScript o una llamada de función. (No escriba espacios entre los dos puntos y el código o la llamada).

Dreamweaver puede actualizar los vínculos con origen y destino en un documento cada vez que este se mueva o cambie de nombre en un sitio local. Esta función funciona mejor cuando se almacena todo el sitio (o una sección completa e independiente de este) en el disco local. Dreamweaver no cambia los archivos de la carpeta remota hasta que se colocan o desprotegen los archivos locales en el servidor remoto.

Para acelerar el proceso de actualización, Dreamweaver puede crear un archivo de caché en el que almacenará información sobre todos los vínculos de la carpeta local. El archivo de caché se actualiza de manera invisible a medida que se van añadiendo, modificando o eliminando vínculos del sitio local.

  1. Seleccione Edición > Preferencias (Windows) o Dreamweaver > Preferencias (Macintosh).
  2. En el cuadro de diálogo Preferencias, seleccione General en la lista de categorías de la izquierda.
  3. En la sección Opciones de documento de las preferencias General, seleccione una opción del menú emergente Actualizar vínculos al mover archivos.

    Siempre

    Actualizará automáticamente todos los vínculos con origen y destino en un documento seleccionado cada vez que este se mueva o cambie de nombre.

    Nunca

    No actualizará automáticamente todos los vínculos con origen y destino en un documento seleccionado cuando este se mueva o cambie de nombre.

    Mensaje

    Mostrará un cuadro de diálogo en el que aparecen todos los archivos afectados por el cambio. Haga clic en Actualizar si desea actualizar los vínculos de estos archivos o en No actualizar si desea dejar los archivos como estaban.

  4. Haga clic en Aceptar.

Creación de un archivo de caché para el sitio

  1. Seleccione Sitio > Administrar sitios.
  2. Seleccione un sitio y haga clic en Editar.
  3. En el cuadro de diálogo Configuración del sitio, expanda la Configuración avanzada y seleccione la categoría Datos locales.
  4. En la categoría Datos locales, seleccione Activar caché.

    La primera vez que cambie o quite vínculos conectados con archivos de la carpeta local después de iniciar Dreamweaver, Dreamweaver le pedirá que cargue la caché. Si hace clic en Sí, Dreamweaver cargará la caché y actualizará todos los vínculos al archivo que acaba de modificar. Si hace clic en No, el cambio se anotará en la caché, pero Dreamweaver no cargará la caché ni actualizará los vínculos.

    La caché puede tardar unos minutos en cargarse en sitios grandes, ya que Dreamweaver debe comprobar si está actualizada comparando las marcas de hora de los archivos del sitio local con las marcas grabadas en la caché. Si no ha cambiado ningún archivo fuera de Dreamweaver, puede hacer clic en el botón Detener cuando aparezca.

Recreación de la caché

  1. En el panel Archivos, seleccione Sitio > Avanzadas > Volver a crear caché de sitio.

Además de configurar Dreamweaver para que actualice los vínculos automáticamente cada vez que mueva o cambie de nombre un archivo, puede cambiar manualmente todos los vínculos (incluidos los vínculos nulos, de correo electrónico, FTP y script) para que señalen a otro lugar.

Esta opción resulta particularmente útil si desea eliminar un archivo con el que están vinculados otros archivos, pero puede utilizarla con otros fines. Por ejemplo, supongamos que vincula las palabras “películas de este mes” con /películas/julio.html en todo el sitio. Al llegar el 1 de agosto, cambiaría dichos vínculos para que señalaran a /películas/agosto.html.

  1. Seleccione un archivo en la vista Local del panel Archivos.

    Nota:

    si cambia un vínculo nulo, de correo electrónico, FTP o script, no necesita seleccionar un archivo.

  2. Seleccione Sitio > Opciones del sitio > Cambiar vínculo en todo el sitio.

  3. Rellene estas opciones en el cuadro de diálogo Cambiar vínculo en todo el sitio:

    Cambiar todos los vínculos a

    Haga clic en el icono de carpeta  para examinar y seleccionar el archivo de destino para el que desea anular el vínculo. Si cambia un vínculo de correo electrónico, FTP, nulo o script, escriba el texto completo del vínculo que desea modificar.

    Por vínculos a

    Haga clic en el icono de carpeta  para examinar y seleccionar el nuevo archivo con el que desea establecer el vínculo. si cambia un vínculo nulo, de correo electrónico, FTP o script, escriba el texto completo del vínculo de sustitución.

  4. Haga clic en Aceptar.

    Dreamweaver actualizará todos los documentos vinculados al archivo seleccionado, haciendo que señalen al nuevo archivo y usando el formato de ruta empleado por el documento (por ejemplo, si la ruta antigua era relativa al documento, la nueva también deberá serlo).

    Después de cambiar un vínculo en todo el sitio, el archivo seleccionado quedará huérfano (es decir, ningún archivo del disco local estará vinculado a él). Entonces podrá eliminarlo sin romper ningún vínculo del sitio local de Dreamweaver.

    Nota:

    dado que estos cambios se realizan localmente, deberá eliminar manualmente el archivo huérfano correspondiente en la carpeta remota y colocar o desproteger los archivos cuyos vínculos haya modificado para que los visitantes del sitio puedan ver los cambios efectuados.

Los vínculos no están activos en Dreamweaver, es decir, no se puede abrir un documento vinculado haciendo doble clic en el vínculo en la ventana de documento.

  1. Siga uno de estos procedimientos:
    • Haga clic con el botón derecho del ratón en el vínculo y seleccione Abrir página vinculada.

    • Pulse Control (Windows) o Comando (Macintosh) y haga doble clic en el vínculo.

    Nota:

    El documento vinculado debe encontrarse en el disco local.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea