This Message Forum is no longer in use

Please use the new Bravenet Help Forums FOUND HERE

General Forum
This Forum is Locked
Author
Comment
Page alignment problems with Photo Album

I am using Bravenet's Photo Album and it works fine, but I am having problems aligning the top of the page when it is linked to from my Home Page. It cuts off the top of the page when it is displayed.

Re: Page alignment problems with Photo Album

It doesn't really cut off the top of the page, but it does put the Photo Album at the top of the browser. If you scroll up, you can still see the top of the page. You can see what is going on by selecting the Photo Album from the menu. Then, when the page appears, click on the back button. This will not go back to the index page, as you might expect. It will display your Photo Album page, but with the header at the top.

This appears to be an artifact of the Bravenet Photo Album. When the page loads and the Photo Album script runs, it redirects your browser so that the Photo Album is at the top of the page. Unless there is a configuration item in the Photo Album, there isn't much you can do about it.

Another issue, you have is with displaying images. In the upper left you have a color logo. The image is really 1137x1137 pixels, but you are using the HTML to "resize" it to 140x140 pixels. Browsers do a very poor job of resizing and renders the images almost unreadable. A better method is to "resample" the image, prior to uploading. If you don't have an application that will "resample" as opposed to "resize", you can download a free image editor called IrfanView. I will also provide an example.

Try this link to Image_Test.html. On the left is your image, "resized" the same way you do it on your web page. On the right is the image "resampled" in advance. While the image is less than 10% of the original, you still should see a difference in the clarity. You may also be able to see a difference in the speed that the images load. The original is 940 KBytes but the resampled image is only 16 KBytes.

Re: Page alignment problems with Photo Album

Apparently this browser alignment is a quirk of Bravenet's Photo Album application because it does not happen on another web site I maintain.

As far as the image, I went into Photoshop CS4 and opened the source picture and it is 36KB, already resampled. Using Dreamweaver CS4, I clicked on the image in my code and did a 'resample' in Dreamweaver and it made not difference. I can see the difference in 'image_Test.html', but it looks the same to me both in size and viewing in Photoshop and Dreamweaver. I'm not sure how I can change it. You say the original image is 940KB, but I show 36KB in my code. Help? (and thanks)

Re: Page alignment problems with Photo Album

The image that I downloaded directly from your web page is 1137 by 1137 pixels. If you assume 8 bits per pixel then this comes out to 1,292,769 Bytes. The information built into the image says that it uses 24 bit color. This means that, in memory, the image requires almost 4 MBytes. But because it's a JPG, and due to a PC's storage method, it only requires about 940 KBytes on disk. The only way I was able to see the on-disk size go down to 36 KBytes, was when I used MSOffice Picture Manager to compress the image. It did a pretty fair job, but there was some of loss in image brightness and mottling of the large color areas. It's possible that PhotoShop does an automatic compression when it opens a image. There may be a setting that controls this. I don't have PhotoShop or DreamWeaver, so I can really test it.

There is resampling and then there is resampling. There are a dozen different resampling algorithms, and each one has their limitations. There seems to be some debate about PhotoShop's math capabilities, when it comes to image resampling. Just because the latest releases are 32 and 64 bit applications, doesn't mean that they implement 32 or 64 bit floating point math for their image resampling. Most of the articles I have read, say PhotoShop only uses 16 bit floating point math. This may be why they don't include better resampling algorithms, which require better math capability.

For downsizing an image, Photoshop only allows you to use the Bicubic method. The Bicubic often results in loss of fine details, soft edges, and a general smearing of data at the pixel level. But Irfanview includes several different, and better, resampling methods. Probably the best one is Lanczos, which is what I used to resample your image. There are other methods available, and they all do a pretty good job, but each one has limitations. So, all I can suggest is that you try downloading a copy of Irfanview and try it. You will see much better results. You can also just use your right mouse button and download the image I resampled directy from the test page.