Fuzzy thumbnails

Locked

Started by isaacr25 on 30 Sep 2008, 8:23 PM · Views: 2,127

Results 1 to 12 of 12
This thread is locked. New replies are disabled.
30 Sep 2008, 8:23 PM
#1
isaacr25 avatar

isaacr25

Zen Follower

Join Date:
Jul 2007
Posts:
174
Plugin Contributions:
0

Fuzzy thumbnails

When I add a new product to my store, I upload the large photo that displays when the user enlarges the thumbnail. Zen Cart automatically reduces the size of the photo to use as the thumbnail, but in doing so, the photos become fuzzy.

How can I use different photos for the catalog thumbnails (small, actual size photos) and other photos (large photos) for use when a user enlarges the product?

Or is there another way to go about doing this? Thanks in advance.

1 Oct 2008, 8:18 AM
#2
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town & London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Fuzzy thumbnails

A standard install of ZC prefers that you configure individually sized images for specific displays. (eg: _MED, _LRG). Additionally, ZC allows for these variations on size to be housed in separate subfolders of the images directory.

Image Handler 2 (IH2) module can fix your problem, as it will automatically resize (downwards) images in your main image folder, creating visually accurate (not fuzzy) smaller images, when these are required.

So, you just need to upload one large image to the images folder and IH2 does the rest.

(After installation and activation of IH2, you may have to re-set image paths and names in your product and category descriptions)

1 Oct 2008, 9:30 PM
#3
saraniel avatar

saraniel

New Zenner

Join Date:
Mar 2007
Posts:
29
Plugin Contributions:
0

Re: Fuzzy thumbnails

If your main picture editor is Photoshop, you may like to use my script generator that automatically create the 3 images based on your format specifications. Morover the batch can automatically optimize/enhance your pictures. Have a try and let me know.

www.kidsavenue.ch/zencart

1 Oct 2008, 10:41 PM
#4
isaacr25 avatar

isaacr25

Zen Follower

Join Date:
Jul 2007
Posts:
174
Plugin Contributions:
0

Re: Fuzzy thumbnails

fairetscape mentioned that zen cart has a standard way of handling this issue. I don't have a large number of products, only about 15, so doing it manually (if zen cart can somehow handle it) is not a problem.

Am I understanding correctly that zen cart can handle the small and large images? If so, how?

Thanks.

2 Oct 2008, 3:21 PM
#5
tpeck avatar

tpeck

Zen Follower

Join Date:
Oct 2008
Posts:
197
Plugin Contributions:
0

Re: Fuzzy thumbnails

I am going to use the IH2 product to fix the fuzz, but I did the graphics for my whole site before I even realized I had a fuzzy image problem! No, I'm not blind - it's just that I was doing the whole thing in Google's new Chrome browser. All the graphics look just great with just the one (largish) image.

Of course, when using FF or IE, it looks like something at a flea market. Does anyone know why and how Chrome does this?

Now if we can just stop the whole world using anything else but Chrome my site will be great!

3 Oct 2008, 12:00 PM
#6
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town & London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Fuzzy thumbnails

The saying: "making a silk purse out of a sow's ear" is so relevant in the world of digitised images.

Fundamentally, you cannot easily take a shoddy image and make it look good.

True, there's some clever software out there that can help make a bad pic look better, but the best way to ensure that you have good, professional-looking images is to make sure you start out with good quality pics in the first place.

Many people start with images that are either too small, or too low in resolution (or a combination of both). They then try to make them larger - often by simply adjusting upwards the vertical and horizontal aspect ratios.

This never works.

You must try to get good quality images of your products.

Of course, if you take a pic of your product with a 9m pixel digital camera, the resulting image can be over 2mb in volume.

... and its physical dimensions are enormous too.

So, somehow you need to retain quality, but reduce size (both display size and file size).

You need reasonably good software for this... and guess what...

... There's a lot of it available. If you have a digital camera, it no doubt came with a packaged CD, on which a reasonable image editor is housed. These bits of software are generally OK for turning camera-original pic files into web-suitable pic files.

The best way to work is to experiment with all the variables.

I tend to set my LARGE zencart images at 500 wide and 300 deep (for landscape) and 300 wide and 500 deep (for portrait). If the image subject is not conducive to these aspect ratios (such as a pic of a fishing rod - very long and very narrow), I often put it in a blank background of 300 X 500 anyway.

