Images are BLURRIER on mobile than on desktop view [DAWN]

[okkidokkishop]

Hello, so I have a slideshow, and for some reason when I upload a photo, It appears crystal clear on desktop mode, but on mobile- no matter what phone it comes out blurry. Ive tried to resize so many times, ive done png, jpg, resized it, adjusted the dpi, and no matter what mobile looks so BLURRY. 

ill upload a screenshot below, of both comparisons

[okkidokkishop]

[okkidokkishop]

[namphan]

Hi @okkidokkishop,

Please send me the store link, I will check it for you

[okkidokkishop]

okkidokki.shop

[namphan]

Hi @okkidokkishop 

please send me the code of slideshow.liquid file, I will help you edit it

[okkidokkishop]

[namphan]

Hi @okkidokkishop,

No, it is sections > slideshow.liquid file

[okkidokkishop]

[namphan · Accepted solution]

Hi @okkidokkishop,

Please send me the file, instead of the screenshot. I will change it.

[okkidokkishop]

im sorry, how do I do that ? send the file to you? 

[namphan]

Hi @okkidokkishop,

Please go to slideshow.liquid and change code here:

[Emmalily]

Hi! It sounds really frustrating that your images look great on desktop but blurry on mobile. This issue might be related to how the theme is handling image scaling or compression for mobile. Here are a few things you could try:

1. Check image resolution – Ensure the image resolution is high enough for mobile displays, which often have higher pixel density.
2. Responsive settings – Some themes automatically adjust image quality for mobile. Check if you can adjust or disable this in your theme settings.
3. Image size – Try uploading a larger image that can scale down more effectively for mobile.
4. Lazy loading or compression plugins – These might be compressing the images too much for mobile.

I hope one of these fixes helps! Looking forward to seeing those crisp images on mobile!🙂🙂

[okkidokkishop]

Do you have any tips in how to conduct your advice? because Shopify only allows up to 20MB images , and no matter how many times ive adjusted the pixels, size, framing, it still gives me the same issues , ive even. converted them to jpgs, and even compressed them as well, still the same issue

[Emmalily]

here are a few more things you can consider:

1. Use Shopify's Image Editor – If you're not already doing this, try using Shopify’s built-in image editor to see if tweaking directly on the platform can help. It sometimes handles compression differently.

2. Double-check mobile-specific settings – Some themes or apps might have settings that specifically adjust image quality for mobile. Look through your theme settings for any mobile optimization options.

3. Use an external tool for optimization – Try a tool like TinyPNG or ImageOptim to compress your images further while maintaining quality. This might help with the 20MB limit.

4. Lazy Loading for Mobile – Some themes lazy-load images for mobile to improve speed. It can sometimes result in lower-quality previews. Check if disabling lazy loading for mobile images fixes the issue.

5. Try a CDN service – Content Delivery Networks (like Cloudflare) can serve optimized versions of your images based on the device.

Hopefully, one of these methods helps get your images looking better on mobile!

[okkidokkishop]

okay I just tried the Shopify media editor, that did nothing, as I inserted a new file, sized it via the Shopify media editor, and uploaded and selected it, and still the same result , ill try the mobile specific settings, where do I go to find those settings?