Añadir Enlaces

Un enlace sirve para conectar recursos entre sí. En el marco del estándar HTML tradicional, estos recursos serían cosas como páginas web e imágenes que tienen direcciones URLs. La especificación SVG utiliza enlaces XLinks, que son más potentes pero también más complicados que los enlaces HTML originales. En esta sección se trata el uso más básico de estos XLinks. Para más detalles sobre la especificación XLink, se remite al lector a la página web del Consorcio World Wide Web W3C que contiene esta especificación.

Para añadir un enlace o hipervínculo a un objeto, hay que hacer Clic con el Botón Derecho del Ratón sobre el objeto. En el menú que aparece a continuación, tenemos que seleccionar la opción Crear enlace. Aunque después de esta acción, parezca que no haya ocurrido nada, internamente se habrá añadido una envoltura (wrapper) <svg:a> alrededor del objeto (esto se puede comprobar mediante el cuadro de diálogo Edición icon Editor XML... (Mayús.+Ctrl+X)).

[Nota]Nota

La envoltura de enlace <svg:a> actúa como un grupo. Para editar un objeto con envoltura, hay que hacer un doble clic sobre el objeto para entrar dentro del grupo creado por la envoltura. Se puede crear por accidente una envoltura de enlace dentro de otra. Por ello, es muy recomendable prestar atención a la Zona de Información, o utilizar el cuadro de diálogo Edición icon Editor XML... (Mayús.+Ctrl+X) para no perder la pista del nivel en el que estamos trabajando.

Los atributos del enlace de un objeto se pueden modificar mediante el cuadro de diálogo Propiedades del enlace que podemos abrir seleccionando la opción Propiedades del enlace en el menú que aparece al hacer un segundo Clic con el Botón Derecho del Ratón sobre el objeto (esta vez, realmente se hace clic sobre la envoltura del enlace).

Cuadro de diálogo Propiedades del enlace.
El cuadro de diálogo Propiedades del enlace.

Para enlazar el objeto con otra página web, solo es necesario introducir en el atributo Href la dirección de la página. Un ejemplo de dirección puede ser "http://www.w3.org/" (sin las comillas), que es la del sitio web del Consorcio World Wide Web.

El siguiente listado muestra un archivo SVG que contiene el dibujo de un cuadrado azul que sirve de enlace a la página web "http://www.w3.org/". Este archivo se puede visualizar directamente en un navegador web, o incluirlo mediante una etiqueta <object> dentro de un archivo XHTML.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"     1
   version="1.0"
   width="150"
   height="150"
   id="svg1341">
  <defs
     id="defs1343" />
  <g
     id="layer1">
    <a     2
       xlink:href="http://www.w3.org/"     3
       id="a1445">
      <rect     4
         width="90"
         height="90"
         x="30"
         y="30"
         style="fill:#0000ff;fill-opacity:0.75;stroke:#000000;
                stroke-width:1px"
         id="rect1353" />
    </a>
  </g>
</svg>
  

1

Declaración del espacio de nombres XLink.

2

Principio del objeto XLink.

3

Dirección de la página web objetivo del enlace XLink.

4

Objeto que sirve de soporte al enlace XLink, en este caso es un cuadrado azul.

Aunque el cuadro de diálogo Propiedades del enlace contiene muchos parámetros de entrada, solo algunos de ellos son realmente útiles. Un par de ellos solo admiten un valor.

Href

En este parámetro se debe introducir la dirección de la página web que se quiere enlazar. Al hacer clic sobre el objeto, el navegador nos llevará hasta la página web correspondiente a la dirección especificada.

Objetivo

Si la página web especificada contiene varios marcos (frames), con este parámetro se puede definir cuál de ellos hay que utilizar.

Tipo

Con este parámetro se puede especificar el tipo de enlace. En el estándar SVG solo se pueden utilizar enlaces del tipo simple.

Role

Este parámetro sirve para especificar el papel que se pretende tenga el recurso. Deber ser una dirección URL válida.

Arcrole

Con este parámetro se puede especificar más el papel que se pretende tenga el recurso. Deber ser una dirección URL válida.

Título

En este campo se puede introducir una descripción comprensible del recurso objetivo del enlace. Debe ser estar formada por una cadena de caracteres. Los navegadores pueden mostrar esta descripción dentro de una nota emergente que aparece cuando el cursor está sobre el objeto que sirve de enlace.

Mostrar

En este parámetro se puede especificar la forma en que el navegador va a mostrar el recurso enlazado. Los valores válidos de este parámetro son: new (el recurso se abre en una nueva ventana del navegador), replace (el recurso enlazado sustituye el contenido actual de la ventana del navegador), y embed (el recurso enlazado sustituye el contenido del objeto que soporta el enlace). Parece que aunque el valor especificado en este parámetro sea replace, el navegador Firefox se comporta como si el valor fuera embed.

Actuar

Con este parámetro es posible especificar si el recurso enlazado debe ser recorrido inmediatamente. Los valores válidos de este parámetro son: 'onRequest' (para que el navegador recorra el recurso enlazado por completo, es necesario que se ejecute alguna acción concreta, por ejemplo, un clic del ratón, o se complete la carga de un recurso incial).