How to Add URLs to Pictures

Techwalla may earn compensation through affiliate links in this story.
Add a URL to a picture.

Add a URL to a picture if your picture represents a web page or entire website. Companies, for example, often include website URLs inside product images so that consumers will know where to find out more about the product just by viewing the image. You can add URLs within the picture itself for offline viewing or as a mouseover or interactive link for Internet viewing.

Graphical URL Addition

Step 1

Open your picture in a graphic design program.

Step 2

Click your mouse near the top or bottom of the image where you want to insert the URL. Choose an area that only contains image background as your viewers will not see this area clearly once covered with text. For a photograph taken outside, for example, insert the text onto the sky area.

Step 3

Select the option within your graphic program to add text.

Step 4

Choose a text color that stands out against the image background color. For a photograph taken at night with a dark background, for example, choose "white" as your text color.

Step 5

Type the URL into the text area. Adjust the size of the text so that it fills up most of the image background, but does not extend beyond the picture or into the main image details.

Step 6

Save the image using with a new name, such as photoname-URL.jpg, so that you do not override the original unedited image.

Online URL Addition

Step 1

Open the web page HTML code where you wish to insert the picture.

Step 2

Insert the picture within the HTML using the "img src" tag as follows: Replace the word "yorupicture.jpg" with the name of your image.

Step 3

Add the URL to the image so that when visitors see the URL when they move their mouse over the image using the "alt" tag as follows:

Step 4

Add an interactive URL to the picture so that when visitors click the image, the URL opens in the browser window. Use the following code which includes both the mouseover and clickable URL within the picture:

Things You'll Need

  • Graphic design software

  • HTML or text editor

references & resources