Question

AS in facebook,orkut what should be the profile pic settings height,width etc so that the image is clear and do not have any distortion when viewing it

     <img src="image.gif"  style="height:75px;width:130px;"  />

Answer 1

To avoid distortion in the thumbnail image you should take the original image, and, using whatever image manipulation program or technique (php, Photoshop…) you have available, resize/crop the image to whatever size you consider appropriate:

1. Original image profilePicture.png, 600 x 500px, convert to:
2. profilePictureThumbnail.png, 200 x 240px

And then use the profilePictureThumbnail.png rather than using the img tag to resize/scale the image.

I’d still suggest using height and width attributes in the img tag, since that allows the browser to lay out the page even if the network, or image-server, is slow to respond with the actual image.

I’d definitely avoid using the browser to resize the image since it still requires the picture to be downloaded (at its full size/resolution), and browser image manipulation is not particularly sensitive (and varies from Firefox to Chrome to IE to Opera…), not to mention that people on mobile internet packages won’t thank you for throwing, potentially, multi-megabyte images at them via their mobile tariff.