7 Tools to Get Your Photos and Images Web Ready Without Using Photoshop

Have you ever been to a website where the images are distorted or grainy looking? Maybe you noticed that the images appear small, but take forever to load. This is usually due to the fact that people take a picture with their camera, upload it to a website, and adjust the display dimensions without actually changing the properties of the image itself. This makes for long page load times (frowned upon by Google) and may cause visitors to quickly leave your site.

How can you avoid this problem of distorted and slow-loading images? The answer is to optimize images before loading them onto your website. Web designers use tools like Photoshop to do just this. While Photoshop is a powerful tool to use for manipulating images, it also comes with a steep price tag, and an even more steep learning curve. I have Photoshop on my machine, but I do most of my image work in Fireworks, also owned by Adobe. What do you do if you don’t want to spend the big bucks or the time to learn these programs? There are plenty of alternatives that will get the job done. I recommend a number of programs that can either do everything you need, or at least part of it. With each of these programs in your toolbox, you should be all set to get your images web ready for your next blog post or web page.

1. FastStone Photo Resizer: This handy little app has the ability to batch process your images. For example, you may need all of your images to be a certain width, or perhaps you want them all to have a drop shadow. Just open up FastStone Photo Resizer, select the files you want to change, enter the dimensions and effects you want to apply, and presto, all of the selected images are changed to your specifications.

FastStone Photo Resizer Options
Choose tasks to perform on processed photos in FastStone Photo Resizer.
Select Files in FastStone Photo Resizer
Select photos to process in FastStone Photo Resizer, as well as format to save photos in and where to save them on your computer.

2. FavIcon Generator: You know that little icon that shows up next to the name of the site when you open a new tab in your browser? That’s a favicon. If you don’t have one, your browser or web host will gladly take the branding opportunity from you. Brand yourself easily by creating the file you need to add a favicon to your website.

FavIcon Generator
Choose an image to upload and transform it into a favicon for your website.

3. FindIcons.com: This site is a must-have resource to add social sharing icons to your website. Search by keywords, size, or color options. Be sure to check copyright info before using.

Find Icons
Find social media icons to match your website.

4. Glassy Buttons: This is great for setting up quick “Buy Now” or “Download” buttons. Think landing pages or squeeze pages. When you want someone to take action on your site, a button may be just what you need.

Glassy Buttons
Set options for your button, reload a preview, and download completed button to add to your website.

5. Google Plus: Google+ just got better recently when they began to automatically enhance photos as well as create new images from images you upload to Google+. I have my Android phone set to automatically upload any photo I take to Google+. This provides instant backup as well as instant access to my photos from anywhere. If I take a series of shots of the same subject, it will create a moving picture for me as well as a collage that I can easily share without doing additional manipulation. Also built in is an impressive photo editor that lets you do basic edits like crop, rotate, adjust colors, and resize. In addition, you can add text, effects, and decorations to your photos. If you remember Picnik, an online photo editor that was bought and killed by Google awhile back, you’ll be glad to see that it has been resurrected here.

Google Plus Editor
Google+ has preserved the interface from Picnik to edit images online.

6. Pixlr: About the closest you can get to owning a free copy of Photoshop, Pixlr is an advanced online photo editor.  The user interface includes features such as layers, masks, and filters and tools such as a wand tool, smudge tool, clone stamp tool, dodge tool, burn tool, red eye reduction tool, and a spot heal tool. You can do some serious editing here. If this seems like a little much, there is also an Express version available as well as Pixlr-o-matic which is a fun editor with overlays, borders, and filters similar to the effects you might see in Instagram photos. Mobile versions of each of these apps are also available so you can do most of your edits right on your phone or tablet. Save altered images to your computer, Pixlr, Facebook, Flickr, or Picasa. Be sure to save you photos in PXD (Layered Pixlr Image) format if you’d like to be able to adjust your changes later.

Open Pixlr Editor
Choose an image to start with in Pixlr Editor.
Pixlr-o-matic
Have fun transforming your photos in Pixlr-o-matic.
Save image in Pixlr
Choose where you’d like to save your Pixlr photo.

7. ScreenHunter: ScreenHunter does come equipped with a basic image editor, but I don’t use it for that. Instead, I use ScreenHunter to capture images from my computer screen to share in blog posts and social sharing sites. It comes in handy to put together slideshows and training documentation as well. This blog post would be just words were it not for ScreenHunter.

Screen Hunter
Set up your options in ScreenHunter, and then start snapping shots of your computer screen.

What is your favorite tool to use for image manipulation? What other alternatives to Photoshop have you found useful?