I need to take a photo centered on a web page, and shrink it to approximately 1/4 of it's size while moving it to the top right corner of the page.

I have ACDSee, and Gimp. Any suggestions on how to do this?

Making a thumbnail takes a few seconds with Website Toolbox Pro. But since you don’t have it yet, here is how to achieve the same with Gimp.

I’m assuming your web page is in HTML in a file named mypage.html, and the photo is in a file such as picture.jpg or picture.gif on your hard drive.

First, make a copy of picture.jpg to old-picture.jpg, so that you can get the original back if you need it. Reducing the size of the picture will reduce the potential resolution of the image, and you will need the copy if you ever want to get back to the original resolution.

In GIMP, choose -> File -> Open -> …\picture.jpg -> Image -> Scale Image.
Notice the width number in the "Width" field. You have to make a decision whether you want to shrink each edge of the photo to 1/4th its current length or whether you want to shrink the area of the photo to 1/4th its current area. Do a side calculation. If you want to shrink each edge of the photo to 1/4 its length, then divide the width number by 4 to get the new width number. If you want to shrink the area to 1/4th, then divide the width number by 2 to get the new width number. Round off the fraction, if any.
Type the new width number into the width field.

  • Strike the [Tab] key.
  • -> Scale -> File -> Save
  • That fixes the size of the picture.

Now we turn to the position of the picture on the page. No definitive answer is possible without knowing what's in the page source. The default position of a picture on an html page is the upper left. If it's in the center of the page, it's because something is holding it there. It could be in the central cell of a <table> tag, possibly with "align" and/or "valign" attributes. It could be held there by a <center> tag. There might be other things holding it in the center of the page. Get rid of these things (in a test version of mypage.html), and see what happens. Of course, this may break something else, but you can cope with it.

One brute force way to move the picture to the upper left is to find the html tag <body>. Immediately following <body>, on the next line, put the tag

<img src=picture.jpg>

This puts the picture at the upper left. Take a look at your web page and see how you like it. You won't, but it's a step in one direction, maybe even the right one.