Search Query

Photoshopping a Web Photo Gallery

There are certain events in all of our lives that demand to be documented with photographs. We all love to share these photos of special events with our friends and families no matter how distant they may live. With the ever-increasing popularity of digital cameras combined with the Internet and Adobe Photoshop setting up a photo gallery on the web becomes a great way to share the memories.

I could not help the fact that, as soon as the baby was born, the digital camera leapt into my hands and before I knew it I had scores of photos and two sets of grandparents itching for copies. Photoshop can create a utilitarian web gallery from a folder of images without you needing to know one lick of HTML coding.

The first step is to get all of your photographs in one directory, copy them from the digital camera to a folder on your hard drive. This will also work for scanned images or computer-generated images so don't feel left out if you don't have a digital camera yet.

In Photoshop, choose Web Photo Gallery from the Automate submenu of the File menu. The resultant dialog box may take a little getting used to, but here are the basics. At the top is a Styles pop-up menu. There are four styles available: Horizontal Frame, Simple, Table and Vertical Frame. On the right-hand side you will see a little sample thumbnail showing the format of the chosen style, for this example I am sticking to the Simple Style.

Beneath the Styles is an Options pop-up menu, also with four choices: Banner, Gallery Images, Gallery Thumbnails, and Custom Colors. You will want to investigate and adjust the options in all four areas. The Banner options (Fig. 1) allow you to title the pages, credit the photographer (although you could put any subtitle in this field), add the date and select the font and size of the text.

Fig. 1

The Gallery Images options (Fig. 2) allow you to resize all of the images so they are consistent. Plug in a number of pixels to which the image will be constrained. You can also add a border to the photos and set the JPEG Quality. Remember that a higher quality level will result in a larger file size and a slower download time on the web. Take it easy on those family members who are still using those rusty old 28.8K modems.

Fig 2

The Gallery Thumbnails options (Fig. 3) let you set a size for the thumbnails on the preview page along with how many rows and columns you want. There are check boxes for using either the File Name or File Info as captions. Again you get to pick fonts, sizes and borders. The last set of options, Custom Colors, (Fig. 4) allows you to change the colors of the web page background, text, links and banner.

Fig. 3

Fig. 4

At the bottom of the Web Photo Gallery window you have to set the Source and Destination of the files. This tells Photoshop where the digital camera files are and where to save the web pages and their corresponding images. Once this is all set, click the OK button. Go get a cup of coffee since the baby kept you up all night, it will take Photoshop some time to resize the images and generate the web pages (Fig 5).

Fig. 5

The last step is to upload the resulting web pages to you web server and email the URL to all those baby photo hungry relatives.

Paul Vaughn is a freelance graphic artist, writer and web designer. If you would like to see the Graphics Guy address a specific topic email Paul Vaughn at Soren Rodrigo Vaughn was born on February 5th; his father has plenty of pictures of him on his personal web site at Color examples can be seen at


|| Home || Graphics Guy || Mac Guy || Gallery || Payment || ||

This site and all images and text contained in it are ©2006 Paul Vaughn.
(Unless otherwise noted)
Questions? Problems?