This ensures that ALL my _LRG images enjoy identical display sizes and aspect ratios.

I try to SAVE the file as jpg at 72dpi with the least compression, but sufficient to ensure it does not exceed 75 - 80 kb.

My _MED images are created in exactly the same way - and NOT from the _LRG versions, but from the ORIGINAL pic.

The main difference is that I now set landscape at 250X150 and portrait at 150X250 (see the aspect relationship here is true to the _LRG... which is 300X500 and 500X300 )

3 Oct 2008, 1:14 PM
#7
tpeck avatar

tpeck

Zen Follower

Join Date:
Oct 2008
Posts:
197
Plugin Contributions:
0

Re: Fuzzy thumbnails

Thanks! I agree with you - and I have noted down your advice in my notebook.

But I did begin with wonderful graphics. Only, they looked like rubbish when viewed at small or medium size and I was oblivious to this until I used IE and FF etc.

My only worthwhile(?) comment is that the Chrome browser seems to do all that the IH2 scripts do! Amazing! How? Is this the future? I kinda hope so. Life's too short to waste on detailing graphics if IH2 (or Chrome) can do it automatically (and probably better than you can do image by image - trust me! I have wasted weeks before making S-M-L graphics the hard way.)

If you want to make your site visible in IE and FF etc. and don't want to spend days fussing over graphics, you can easily and very quickly achieve very good small, medium, large effects with an infinitely large number of graphics using IH2 (a fantastic program IMHO) - sure, you must start off with good quality large graphics in the first place.

BUT the Chrome browser does all this without asking for anything. I would like to know why other browsers haven't seen fit to do so and if there is a downside etc. I can't see one.

3 Oct 2008, 3:39 PM
#8
isaacr25 avatar

isaacr25

Zen Follower

Join Date:
Jul 2007
Posts:
174
Plugin Contributions:
0

Re: Fuzzy thumbnails

My question, being new to zen cart, is how to set up the LRG, MED etc structure? My large images are of great quality and good size, but how do I set up the structure you mention? Thanks.

3 Oct 2008, 10:29 PM
#9
tpeck avatar

tpeck

Zen Follower

Join Date:
Oct 2008
Posts:
197
Plugin Contributions:
0

Re: Fuzzy thumbnails

Are you asking how to set up IH2?

If so the instructions are pretty clear. Just do a Google search for Image Handler 2 - you'll find it. It took me a little while to work out what to do and how to merge the files, but if you are using zencart you will already be au fait with that.

If you want to see what the IH2 effect will be with no work, just use Chrome. But you'll still have to use IH2 for all the other browsers. Or do the whole thing image by image.

4 Oct 2008, 7:01 PM
#10
tophand avatar

tophand

Totally Zenned

Join Date:
Jan 2007
Location:
1.5 miles from Home
Posts:
674
Plugin Contributions:
0

Re: Fuzzy thumbnails

tpeck:

Are you asking how to set up IH2?

If so the instructions are pretty clear. Just do a Google search for Image Handler 2 - you'll find it. It took me a little while to work out what to do and how to merge the files, but if you are using zencart you will already be au fait with that.

If you want to see what the IH2 effect will be with no work, just use Chrome. But you'll still have to use IH2 for all the other browsers. Or do the whole thing image by image.

Why do a search when all you have to do is scroll to top of this page and click on the "Free Software Add Ons" link.
Lots of cool add ons plus the newest version of IH2 (there is 2 so check the date).

M

4 Oct 2008, 10:42 PM
#11
tpeck avatar

tpeck

Zen Follower

Join Date:
Oct 2008
Posts:
197
Plugin Contributions:
0

Re: Fuzzy thumbnails

Quicker to do a search? (IMHO).

I've struck a problem though with IH2 and a template I'm using. Zoom and hover don't work. If I find a solution, I'll post it.

6 Oct 2008, 7:01 PM
#12
isaacr25 avatar

isaacr25

Zen Follower

Join Date:
Jul 2007
Posts:
174
Plugin Contributions:
0

Re: Fuzzy thumbnails

So I've installed Image Handler 2, adn it seemed to have automatically converted my existing images. Is there anything further I need to do after installing IH2?