Yeah, yeah, yeah – it’s been a while since I’ve posted. You’ve had fair warning though that my position may have me out of town periodically, and in the interests of retaining quality of content, the quantity of content has had to take a back seat from time to time – hence the reason for the past two days. (If it’s any consolation, I also missed the deadline for the PhotographyBB magazine for January – my first missed January edition in the last 3 years…blah!) Today though, I wanted to take some time to share some insights I’ve had on the process of saving images for sharing on the web.
You see, traditional wisdom in saving for web is to follow three steps:
1. Re-size your images to no larger than 600px on the longest side – this is to make them more presentable in traditional screen resolutions. Keeping in mind though that as technology has advanced, screen resolutions have increased to include capacities such as 1600×900, I would suggest that if you want people to see your images large (as they are always best viewed), consider changing that to 1000px.
2. The second step is to adjust the resolution on your images from their default of 240-300 ppi (straight out of camera) to a more web-friendly setting of 72ppi. I would actually recommend that this practice continue, as it still is able to retain the detail needed for monitors while reducing the possible risk of having others take images off your website and print them without your permission.
3. Last but not least, and the point of the post today is that of color space. Traditionally, the wisdom has said to convert images to sRGB (standard RGB) because most browsers are not color-aware. Yet recent articles and tutorials I’ve read through several communities have suggested that you can tell shifts in color between sRGB and Adobe RGB. The test was to output images to both color spaces, and view natively inside a browser (just drag and drop in your own browser without the need to go to any web page). I did this, but could not tell a difference. So, the conventional wisdom I am not sure has been entirely eschewed as of yet. In the interests of gaining some thoughts and perspectives from a wider audience – I have two images that I’ve exported to both sRGB and Adobe RGB below. I’m not revealing which is which, and would like people to take a look at these on their own monitors? Which image looks better in each scenario? Let me know what browser/OS combination you are using and sound off in the comments or in the included poll. The results will be interesting to read – and I’ll likely follow up later with some more information on color spaces.
Check out the following results:
Scenario One – Hot Air Balloon Ride
Scenario Two: Botanical Gardens
Can you see a difference? Can you tell (without cheating on the filenames)? What are your own thoughts on the sRGB versus Adobe RGB color spaces? Do you save out to one or the other for web? What browsers and experiences do you have with these various formats? For me, the results are in the display, and since I want my images to be displayed with rich and full colors – coming as close as possible to what I remember with my camera eye – I’m starting to choose Adobe RGB for my output format of choice.
Sorry, there are no polls available at the moment.