Retina Ready best practices

Support
#1

Hi, I see some random retina ready questions, and I understand how the “eye” icon works. My question is this, are there, or can you point me to any best practices in preparing retina ready images for use in Pro…

  • Best retina ready sizes for header images, content images, logo image?
  • Do we need the additional plugin WP retina x2 or is Pro taking care of this?

For reference we usually use:

  • 1600px wide for banners
  • 1000px wide for featured images and images in content

We also use the Imagify plugin to compress and deliver webp images

Thanks

#2

Hello Riceman,

Thanks for writing in!

You do not need any plugin for the retina images. Simply double your image dimension so that when you enabled the Retina “eye” icon, the image will be displayed crisp in retina-enabled devices.

For example, if your content site width is 1200 pixels wide, you can upload a banner image dimension of 2400 pixels so that in the retina-enabled display, your banner image will be crisp.

And if you wonder about the image proportion, kindly check out the explanation of @Kory in this thread:

Hope this helps.

#3

perfect, thanks… and the link was very helpful. One more question if I can, I have always saved images at 72dpi, I assume I still do this…but double the dimension size. Is that correct?

#4

Hi Riceman,

Yes, as my colleague said, you just need to double the size of your images and save it at 72dpi.

Thank you.

#5

Awesome, thank you!

#6

Hi Riceman,

You’re welcome and it’s our pleasure to help you! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.