cannot get sharp thumbnails for my ecommerce website

DS
Posted By
derek_selby
May 16, 2008
Views
427
Replies
9
Status
Closed
have i think tried everything to get sharp thumbnail pictures for my website but to no avail this is what i do :after working in raw (no sharpening) i then put my picture on a grey background size is 1804×2560 then go to image size put in 72 for res and bicubic sharpener it then takes it down to 541×768 then save for web 32.1k jpeg medium and optimised quality 70-90 then upload to web but still not sharp, when you click on the thumbnail to get a bigger picture its sharp. i have also tried save as and put in quality 9 with no success. i had the website designed for me and you cannot load a seperate thumbnail. fashion pics taken in raw canon 20d and work in adobe cs3
hope someone can help
cheers
del

Must-have mockup pack for every graphic designer 🔥🔥🔥

Easy-to-use drag-n-drop Photoshop scene creator with more than 2800 items.

EG
Ed_Grenzig
May 16, 2008
Sounds like you are saying that the 541 x 768 is sharp, but Thumbnail is not sharp.

If this is true then you should tell your website designer and have him/her correct it.

But you may try:
Also test it on other computers to see if they get the same results? Try different sizes (hxw pixels) to upload and also different aspect ratios. This may effect how the thumbnail is calculated during resizing.

Ed
DS
derek_selby
May 16, 2008
thanks Ed for your reply yes the 541×768 is sharp but as soon as i downsize they are not i have tried other computers different pixels and aspect ratios, should of said its a hosted website and i have told them but its up to me to upload the pictures, so in your opinion am i doing everything by the book to produce sharp thumbnails? because i cannot think of what else i can do
regards
del
ps someone did suggest they were over compressed after looking at the site " Hi derek.

Your images are definitely over-compressed. The mistake you’re making is saving at quality 50. Save your images at a figure between 75 and 90. I personally wouldn’t save anything at a quality less than 100 unless a reduced file size is of dire importance.

but i am saving them at 75-90 still no difference
JJ
Jim_Jordan
May 16, 2008
Can you share the URL?

It almost sounds as if the thumbnails are displayed from the same image file as the full version at 541 x 768. The thumbnails might be HTML-scaled versions of the full image. HTML image scaling is not pretty. You may need separate thumbnail image files here.
DS
derek_selby
May 16, 2008
hi www.id-onlineshop.co.uk im not into html and all i can do is upload one picture for the main product. when you say html-scaled version is that what happens when i upload my picture to the website because i have no control of that
thanks
del
JJ
Jim_Jordan
May 16, 2008
Use this page as an example:
< http://www.id-onlineshop.co.uk/index.asp?function=DISPLAYCAT &catid=21>

Notice how there are jaggies on Anna’s arms.

Now view the same image outside of the web page layout:
< http://www.id-onlineshop.co.uk/ekmps/shops/idclothes/resourc es/Image/top%20shot%20anna%20(470%20x%20600).jpg>

Now the same image looks fine at its larger size.

The problem involves how the image is being squashed by HTML to fit on the page. Try saving images to the size that they will be displayed on the page.
DS
derek_selby
May 16, 2008
thanks jim i will give it a go
regards
del
JM
J_Maloney
May 16, 2008
In Safari, both look great. 🙂 😀
DS
derek_selby
May 16, 2008
ok, you are so right the thumbnail is a lot sharper now but, there always has to be a but now when a customer clicks on image to enlarge it there is no larger image just another small one
any help on this one
thanks again
del
JJ
Jim_Jordan
May 16, 2008
You need to contact your web developer to use a distinct image for the thumbnail and another image for the full size image. The developer could provide for you to upload these two different images or he/she could program a way to generate the thumbnail images on the web server based on a single image that you upload.

Whether it looks great in Safari (and Opera) is of little consequence: these browsers are a minority. It is simply bad web design to push full size image data to display at the size of a thumbnail.

How to Master Sharpening in Photoshop

Give your photos a professional finish with sharpening in Photoshop. Learn to enhance details, create contrast, and prepare your images for print, web, and social media.

Related Discussion Topics

Nice and short text about related topics in discussion sections