Cómo agregar direcciones URL a imágenes

Agregue una URL a una imagen si su imagen representa una página web o un sitio web completo. Las empresas, por ejemplo, a menudo incluyen direcciones URL de sitios web dentro de las imágenes del producto para que los consumidores sepan dónde obtener más información sobre el producto con solo ver la imagen. Puede agregar direcciones URL dentro de la imagen para verlas sin conexión o como un enlace interactivo o al pasar el mouse para verlas en Internet.

Adición de URL gráfica

Paso 1

Abra su imagen en un programa de diseño gráfico.

Paso 2

Haga clic con el mouse cerca de la parte superior o inferior de la imagen donde desea insertar la URL. Elija un área que solo contenga el fondo de la imagen, ya que sus espectadores no verán esta área claramente una vez que esté cubierta con texto. Para una fotografía tomada al aire libre, por ejemplo, inserte el texto en el área del cielo.

Paso 3

Seleccione la opción dentro de su programa gráfico para agregar texto.

Paso 4

Elija un color de texto que se destaque contra el color de fondo de la imagen. Para una fotografía tomada de noche con un fondo oscuro, por ejemplo, elija "blanco" como color de texto.

Paso 5

Escriba la URL en el área de texto. Ajuste el tamaño del texto para que ocupe la mayor parte del fondo de la imagen, pero no se extienda más allá de la imagen ni entre los detalles de la imagen principal.

Paso 6

Guarde la imagen con un nuevo nombre, como photoname-URL.jpg, para no anular la imagen original sin editar.

Adición de URL en línea

Paso 1

Abra el código HTML de la página web donde desea insertar la imagen.

Paso 2

Inserte la imagen dentro del HTML usando la etiqueta "img src" de la siguiente manera: Reemplace la palabra "yorupicture.jpg" con el nombre de su imagen.

Paso 3

Agregue la URL a la imagen para que cuando los visitantes vean la URL cuando muevan el mouse sobre la imagen usen la etiqueta "alt" de la siguiente manera:

Paso 4

Agregue una URL interactiva a la imagen para que cuando los visitantes hagan clic en la imagen, la URL se abra en la ventana del navegador. Use el siguiente código que incluye tanto el mouseover como la URL en la que se puede hacer clic dentro de la imagen: