Solved

My pictures loses their quality when uploaded

Zetterman
Tourist
14 0 1

Hi when I try to upload my images to my store they get pixelated and blurry this also happens on the product pictures, Anyone know how to fix this?

 

Store url: https://watworkwear.com

Accepted Solution (1)

Moira
Shopify Staff
2044 223 326

This is an accepted solution.

Hey @Zetterman,

 

To keep load times fast, Shopify automatically compresses images when they're displayed on your online store. Compressing an image means reducing the file size to allow for faster page loading. I have a few tips that should help you to export clearer images:

 

  • If your images are PNG, I suggest exporting in JPEG (same quality for smaller Kb size)
  • Your hero images are quite small (30-50Kb), at that file size they are never going to be great quality so you need to up it to around 100-150Kb (if your source images are all high quality then they are probably much bigger than this, so you'll need to optimize them down to an appropriate size).
  • If you optimize them to 85% as a JPEG then Shopify won't optimize them further, so you should get the results you are expecting.
  • There is an article here that goes into more depth about automatic image compression and format selection.

 

As a side note, I love the work you've done on your website so far. Certain products like the Wat Hoodie stand out to me because of the great job you've done with the product images and description. Have you thought about who your target customer is for your website? Our blog post on Building a Buyer Persona talks about narrowing down who your ideal customer is. This process is good to go through so that you can get the most out of your marketing.

 

Let me know if I can clarify anything further!

Moira | Social Care @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit the Shopify Help Center or the Shopify Blog

View solution in original post

Replies 16 (16)

Moira
Shopify Staff
2044 223 326

This is an accepted solution.

Hey @Zetterman,

 

To keep load times fast, Shopify automatically compresses images when they're displayed on your online store. Compressing an image means reducing the file size to allow for faster page loading. I have a few tips that should help you to export clearer images:

 

  • If your images are PNG, I suggest exporting in JPEG (same quality for smaller Kb size)
  • Your hero images are quite small (30-50Kb), at that file size they are never going to be great quality so you need to up it to around 100-150Kb (if your source images are all high quality then they are probably much bigger than this, so you'll need to optimize them down to an appropriate size).
  • If you optimize them to 85% as a JPEG then Shopify won't optimize them further, so you should get the results you are expecting.
  • There is an article here that goes into more depth about automatic image compression and format selection.

 

As a side note, I love the work you've done on your website so far. Certain products like the Wat Hoodie stand out to me because of the great job you've done with the product images and description. Have you thought about who your target customer is for your website? Our blog post on Building a Buyer Persona talks about narrowing down who your ideal customer is. This process is good to go through so that you can get the most out of your marketing.

 

Let me know if I can clarify anything further!

Moira | Social Care @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit the Shopify Help Center or the Shopify Blog

anchorball
Visitor
1 0 7

Tried it - doesn't work actually - tired all kinds of variations on this - larger size images etc. Shopify image compression is way too agressive and makes my whole site look really bad. I have a squarespace site as well and images on that always look amazing. I think it would be wise for Shopify to address this and make the sitewide compression less aggressive - or remove and leave it to their customers. As an artist it really kills the look and feel or my work. Having it automatically applied like this is overkill and seems like an outdated practice considering most people are on fast connections nowadays - even on phones. Please fix!!   

Twoodlepip
Excursionist
29 0 0

So well said. Same boat. It is such a pity to put so much effort into crafting beautiful images to sell your art to have Shopify sh*t on them by forcing really redundant image compressing. It's 2024 not 2015. 

 

Please Shopify let us dictate our site image resolution!!

gokha1
Tourist
3 0 3

I totally agree with @anchorball

The site I am doing right now has the same problem. As example the image in the product detail page is not distorted from compression as much as the image that links to the product. All while both images are loaded up from the inventory on the backend (so no 2 different images of the same but only one)

 

There had to be a way to adjust this setting.

Twoodlepip
Excursionist
29 0 0

Exactly, it's the same image? This is what was confusing me.

 

It looks fine on Product page but is blurred beyond belief on Collection page!

 

How is this acceptable?? How do others using Shopify successfully navigate this? 

 

I literally can't show my collection page (which hosts all the art prints like a gallery) because of this.. 

 

For the monthly fee we pay is disgraceful.

nnrbzz
Visitor
1 0 1

this is NOT an accepted solution. I've reduced a 800KB image down to 230KB and it's STILL being turned into sludge. This isn't acceptable. it's 2024, nobody has potato internet, and if they do they're not my target audience.

 

Screenshot 2024-03-15 123336.png

Twoodlepip
Excursionist
29 0 0

Hi Moira, 

 

I am having an issue with Shopify force compressing my images which result in product photos that are a blurry pixelated mess.

 

I've followed image best practice (I'm an illustrator/designer so optimising images for 15yrs+)

 

I've created my file 2048px 144res, on the left you can see the quality in Photoshop, on the right is when I upload it to Shopify. It's woefully poor quality. Other images have also been affected, banding in gradients where none exist in original file because Shopify has compressed aggressively.

 

As someone who is selling their ART I need the images to be top quality. This is not an acceptable level of resolution.

 

Can you please find a solution for this?

 

 

 

Shopify-ImageRes-issue.jpg

Twoodlepip
Excursionist
29 0 0

Ok Shopify has even compressed THAT FILE into a blurry mess. There is a huge distinction in quality between both. Until I upload it of course.

 

What do we have to do to get decent images??

erixy
Visitor
1 0 1

Have you found a solution to this? I've been looking everywhere I cannot figure out a way around this.

Twoodlepip
Excursionist
29 0 0

Nope. I contacted Shopify support but gave up. I don't understand as mentioned above it's the same image uploaded, it looks fine in one instance and is blurred in another. I've had to redesign my site to avoid a collection overview. Frustrating.

Twoodlepip
Excursionist
29 0 0

update: See solution that WORKS below! : D

 

Upload as an SVG and the resolution issue is resolved 🙏

Celeb2025
Shopify Partner
1 0 0

I'm also looking for the same solution

bulowski
Visitor
2 0 2

Hi all. I just found this thread because I was experiencing the exact same issue. The solution mentioned previously didn't help (surprise, surprise). However, I figured it out! 

 

Download your image as a SVG file and upload it to your store. The quality will remain the exact same as your original artwork. Hope this helps!

Twoodlepip
Excursionist
29 0 0

See solution that WORKS below! : D

 

Upload as an SVG and the resolution issue is resolved 🙏

bulowski
Visitor
2 0 2

Download your image as a SVG file and upload it to your store. The quality will remain the exact same as your original artwork. Hope this helps!

Twoodlepip
Excursionist
29 0 0

THIS WORKED!!!!

 

You absolute genius !! 🌟 🏆 🌟

 

I can't believe it I thought I was doomed to low res images 😂

 

Thank you so much!