How To Insert An Image Into A Link

Table of contents:

How To Insert An Image Into A Link
How To Insert An Image Into A Link

Video: How To Insert An Image Into A Link

Video: How To Insert An Image Into A Link
Video: How to make a picture into a URL 2024, May
Anonim

The syntax of the HTML language allows you to make hyperlinks not only textual, but also graphical. For a site visitor, such a link looks like an image, and when you click on the image, you are taken to another web page.

How to insert an image into a link
How to insert an image into a link

Instructions

Step 1

Using any graphics editor, reduce the image. Its size in any of the coordinates should not exceed 200 pixels. It is better if the picture has a horizontal layout. This can be, for example, a virtual button, the inscription on which is made in an artistic font. The image format must be one of the following: JPG, PNG, GIF. The first is preferred for photographs, and the remaining two are preferred for line art (this is the best compression). Be sure to save the result of the change under a new name so as not to spoil the original.

Step 2

Upload the image file to the server in the folder where the HTML file is located. To carry out such a download, you can use the web interface (if available from the hosting provider) or any FTP client program.

Step 3

Place the following code snippet in the desired place in the HTML file:, where the expression after the "href =" operator is the address to which the link leads, and someimage

Step 4

For some users, the display of images in the browser is disabled. Therefore, it is advisable to place an explanation of where the link leads directly under the picture. In that case, modify the above code snippet to look like this:

Insects closeup. Explanatory text will appear below the image. Clicking on it will also take you to the link.

Step 5

After uploading the updated version of the HTML file to the server, open the corresponding page in the browser, and then make sure that the image is displayed and the link is valid. The transition along it should occur when you click both on the image and on the explanatory inscription located under it (if any).

Recommended: