Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • February 22, 2022 at 6:51 pm #1341821
    Jules

    I have two different webpages (see links below) where the images are the same dimensions, but are displayed differently in mobile.

    I’m using a Fullwidth Easy Slider at the top of the page on both images. I have compared both setting and they appear to be identical. I’m not using CSS in either element.

    The image sizes look identical from Desktop/Laptops.

    What am I missing – please?

    Best Regards,
    Julio

    February 23, 2022 at 4:20 am #1341905
    Ismael

    Hey Julio,

    Thank you for the inquiry.

    The image in the about page is actually taller by 150px compare to the other image. The size of the image in the about page is 1920 x 850px while the smaller one is 1920 x 700px.

    Best regards,
    Ismael

    February 23, 2022 at 5:12 am #1341925
    Jules

    Thanks for your response, Ismael.

    Yes, I made the image on the About page larger (1920 x 850px) after I made this post. However, even with making it larger or keeping it at 1920 x 700, the About image is still displaying at a smaller size than the Contact Us page on a mobile phone.

    Would love to understand why. Thank you

    Best Regards,
    Julio

    February 23, 2022 at 5:37 am #1341937
    Ismael

    Hi,

    the About image is still displaying at a smaller size

    The image in the about page is actually larger when we checked. Please make sure to purge the cache or switch to incognito mode to make sure that you are not viewing a cached version of the page. You can check the screenshot of the About page in the private field.

    Best regards,
    Ismael

    February 23, 2022 at 6:18 am #1341939
    Jules

    Hi Ismael,

    Yes the image for About us is larger on a desktop, but not from a mobile phone – see mobile screenshot below. I believe you will notice the Contact Us image is larger than About on mobile.

    Thank you for providing a screenshot, but it doesn’t display.

    Can you help me understand why the About image is smaller on a mobile footprint? Thank you.

    Best Regards,
    Julio

    February 23, 2022 at 8:01 am #1341949
    Ismael

    Hi,

    I see. Sorry about that. I missed the “on mobile” part in the topic title. We are not yet sure why it resizes like that but it might be due to the srcset attribute which allows the browser to serve a different thumbnail or a different version of the original image based on the current screen size. The served thumbnail might have a different aspect ratio compare to the original image. You can prevent this behavior by temporarily disabling the Responsive Images option in the Enfold > Performance > Responsive Images And Lazy Loading option.

    Best regards,
    Ismael

    February 23, 2022 at 4:29 pm #1342018
    Jules

    Thanks for the suggestion, Ismael. I have implemented the suggested change, removed cache and tested incognito, but no change.

    Any other suggestions? Thank you.

    Best Regards,
    Julio

    February 24, 2022 at 9:07 am #1342116
    Ismael

    Hi,

    Thank you for the info.

    The srcset attribute is still applied to the image element when we checked the site. Are you sure that the option has been disabled? Are you using another image plugin?

    Best regards,
    Ismael

    February 24, 2022 at 4:06 pm #1342153
    Jules

    After implementing the suggested change and testing after clearing cache & tested via incognito with no change. I reenabled lazy loading. That’s why you may be seeing the srcset.

    I have been using the Smush plug-in to compress images for awhile now.

    Not sure why this is happening. Feel free to close this topic. Thank you

    Best Regards,
    Julio

    • This reply was modified 2 years, 10 months ago by Jules.
    February 25, 2022 at 3:40 am #1342208
    Ismael

    Hi,

    with no change. I reenabled lazy loading

    You should actually disable the “Responsive Images” option, not the lazy loading. Have you tried that?

    Best regards,
    Ismael

    February 25, 2022 at 6:54 am #1342233
    Jules

    Yes, but no change. I did some additional searching on this topic and came across this post in the forum – https://kriesi.at/support/topic/responsive-content-images-retina-screens/

    Will review it to see if there’s anything I can reapply. Any thoughts on this post?

    Best Regards,
    Julio

    February 25, 2022 at 7:22 am #1342235
    Ismael

    Hi,

    Regarding the old thread, the user actually doubled the size of every thumbnails in the theme because he wanted the images to look sharper on retina screens. You don’t really need to do that because the default thumbnails are large enough to cover retina displays.

    Best regards,
    Ismael

    February 27, 2022 at 7:14 am #1342442
    Jules

    Thank you Ismael. Still testing between using Color Section with 100% width and Fullwidth Easy Slider for the best results.

    Feel free to close this thread. Thank you.

    Best Regards,
    Julio

    February 27, 2022 at 12:30 pm #1342455
    Rikard

    Hi Julio,

    Thanks for the update, I’ll go ahead and close this thread for now then. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Same Size Images on 2 Different Pages Displaying Differently on Mobile’ is closed to new replies.