Building Attractive Web Photo Galleries

By: Carla Schroder
Monday, December 20, 2004 12:27:35 PM EST
URL: http://www.linuxplanet.com/linuxplanet/tutorials/5681/1/

Good News and Bad News

The good news is all kinds of non-geek computer users have discovered digital cameras, and how to share their pictures on Web sites. This is a great way to share stuff: post once for many people to look at. The bad news is many of them have not discovered selectivity or image editing. They simply pour the entire contents of their cameras onto a Web page, creating multi-megabyte monsters with no thumbnails, no indexing, no captions, nor nuthin'- just a big mess that no one wants to spend half a day downloading, let alone look at.

If you really want visitors to come to your Web photo gallery and look at your pics, make it well-organized, attractive, and fast-loading. You don't have to spend wads of money on fancy software for creating nice user-friendly photo galleries, or wads of time either; the Linux world offers a multitude of excellent image-editing and gallery-creation programs. Today we'll look at ImageMagick and Album. ImageMagick resizes photos to a manageable size, and Album creates attractive photo albums with a minimum of fuss. Installation should be easy, odds are you can glom them with your fave dependency-resolving installer, such as apt-get, apt-rpm, Yum, urpmi, or Yast. And of course sources are available as well.

This is the general scheme for assembling nice user-friendly attractive Web photo albums:

• First, select the best photos. Do feel free to omit mistakes and redundancies. (Special note to newlyweds: it's not necessary to post all dozen photos of the same event, like lighting the candle or cutting the cake. No, really. Just select the best one of each.)
• Second, re-size the photos to a Web-friendly size and file format. JPEG (Joint Photographic Experts Group), which has the file extension .jpg or .jpeg is best for Web photographs. Keep in mind that half of the Internet-connected population in the US is still on dialup. In other countries it varies: some have lots of broadband, some don't. Overall, the percentage of dialup users is still high, so be kind and make your images lean.
• Third, have pages of thumbnails.
• Fourth, have links on each thumbnail page to the previous and next thumbnail page, and a home page link.
• Finally, link one photo to the next, so visitors can jump directly from photo to photo if they wish.

ImageMagick is a suite of image-editing utilities:

• animate
• compare
• composite
• output-image
• conjure
• convert
• display
• identify
• import
• mogrify
• montage

Camera Stuff and Converting Image File Formats

Most digital cameras give you a choice of several options for file format, most commonly JPEG or EXIF (Exchangeable Image File Format), TIFF (Tagged Image File format), and RAW. There are also various proprietary file formats that some of the different manufacturers use, such as PCD, or Photo CD. EXIF/JPEG and TIFF are universal formats, so stick with those. For most folks, EXIF/JPEG is just the ticket. It's compact, so you can store more pictures in your camera memory, yet it produces images of good quality. To learn more about these, see Akkana Peck's excellent Image Formats for the Web and Elsewhere.

Some of us stubborn oldtimers still prefer film cameras. We like being able to look at our photos without needing a computer, and we like the quality of photographic prints. And the longevity of digital storage is still quite doubtful, as is the quality of computer-generated hard copies. So we prefer to scan prints for posting on Web pages. The best file formats for scanned photos are either TIFF or JPEG, depending on how fussy you are about image quality. JPEG is faster, because you need JPEG format for your Web pages anyway, and it usually looks fine.

Suppose you have a TIFF file to convert to JPEG. First make a backup copy of the file, then use the mogrify command:

$ cp image1.tif image1.tif-bak
$ mogrify -format jpg image1.tif

mogrify will not overwrite the original file when you convert it to a new file format. However, there are many operations where it will overwrite the original. In any case it's always safer to work from a copy.

Since you're creating a Web photo album, you doubtless have a whole batch of pictures to convert. Put them all in a single directory, make backup copies, and with one command convert the file format and resize them:

$ cp -r /images /images-bak
$ mogrify -resize 640x480 -format jpg images/*.tif

This does not make all the pictures exactly 640x480; this sets the largest dimensions, and the images are resized proportionately. For example, if the original image is 800x1100, it will be resized proportionately to 349x480. If it starts out at 1100x800, the resized image will be 640x465. So this is perfect for resizing a directory full of pictures of different sizes and orientations. If you want an exact size, add an exclamation point:

$ mogrify -resize 640x480! -format jpg *.tif

Then create your album. The dot means you are in the directory that contains the images:

$ album .

And you're done. Really. Look for the index.html page and open it in a Web browser. You'll see something like this example.

Creating Multiple Albums and Adding Themes

This example page contains links to multiple albums. The easiest way to manage multiple albums is to have a master directory containing subdirectories of images, one subdirectory per album, like this:

$ tree -d -L 1 albums
albums
|-- homestead
|-- homestead2
`-- outdoors

Album will traverse all the subdirectories and create the albums. This also demonstrates Album's themes; the theme used in this example is W_Peterman.

The default theme is rather plain, as this shows. I prefer plain, but Album comes with a bale of different themes for those who want to jazz things up a bit. The themes are stored in /usr/share/album/themes or thereabouts. Copy the folder containing the theme you want to the same directory level as your main albums folder, like this:

W_Peterman
albums
|-- homestead
|-- homestead2
`-- outdoors

Then use the -theme and -theme_path options to apply the theme:

$ album -theme W_Peterman -theme_path=W_Peterman albums

Then, when you upload to your Web site, be sure to maintain the exact same directory structure.

When you preview your cool Web photo album on your computer before uploading, some of the links won't work. Don't worry about it, they'll sort themselves out after uploading.

Adding New Albums

When I want to add another album, I will create a new subdirectory under albums containing my pictures, and run mogrify as needed. Then adding the new album is done this way:

$ album -add albums/homestead3 albums

And there you have a nice, organized, easy-to-navigate efficient Web photo gallery that people will actually view and enjoy.

Resources