How to Link a Thumbnail to a High Resolution Photo

Using image thumbnails is one way to improve the appearance and loading time of your website. A thumbnail is a smaller version of an image that, when clicked, links to the full-size image. Thumbnails can be useful if you want to display multiple pictures on a single page, such as a portfolio or image gallery.

Instructions

1. Create the link to the high resolution photo. Copy the following code, changing "HighResURL" to the correct URL for the full-sized photo.

   <a href="HighResURL.jpg">

2. Insert the image code for the thumbnail next to the link you created above. Copy the code below and replace "ThumbnailURL" with the URL for the thumbnail image.

   <img src="ThumbnailURL.jpg">

3. Place the following code directly after the image code to close the link.

   </a>

Tips & Warnings

• The images must be uploaded from your computer to your server or to an image host online before you can include them on your website.

References

• The Free Dictionary: Thumbnail

Resources

• Optimizing Design: Thumbnails