hey thanks for this, so no real change from using my dell...
what about normal sites on the retina display, does it look really bad..? - i can imagine testing out the site on my retina and it not looking right so would need another machine to test with?
You need to build your site so it can scale for all different screen sizes & pixel densities.
How?
Ditch as many images as you can. Obviously, logos, photos, etc. still need to be there. For logos and other small graphics, you can follow the suggestion of the post just above mine and just make your image twice the size, and set the size thru CSS.
For example: if your logo is 100x100, make the file 200x200, and then use CSS to set the height and width of the element. Browsers will automatically scale it down, and on high density displays, you'll still have all the detail.
For graphics that are part of layout elements.. like when you used to need little image files to do rounded corners, gradient backgrounds, etc... ditch them. You can do many of these effects with CSS3.
For icons/small graphics, many of them can also be ditched now in favor of icon fonts. Icon fonts are vector based and load/function just like regular text fonts, so you can scale them up and down with no loss in quality.
Check out Font Awesome, it's probably the most popular:
http://fortawesome.github.io/Font-Awesome/
For larger images or photos, look into RetinaJS that was mentioned or AdaptiveImages.php.