Optimize Image Quality for Website

[thena_bean]

<p>Hello everyone: I'm in the final stages of putting together my first photography website. I would like some advice on how to optimize the color, size, and overall quality of my images.<br>

All advice is welcome. Thanks!</p>

[jeff_ford]

<p>...but then it would be 'our' site</p>

<p>:)</p>

[joe_c5]

<p>Save the images in sRGB color space, preferably with the sRGB profile embedded. Use jpeg format, probably at a quality of around 90 to 95.</p>

<p>Try not to edit and re-save jpeg files, since in some cases the compression artifacts can be cumulative. Better to start with a fresh copy of the master image.</p>

<p>For image dimensions there may be no correct answer. With heights greater than around 800 pixels or wider than around 1280 pixels, some people will probably see scroll bars or resized images. However, with images that small they will not fill the screen of large monitors.</p>

<p>If you do not want people copying your images, consider watermarking them. If you do not want them making prints, consider low resolutions of no more than around 720x480.</p>

<p>Some people like to sharpen images after they have been resized. I do not recommend doing this to every image by default, but some images can look better with the higher acutance (edge contrast).</p>

<p>Use separate images for thumbnails and full size images, since web browsers may not resize well and the thumbnails would be slow to load.</p>

<p>That ought to get you most of the way there.</p>

[leicaglow]

<p>Thena, It helps to use PhotoShop's "save for web" option. You can see what the image will look like for a particular setting, before it is saved. It generally saves a lot of file size to do it this way.</p>

[KenPapai]

<p>If you are posting 720 px images, like Joe recommends, then:</p>

<p>1. If your posted image file sizes are under 80 KB odds are high that your save quality is too low.<br>

2. If your posted image file sizes generally exceed 250 KB then odds again are high your save quality is too high.</p>

<p>Try to shoot for that sweet spot of 160 to 200 KB file sizes in the small 720 px size. And yes, of course, sRGB color spaced JPGs.</p>

[syed]

<p>Post resizing, I use Unsharp Masking between 200-300% for Amount, 0.3-0.5 for Radius, and 0 for Threshold.</p>

[JDMvW]

<blockquote>

<p>PhotoShop's "save for web" option</p>

</blockquote>

<p>makes the image sRGB, and otherwise optimizes it for display. Resize the image first, and you may need to put up saturation, etc. a bit to make up for the sometimes dullness of sRGB images.<br /> If you make the file sizes too large you encourage "borrowers", too low and they don't look as good, but I wouldn't go as high as Ken does, but I'm just posting here for No Words, etc.</p>

[jacopo_brembati]

<blockquote>

<p>put up saturation, etc. a bit to make up for the sometimes dullness of sRGB images.</p>

</blockquote>

<p>Using non-color-managed browsers the image may appare oversaturated or undersaturated.<br>

It depends on how far is monitor gamut from sRGB.<br>

Editing on monitor appearance basis is not a good rule.</p>

[alan_goldhammer]

<p>It's important to remember that over 95% of the viewers of your website will not have color managed monitors so I wouldn't spend a lot of time worrying about correcting the color saturation. The easiest way to create websites is by using the Lightroom web module as you do a lot of the custom work there in terms of layout. For mine, I only needed to do a little bit of HTML work to add the final customization.</p>

[marc_rochkind]

Quality of "90-95" is way too high.

 

See this:

 

http://regex.info/blog/lightroom-goodies/jpeg-quality

 

--Marc

[joe_c5]

<blockquote>

<p>Quality of "90-95" is way too high.</p>

</blockquote>

<p>I admit that it varies with the images, but visible jpeg artifacts look unprofessional on any website, let alone one dedicated to photography. I stand by 90 quality as the lowest I would use blindly on a photography website. Lower quality settings should be previewed to check for artifacts.</p>

<p>Also, the images in your photo.net gallery appear to be somewhere around 90 or 95 quality.</p>

<p>Keep in mind that this is for web images viewed at 1:1.</p>

[kelly_flanigan1]

<p>You have to know your target audience too.</p>

<p>If your site's main page has a boatload of images and they are all of the least compression; the site can take too long to load.</p>

<p>Some folks will say; "why bother with this unprofessional slow site that wastes my time; thus they go elsewhere.</p>

<p>Not everybody likes to wait in line; or wait on a slow site either.</p>