1

Does hiding the "featured" image on WordPress single post with display:none make the page load faster?

I understand the img tag is still loaded in the DOM, just wondering does it make any difference in download speed at all.

I need the "featured" image on post listing page, but not on single post.

3
  • FYI there is an extensive discussion on Stack Overflow about whether display:none prevents an image from loading in to the browser (which would make the page load faster). See: Does "display:none" prevent an image from loading? Apr 8, 2023 at 18:29
  • Why not have the image conditional on whether it's a list or a single post. It would be safer than relying on each browser making the right decision, present and future!!! Apr 9, 2023 at 10:49
  • This should also be moved to the WordPress section.
    – keepkalm
    Oct 20, 2023 at 19:11

1 Answer 1

1

Yes, that's correct. When you hide an image using CSS with display: None, The browser still loads the image, even if it isn’t rendered as visible on screen for the user.

All the resources mentioned in the HTML (i.e, images) will be loaded and pulled from the server by the browser even if they are not in view or you have used CSS to hide them on the webpage.

That involves the browser downloading the image file, which is costly on bandwidth and could result in bigger first load times of pages.

1
  • I think your answer is correct, save for the first sentence - which is the opposite of what the restr of your post conveys.
    – davidgo
    Sep 25, 2023 at 2:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.