Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

png vs jpg images?


GoTTi

Recommended Posts

i just realized i shouldve probably been uploading png images with a cleared background so the images show a little better with the style settings of the store....

 

what is better for the store? png (with transparent background) or jpg?

 

i know the size of the files matter here...is there any way to make the images size smaller? right now my jpg's are all 500x500 (99% of them) and the size is still compact. the png i did shot up to like 100kb in size.

Link to comment
Share on other sites

Depends what you need the images for. I would only use .png's for small images like icons but for files with large resolution like photos I'd use jpg, mainly because of lighter size. Also consider .gif it is often used for website elements such as buttons, also helps keep the file size down and improve loading times.

Find this post helpful? Click the 'Like this' button. :)

Link to comment
Share on other sites

are you using anything else to control the images shown on your stores? cuz how would i use small png files for icons and have a different image load on the actual item page?

 

 

do you mean like...someone is looking at "index.php?cPath=1" and your image is a small png file, but when they goto the item "product_info.php?cPath=1&products_id=18" you have a different image in there thats a jpg image?

Link to comment
Share on other sites

i just realized i shouldve probably been uploading png images with a cleared background so the images show a little better with the style settings of the store....

 

what is better for the store? png (with transparent background) or jpg?

 

i know the size of the files matter here...is there any way to make the images size smaller? right now my jpg's are all 500x500 (99% of them) and the size is still compact. the png i did shot up to like 100kb in size.

If you need transparent images, you can't use jpg's. If it doesn't matter, then use whichever creates the smallest file size (on average). The dimensions of the image (500x500) doesn't make much difference. You should make them whatever the largest size is that you want to display. It is the actual file size that matters. You should install an image thumbnail contribution to handle the images. It will display your images so they appear clear and crisp (assuming the originals are) and at a lower file size.

Support Links:

For Hire: Contact me for anything you need help with for your shop: upgrading, hosting, repairs, code written, etc.

All of My Addons

Get the latest versions of my addons

Recommended SEO Addons

Link to comment
Share on other sites

GIF: old format, limited palette (256 colors), full transparency replacing one color. Excellent for diagrams, charts, icons, buttons with large expanses of a fixed color (and not too many of them).Good, lossless compression. Supported on all browsers.

 

JPEG: format optimized for photos (that's the 'P' in the name). No transparency. Excellent compression, but at the cost that it's "lossy". High-frequency information is removed, leading to degradation of the image. Not good for diagrams, charts, icons, buttons with large expanses of a fixed color because you get artifacts and bleed-over from one region into another, which degrades the quality. Note: multiple color models (RGB, HSV, CMYK, etc.) available, but Internet Explorer can display only RGB. Otherwise, very widely supported.

 

PNG: format that tries to be the best of both worlds. Decent, lossless compression available, but doesn't compress as well as JPEG. "Alpha channel" variable transparency, but older browsers don't support it. Less artifacting than JPEG, more colors available than GIF. Older browsers may have trouble with PNG, although it's been around long enough that most browsers can at least basically support it.

 

Use JPEG for photographs (no transparency), and either GIF or PNG for other purposes. Be aware of what older browsers will do to your PNG images (especially if you want to use transparency). Match the image type to the application. Don't be one of those idiots who use JPEG for everything, including charts and diagrams, which show very visible and annoying artifacting.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...