Hi - does anyone know what is the optimum size for images, thumbnail and full to be used in rapid cart?
regards
As for any web resources involving visitorsās device and connection speed, itās merely a matter of finding the best compromise between image quality and file size.
- Better image quality means larger file size. Larger file size means slower page loading.
- Larger image size means larger file size. And as aboveā¦
Here are some personal advices.
- Use large previews only if you need them: if you use product images just as placeholder, disable āLightboxā effect.
- Use JPEG format with 60/80% quality: they have the best āimage qualityā/āfile sizeā ratio.
- For thumbnails, use images with a width size thatās double the size you see in Catalog and Product pages: they will be rendered perfectly on Retina devices, higher sizes are worthless. For example, if your product box in Catalog page is 100 px wide, just use a 200 px thumbnail. Keep always in mind file size: you could think that one 100 KB thumbnail could be a good choice, but when you have 20 products in a Catalog page, your customers would have to download 2 MB. Not a problem with fast connections, a big problem with capped (for speed or MB) connections, especially on mobile.
- Use the same aspect ratio for all your thumbnails: better if squared, they look better in Catalog page.
- For larger previews, you can use 300+ KB images: customers know that when they click on a product image theyāll get a larger image with all the consequences. But donāt use 1 MB or 2000 px. If you need to highlight a product detail, like a embroidery on a t-shirt, just show it in a targeted image.
- Prefer speed over quality: smaller file size means faster page loading, youāll get a higher customer retention rate and better ranking in search engines.
- Use common sense.
Roberto, I need some help with RCP. This is a follow up to this thread. Hereāa page I am working on https://www.rjhoney.com/extest/ The pics havenāt been sized yet pending your input.
Tip #3: I am using Depth Theme, max 1000px. By your reckoning above if I have a 6 column layout, thatās 167px per column. My pictures should be 334px wide.
And if I understand your tip in #4, the picture should be 334px by 334px. This fits the RCP product object best.
I hope you relize that you are replying to a 3 year old post?
Rob or any of the RCP folks donāt monitor this (or any) forum on a regular basis.
Suggest you contact them at
https://help.4gnd.com/general/index.html#general-faqs-how-can-i-get-support-for-your-products
Thanks for the reply. And yes I do. I saw the āwarningā before I posted. Iāve tried several times on their Disqus forum and their email but have not received a response. This has been disappointing.
Is the question generic enough for someone to jump in and answer?
Youāre over thinking. Assuming you havenāt selected to display 500 products per page donāt worry too much about image size. I normally display 12-16 images per page and donāt bother with thumbnails, I make the main image typically 1200x700ish and around 150kb.
If you want to make thumbnails make them around 500px wide.
The key thing with RCP is to keep the same aspect ratio for all images in your entire range, so that when displayed in the various views they are all the same height.
Thank you Bond, James Bond. Iām merely a noob. It is easy to make a web site. No so much to do it correctly. The aspect ratio seems to the problem Iāve been wrestling with.
As said in my comment from 2016 (time fliesā¦) use the same aspect ratio for all your product images, better if square.
A 300x300px size should be perfect.