The first thing you'll need to do is to create a thumbnail of your picture. A thumbnail, as you have probably surmised, is merely a smaller version of your picture. To create the thumbnail, we will use a photo editor to resize a copy of our image.
As mentioned earlier, the procedure below was performed using Photoshop. If Web Developers
use a different program, just look at the main heading for each step and use the equivalent procedure in your software.
The first thing you should do is to make a copy of your photo and work on that copy. This is purely a precaution, in case you accidentally overwrite your original photo with your thumbnail. If you have many photos or pictures for which you want to create thumbnails, create a new folder and copy all the photos into that folder.
(If you use Windows, remember not to drag the photos from one folder to another. If both folders are on the same drive, you'll be moving the photo instead of copying it. Instead, select the photos, right click them and select "Copy". Go to the new folder, right click and select "Paste".)
To load the picture you are going to resize in Photoshop, click "File | Open" and select the image. Note that "File | Open" means click the "File" menu, followed by the "Open" item on the menu that appears. I shall use this same kind of shorthand to describe the procedure for clicking various menu items in the rest of this article.