3 Tips to Saving Your Promo Images like a Pro

There are 3 things you need to do in order to have professional looking promo images. We get a variation on this question monthly.  In my opinion, the worst thing you can do while uploading images to your website, is to rely on the web browser to resize your images.  The web browser is the worst possible image processing system.  Which leads us right into our first tip:

1. Use Photoshop

Never rely on the web browser to resize your photos.  To achive maximum quality and page loading speed, you must resize and crop your photos in a photo editing program, like Photoshop.  For an open source (and free) alterative, try GIMP.

2. Unsharp Mask (After Resizing)

No resize is ever complete without using Adobe's Unsharp Mask tool.  Despite its name, the Unsharp Mask tool is the best way to softly sharpen an image.  It works great on fine details.  A word of caution: it's easy to over-sharpen an image.  My suggestion is to use an amount between 90% - 120%, a radius of 0.3 pixels and a threshold of 0.  This group of settings has served me very well over my web design career.  If you are lucky enough to use the Site Avenger CMS (Content Management System), the unsharpen mask is seemlessly built into all dynamic image generation functions.

3. Save for Web... and Keep Image Size Low

Using Adobe's built-in Save For Web... feature in Photoshop, you will cut precious seconds off of an image's download time.  The benefit of using Save for Web... is most notable on JPG and JPEG images.  Using Save For Web... will allow you to display jpegs with no noticable pixelation at file sizes much smaller relative to the original image.  You have to play around with the different settings and options, however we've noticed that a quality 51% to 60% is the Save For Web... sweet spot.  You'll be saving high-quality images at very low file sizes (see sidebar).

I hope you enjoyed these tips.  Leave a comment if I've left out an obvious design tip.

Thanks,
-Kevin

P.S. Thanks to Cardullos.com for the use of the Bakermaid Fruitcake promo image.

Tagged As:

Read more of Saco Design's Blog.  Don't miss out on what's going on at the Saco Design Workshop.

Posted on 01/07/2013 at 01:05 pm by Kevin Wentworth Viewed 4,558 times
Copyright Saco Design
Visit Site Avenger

Mobile Site | Full Site