HTML: Embed an image with a link - tutorial

It is a popular and user-friendly method to embed images on websites with a link via HTML. When the user clicks on the image, it takes them to a new web page. Just like for text links, you need the a href command to do this.

How to embed an image with a link via HTML

Images play a crucial role in web design. They appeal to the user, but at the same time they can be useful. For example, if you want to link to another website your domain, you can use an image for this. So it serves not only as an appealing diagram, but leads the reader directly to further content.

1. First, insert the desired image as usual on your website.
2. You then set the link with a href, only that instead of a word for the link yet another command is added, namely "img src".
3. This then looks like this, for example: <a href="Link.html"><img src="bild1.png"></a>

Display alternative text

Sometimes users may experience problems when loading web pages, for example if their internet connection is slow. Other readers may have disabled images to be displayed in the browser. For these cases, it is always a good idea to add an alternative text to your image. This will be displayed and serve as a link if the image does not load.The command will then look like this: <a href=“Link.html“><img src=bild1.png“ alt=“text“ /></a>