Unfortunately the image I was working with has a ton of tiny little white spaces in addition to the regular background so when placed against a non-white surface, like on my website, it didn't look so hot (I put gray behind it here to illustrate the difference). To get rid of all of those would have meant hours of painstakingly zooming in and clicking on each and every little white area separately...
So I began researching online and lo and behold there was an easier way! Maybe people more experienced with Photoshop than I am already know this trick but for those of you who don't, it is a lifesaver!
- First press Cmd+A then Cmd+C to select and copy the image from your Photoshop layer (make sure it is in an unlocked, editable layer)
- Click on the Channels tab and create a new Alpha channel
- Then click Cmd+V to paste the selection in this channel. (You might have to turn off the visibility on your other channels and click the eye icon next to this new channel to see it)
- Press Cmd+I to invert the image and then hold down the command key and click the channel layer
- Go back to your normal Layers tab and click the layer with your image, then hit Cmd+C and Cmd+V. This will select all the colored in regions in that image and place them in a new layer.
- Turn off the original layer and voila! Now all the white is gone and your image can easily be added to a colored background:
If you go to the original post by ValuedResource.com on Web Design Library (thank you!) there are more images with the step-by-step instructions. Overall, this method saves so much time and I am a much happier camper knowing I won't be staring at the computer screen for the next few hours...now instead I can go enjoy my Friday night pizza dinner :)