As retina displays are becoming more pervasive in Apple hardware, and we're here to support users of Apple products, I think it would be great if the AD site included retina versions of its image resources, such as the header image, voting buttons, and user profile photos.

This WWDC talk has info about how to achieve this. There are several choices for detecting retina displays, including CSS @media queries and window.devicePixelRatio.

This might give you an idea of how it looks without retina graphics:

retina screenshot

(Only slightly relevant but fun: AD logo I made with pure CSS.)

  • Apparently I don't have Myriad Pro on my system. So the logo doesn't quite look the same. Otherwise, neat. Commented Jul 29, 2012 at 1:38
  • @JasonSalaz the logo should be the same for you, since it's just an image.
    – Jin
    Commented Jul 30, 2012 at 17:17
  • @Jin he's referring to the CSS logo linked at the bottom of my post (which depends on the Myriad Pro font).
    – jtbandes
    Commented Jul 30, 2012 at 17:35
  • @jtbandes ah ok. I missed that part.
    – Jin
    Commented Jul 30, 2012 at 17:35

2 Answers 2


Solved with the design update.


We have plans to update all the icons for SE sites to retina at some point. It will be a lengthy process. We're still deciding on which icons have higher priority. The obvious ones are the logo and voting arrows/favstar.

  • 6
    Could Ask Different act as a testbed for these changes? It would be only appropriate :)
    – jtbandes
    Commented Jul 30, 2012 at 17:38
  • 3
    It certainly would make the most sense for AD to get them first :)
    – Jin
    Commented Jul 30, 2012 at 17:39
  • 2
    Do voting buttons even have to be images? Maybe on other sites but not on this one. There are characters that match the buttons and can be manipulated with CSS color, gradient, and shadow properties. ▲ ▲ ▼ ▼ ◀ ► ◀ ► you know the rest. I suppose for consistency's sake you would need them all to be images, or all to be characters, though. Commented Jul 30, 2012 at 17:55
  • 2
    If you look at the html structure, each arrow is a single anchor. also, we can't use ▲/▼ as the anchor text due to screen reader issues.
    – Jin
    Commented Jul 30, 2012 at 18:01
  • 1
    Using unicode symbols tends to cause issues of rendering different on different systems, depending on the font substitution.
    – asmeurer
    Commented Sep 15, 2012 at 7:57
  • @Jin any update on the work towards updating the images for SE sites?
    – ahsteele
    Commented Sep 29, 2012 at 19:46
  • Now that I'm using the site on a retina MBP, I really, really, really am a huge fan of the work being done incrementally. The controls that get used hundreds of times and the thin lines being drawn on review panes, mod tools and such are gorgeous. I appreciate the structural work being done even though not all icons are 2x yet.
    – bmike Mod
    Commented Feb 23, 2013 at 20:23

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .