Adobe Photoshop Lightroom (Lr) is like a big house filled with kids. We feed, dress, and play with them but at some point we anxiously kick them out so they can make their own way in the world. In Lightroom parlance, that rite of passage is called exporting.
Recently, I used Lightroom to export photos for a website. I wanted several different sizes (dimensions and file sizes) for the exported images. Once I finished, I had learned how a few Lightroom tricks can speed up work and preserve inner peace.
Three Lightroom functions played a big role in my project:
- Export Presets
- Virtual Copies
I began my project by creating a new folder on my hard drive to store the images I would export and then upload later to my website. (Lightroom can directly publish to a web server via its Web module but you more control over sizes and file naming using the Export function instead.)
Within Lightroom you can gather candidate photos in collection so you can review them as a group before performing your export. I created a new Lightroom collection to store candidate images. To create a collection, click the plus (+) icon at the top of the Collections panel on the left side of your screen and name your new collection.
Now browse your photographs in the Grid view of the Library module. Scroll through the Library or use filters to automatically sort photos by star ranking, flag, or another attribute to reduce the number of images you have to review. Drag and drop candidates to the collection you created previously.
Once you’ve curated your images, perform a final review. Now you’re ready to export.
For my project, I wanted several kinds of exported images. Each kind was based on maximum dimensions and minimum file size to fit a particular use on my website. I needed several large background images that could be low file size and lower JPEG quality, a dozen slideshow images with smaller dimensions, and medium-sized images with a good JPEG quality for blog posts. To make things more efficient, I decided to create presets for each kind of export that I could apply to multiple images.
To create an export preset, pick an image from your Library. Next, click the Export button to bring up the Export dialog. At the top of the Export dialog, make sure that the Export To drop-down menu is set to Hard Drive. Select the folder location you had created on your hard drive for exports by picking it in the Export Location menu.
The remaining options in the Export dialog determine the visual quality, pixel dimensions, file size, and other attributes of your exported images. Here are the settings I used for large webpage background images:
File Naming Because some images would be used for backgrounds and others for smaller slide shows and portfolios, I used this field to add a generic prefix of “bg-” for background image. For slideshow and blog images I used sl- and bl- respectively.
File Settings If you’re concerned about file size, you can experiment with adjusting the JPEG Quality slider and field or try the Limit File Size To field. I ended up limiting file size but your preferences and experience may be different.
Image Sizing My images were all in landscape orientation. So I choose Resize to Fit: Long Edge and set the Resolution to 72 dpi.
Output Sharpening You should experiment with the Screen option and see what differences you notice in the exported images. Truthfully, I didn’t experiment but automatically went with Screen sharpening to boost the clarity of my iPhone photos.
Metadata Your paranoid angel may be whispering in your ear that you need to protect your hard work. If you’ve taken time to fill out metadata, including copyright (and there’s a Metadata preset you can set up and apply to your images), use this menu to select what fields of metadata to include with each exported image. I chose Copyright.
Once you finish in the Export dialog, make a preset you’ll use for exporting all images that fit the selections you made in the dialog. To do this, click the Add button at the bottom of the Presets panel on the left side of the Export dialog. By default your new preset will appear within the User Presets.
If you decide to tweak the preset’s settings later, you can always select your preset, make changes in the Export dialog’s menus and fields, and then right-click on the preset name and choose Update with Current Settings.
When you’re done, select each image, choose your preset, give it a unique name, and click the Export button. Repeat for each image.
If you’ve worked with Lightroom for awhile, you know that it’s a “non-destructive” image editor. Instead of altering pixels in your photos, it creates and stores a recipe of changes you make in the Development module. Those changes are applied to the image you see within Lightroom itself and to the image you choose to export as a JPEG. Lightroom anticipates your creative nature and gives you the capability to make virtual copies of an original image so you can play to your heart’s content on editing variations.
Unexpectedly, this proved a life-saver in my web project. Toward the end of my web development, I realized it would be cool to have a before-and-after slideshow. To build it, I needed a set of before and after pairs of images. Most of my edits were done with an original image, not a virtual copy. But I couldn’t reset an edited image and risk losing my edits. (There are ways around this scenario, including choosing Undo after exporting, but I’m overly cautious.)
So, for edited images, I simply selected the photo, right-clicked and choose Create Virtual Copy, and then entered the Develop module and selected Reset to return the copy to visual appearance of the original photo. I dragged and dropped these copies into my collection and exported them with the appropriate preset.
Lightroom can be a one-stop app for editing and exporting images for your website.
If you have any neat tricks on using Lightroom in web development, please comment!