115 posts Too Much is Never Enough
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Has referred 200+ members
+3 more
premitheme says

Hi there,

Working on my first responsive & retina ready theme, and just wondering, do I really have to make EVERYTHING retina ready?!

When it comes to featured images, do you add image sizes @x2 for featured images and portfolio thumbnails for example? or just the images related to theme design like icons, buttons, backgrounds … etc?

I think it’s overkill to make every post/page’s featured image or portfolio thumbnail retina ready even if using any of the available technics to deliver them only when retina-enabled device is used.

What are you doing guys? And what feedback do you get from your buyers regarding that?

642 posts
  • Has been part of the Envato Community for over 3 years
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
ChapterThemes says

I think the first step is to make sure the theme’s design is Retina ready. Than you could have a look at used thumbs etc. – but since those images come from the theme users it’s also their responsibility to have images that are big enough. And in my experience most theme users do not always use good professional big quality images.

115 posts Too Much is Never Enough
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Has referred 200+ members
+3 more
premitheme says

I agree with you, but all what I concerned about is: when you advertise a theme as “100% retina ready” what are buyers expectations from your theme? I think some people will expect a real 100% retina ready while – in the real world – this will hurt their website loading time significantly. So these questions came to my head:

- Do the buyers understand the cons (before the pros) of delivering almost ALL their website’s images with retina support?

- DO the authors get complaints about slow loading websites due to lots of retina images used OR do you get requests for making more image resources retina ready instead (i.e. you get comments like “This is not really 100% retina ready as advertised!”)?

Retina images is a double-sided weapon IMO, but do the buyers know that?

3667 posts Ruben Bristian
  • Sells items exclusively on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $500,000+ on Envato Market
  • Has been part of the Envato Community for over 6 years
+9 more
KrownThemes says

You need to server “retina images” only for retina displays. There’s no need to double everything on the site! You can simply check if the user is on a retina display with js, store this with a cookie and server double images via an image resizing plugin..

84 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 10+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 1+ items on Envato Market
+1 more
Coffee-Themes says

I finish my new theme and it will be retina ready. Way that i approached problem is to prepare all assets in two sizes one for standard displays and @2x for retina and i will recommend WP Retina 2x plugin.

4569 posts Community Mod Building awesome stuff for your mobile devices!
  • Contributed a blog post
  • Elite Author: Sold more than $75,000 on Envato Market
  • Helps us moderate the forums
  • Has sold $125,000+ on Envato Market
+14 more
Enabled Moderator says

As I only develop for mobiles, I’m gonna give my 2 cents here!

Retina is no longer iPhone dependent! Retina actually means pixel density for devices! Remember that the iPhone is no longer the only retina thing out there! Samsung Galaxy S3 has 1.8x ratio for density, S4 the same, Nokia Lumia has 1.5 pixel ratio, it’s best you use larger images most of the times for great quality. If an icon is 16×16 make it 25×25, that way it will look great on non retina but close to retina screens as well!

For retina screens ( which soon will become something normal for all devices ) load them using Rubens method! Best possible way in my humble opinion! :)

115 posts Too Much is Never Enough
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Has referred 200+ members
+3 more
premitheme says

You need to server “retina images” only for retina displays. There’s no need to double everything on the site! You can simply check if the user is on a retina display with js, store this with a cookie and server double images via an image resizing plugin..

Yeah I know, and I do this exactly the same way :)

So guys, from your experience it’s better to make almost everything retina ready not only logo and icons, I mean even thumbnails, sliders …etc. If so, I’m on the right track, fortunately.

Thanks a lot everyone for your input.

115 posts Too Much is Never Enough
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Has referred 200+ members
+3 more
premitheme says

And if this helps anyone, I also let the user to optionally enable/disable “retinafied” images. but keep the ability to have the logo, icons, backgrounds and any raster design element in retina resolution always enabled.

115 posts Too Much is Never Enough
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Made it to the Authors' Hall of Fame
  • Has referred 200+ members
+3 more
premitheme says

I finish my new theme and it will be retina ready. Way that i approached problem is to prepare all assets in two sizes one for standard displays and @2x for retina and i will recommend WP Retina 2x plugin.

I know some authors rely on WP Retina 2x plugin, but noticed that some buyers prefer to have everything built-in. But this is not a big deal I think. Good luck :D

642 posts
  • Has been part of the Envato Community for over 3 years
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
ChapterThemes says

The solutions are nice – but still: Users need to have big images to create that x2 version and that’s mostly not the case. So maybe it’s good to have some explenation about that in the docs with the theme or something.

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by