: Photoshop to CSS, just got Retina I just got a new Macbook Pro with Retina and I'm confused about how to attack my PSD's. If I'm designing a site which has 14px font size, should I be settings

@Courtney577

For images, then yes you would want to version of the same image. One original size and the larger version being twice the size. There are a couple of ways you can get your image to work when zooming in. Javascript way, you will want to save the images like myimage.jpg and myimage@2x.jpg. You will then need to download retina.js from imulus.github.io/retinajs/ and then include

<script src="js/retina.js"></script>.

you can also do this with css
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
header h1 a {
background-image: url(images/myimage@2x.png);
background-size: 164px 148px; //original size image
}
}


I would stay away from slicing a PSD and trying to make everything "Retina".

Vote Up Vote Down