Start learning with our library of video tutorials taught by experts. Get started

Photoshop CS5 Essential Training

Exporting web photo galleries


From:

Photoshop CS5 Essential Training

with Michael Ninness

Video: Exporting web photo galleries

If you are a photographer or a designer or just want to share your images with your family, one of the things that you might want to learn how to do is create a Web Photo Gallery. Now, there are lots of different options available to you. If you want to create one that's a little bit interactive and has a slideshow and little thumbnails, you don't necessarily want to crack open a product like Flash and create that from scratch. Adobe Bridge can do a lot of the heavy lifting for you, if you take advantage of its Output module. So, here I have ten images. And I want to create a Web Photo Gallery of these ten images, and either post these online or save them to a folder and send that on a DVD to someone or something like that.
Expand all | Collapse all
  1. 6m 10s
    1. Welcome
      1m 47s
    2. What is Photoshop?
      2m 49s
    3. Using the exercise files
      1m 34s
  2. 28m 29s
    1. What is Adobe Bridge?
      1m 54s
    2. Getting photos from a camera
      3m 39s
    3. A tour of the different workspaces in Adobe Bridge
      4m 58s
    4. Customizing how thumbnails are displayed
      3m 35s
    5. Changing obscure camera file names with the Batch Rename command
      2m 36s
    6. Adding basic metadata to every image with metadata templates
      3m 36s
    7. Creating and applying keywords to images
      4m 6s
    8. Viewing images in Full Screen Preview mode
      4m 5s
  3. 23m 4s
    1. Using Review mode to filter out rejects
      5m 27s
    2. Protecting the keepers by saving them in collections
      3m 18s
    3. Rating images
      3m 15s
    4. Using the Filter panel to view different subsets
      4m 43s
    5. Viewing final choices in a slideshow
      2m 12s
    6. Organizing groups of images into stacks
      4m 9s
  4. 30m 50s
    1. Raw vs. JPEG files
      5m 13s
    2. Why you should start in Camera Raw instead of Photoshop
      5m 9s
    3. A tour of the Camera Raw user interface
      6m 44s
    4. Previewing before and after adjustments
      4m 2s
    5. Toggling onscreen Shadow/Highlight clipping warnings
      2m 37s
    6. Choosing output settings
      2m 45s
    7. Saving a copy without going to Photoshop
      4m 20s
  5. 41m 34s
    1. Eliminating red-eye with the Red Eye Removal tool
      1m 13s
    2. Improving composition with the non-destructive Crop tool
      3m 33s
    3. Correcting a rotated horizon line with the Straighten tool
      3m 5s
    4. Fixing color casts with the White Balance tool
      2m 13s
    5. Fixing blown-out highlights with Recovery
      2m 36s
    6. Revealing hidden shadow detail with Fill Light
      1m 47s
    7. Reducing distracting color noise with Noise Reduction
      5m 37s
    8. Removing color fringes with Chromatic Aberration
      2m 36s
    9. Sharpening the details
      8m 59s
    10. End to end: Taking a so-so photo and making it great
      9m 55s
  6. 39m 5s
    1. Fixing blown-out skies with the Graduated Filter tool
      4m 34s
    2. Retouching blemishes with the Spot Removal tool
      5m 41s
    3. Making local adjustments with the Adjustments Brush
      4m 28s
    4. Quick portrait retouching technique using Clarity
      4m 33s
    5. Converting to black and white
      3m 36s
    6. Editing images directly with the Targeted Adjustments tool
      4m 18s
    7. Easy sepia and split tone effects
      2m 35s
    8. Adding digital film grain texture effects
      2m 46s
    9. Adding vignettes and border effects
      2m 13s
    10. Saving variations within a single file with Snapshots
      4m 21s
  7. 15m 48s
    1. Copying settings from one file and pasting across another in Adobe Bridge
      3m 7s
    2. Processing multiple files in Camera Raw
      2m 28s
    3. Saving and using a library of Camera Raw presets
      5m 33s
    4. Using Image Processor to batch process multiple files
      4m 40s
  8. 30m 39s
    1. Opening files from Adobe Bridge
      3m 1s
    2. Opening files from Mini Bridge
      3m 28s
    3. Customizing the Mini Bridge panel
      2m 57s
    4. Changing Mini Bridge so it auto-collapses
      1m 20s
    5. The Application frame
      2m 16s
    6. The Application bar
      1m 16s
    7. Switching and saving workspaces
      4m 23s
    8. Panel management
      5m 31s
    9. Switching tools using the keyboard
      3m 18s
    10. Customizing the keyboard shortcuts
      3m 9s
  9. 16m 12s
    1. Tabbed documents
      2m 1s
    2. The Arrange Documents widget
      1m 38s
    3. How to stop Photoshop from tabbing documents
      3m 34s
    4. Pan and zoom
      5m 21s
    5. Cycling through the different screen modes
      3m 38s
  10. 36m 59s
    1. File formats
      13m 6s
    2. What resolution does your image need to be?
      10m 15s
    3. Resize vs. Resample
      9m 40s
    4. How big a print can you make with your image?
      3m 58s
  11. 42m 17s
    1. Crop options
      4m 12s
    2. Hide vs. Delete for the Crop tool
      3m 30s
    3. Bringing back hidden pixels with Reveal All
      1m 34s
    4. Making the canvas bigger with the Crop tool
      6m 1s
    5. Making the canvas bigger by a specific amount with Relative Canvas Size
      1m 39s
    6. Correcting perspective with the Crop tool
      3m 5s
    7. Straightening a crooked image
      50s
    8. Scaling, skewing, and rotating with Free Transform
      4m 12s
    9. Nondestructive transformations with Smart Objects
      4m 2s
    10. Warping images
      3m 40s
    11. Preserving the important elements with Content-Aware Scaling
      9m 32s
  12. 54m 42s
    1. The Background layer
      5m 14s
    2. Using a layer mask instead of deleting pixels
      4m 12s
    3. Loading multiple images into a single Photoshop document as layers
      1m 30s
    4. Naming, hiding, creating, and deleting layers
      4m 18s
    5. Changing the stacking order of layers
      2m 51s
    6. Selecting layers without using the Layers panel
      6m 28s
    7. Transforming layers
      7m 16s
    8. Aligning and distributing layers
      3m 51s
    9. Changing the opacity of layers
      2m 57s
    10. Organizing layers into groups
      2m 55s
    11. Saving variations with layer comps
      5m 3s
    12. When to merge and rasterize layers
      5m 0s
    13. Flatten vs. Save As (a Copy)
      3m 7s
  13. 1h 4m
    1. Using the Marquee and Lasso tools
      7m 23s
    2. Transform selections
      2m 40s
    3. Quick Mask is your friend
      4m 31s
    4. Converting a selection into a layer mask
      6m 33s
    5. Using the Quick Selection tool
      3m 1s
    6. Re-selecting a previous selection
      1m 35s
    7. Improving a selection with Refine Edge
      4m 21s
    8. Touching up a layer mask with the Brush tool
      12m 7s
    9. Changing the opacity, size, and hardness of the painting tools
      2m 59s
    10. Blending images with a gradient layer mask
      4m 53s
    11. Swapping heads in a family portrait
      3m 53s
    12. Combining multiple exposures with the Blend If sliders
      6m 26s
    13. Replacing the sky in an image
      4m 19s
  14. 1h 1m
    1. Introducing adjustment layers
      7m 57s
    2. Starting with a preset
      4m 25s
    3. Improving tonal quality with Levels
      10m 28s
    4. Increasing midtone contrast with Curves
      5m 4s
    5. Removing a color cast with Auto Color
      5m 56s
    6. Changing the color temperature with Photo Filter
      2m 55s
    7. Shifting colors with Hue/Saturation
      9m 0s
    8. Making washed out colors pop with Vibrance
      2m 46s
    9. Converting color to black and white
      5m 49s
    10. Controlling which layers are affected by an Adjustment Layer
      7m 28s
  15. 11m 32s
    1. Shadow/Highlight
      9m 3s
    2. Matching color across multiple images
      2m 29s
  16. 34m 12s
    1. Removing blemishes with the Spot Healing brush
      6m 21s
    2. Quick technique for smoothing skin and pores
      8m 23s
    3. Taming flyaway hair
      4m 47s
    4. Making teeth bright and white
      1m 43s
    5. De-emphasizing wrinkles
      4m 41s
    6. Removing unwanted details with Content Aware Fill
      4m 26s
    7. Body sculpting with Liquify
      3m 51s
  17. 21m 6s
    1. Creating panoramas with Photomerge and Auto-Blend
      7m 20s
    2. Combining multiple frames of an action sequence
      8m 30s
    3. Combining group shots with Auto-Align
      5m 16s
  18. 25m 36s
    1. Overview of filters
      4m 6s
    2. Applying filters nondestructively with Smart Filters
      4m 45s
    3. Giving an image a soft glow with the Gaussian Blur filter
      4m 41s
    4. Adding noise to an image with the Add Noise filter
      3m 34s
    5. Sharpening an image with Unsharp Mask
      4m 12s
    6. Giving an image more texture with the Texturizer
      1m 17s
    7. Applying a filter to multiple layers
      3m 1s
  19. 30m 44s
    1. Cycling through the blending modes
      4m 43s
    2. Three blending modes you must know
      6m 41s
    3. Adding a lens flare effect with Screen
      3m 33s
    4. Making a cast shadow more realistic with Multiply
      4m 33s
    5. Creating a diffused contrast glow effect with Overlay
      6m 2s
    6. Sharpening an image with High Pass and Overlay
      5m 12s
  20. 21m 39s
    1. Character (point) type
      8m 19s
    2. Paragraph (area) type
      4m 42s
    3. Type on a path
      2m 54s
    4. Clipping an image inside type
      2m 24s
    5. Warping type
      3m 20s
  21. 20m 35s
    1. Adding a drop shadow effect
      4m 43s
    2. Adding an outer glow effect
      3m 13s
    3. Adding a border around an image
      2m 53s
    4. Copying layer effects and applying them to other layers
      2m 3s
    5. Saving layer styles and applying them in other documents
      2m 42s
    6. How (and when) to scale layer effects
      5m 1s
  22. 16m 6s
    1. Creating PDF contact sheets
      6m 41s
    2. Exporting web photo galleries
      6m 8s
    3. Saving for the web
      3m 17s
  23. 1m 19s
    1. Goodbye
      1m 19s

Watch this entire course now—plus get access to every course in the library. Each course includes high-quality videos taught by expert instructors.

Become a member
Please wait...
Photoshop CS5 Essential Training
11h 15m Beginner Apr 30, 2010

Viewers: in countries Watching now:

In Photoshop CS5 Essential Training, author Michael Ninness demonstrates how to produce the highest quality images with fantastic detail in the shortest amount of time, using a combination of Photoshop CS5, Adobe Bridge, and Camera Raw. This course shows the most efficient ways to perform common editing tasks, including noise reduction, shadow and highlight detail recovery, retouching, and combining multiple images. Along the way, Michael shares the secrets of non-destructive editing, utilizing and mastering Adobe Bridge, Camera Raw, layers, adjustment layers, blending modes, layer masks, and much more. Exercise files are included with the course.

Topics include:
  • Automating image adjustments with Camera Raw
  • Adding keywords, ratings, and other metadata to images
  • Filtering a large collection of images down to the "keepers"
  • Cropping, correcting perspective, and straightening images
  • Creating, naming, hiding, and deleting layers
  • How to make selections and masks quickly
  • Improving mask quality with Refine Edge
  • Techniques for combining multiple images
  • Non-destructive editing techniques with adjustment layers and Smart Filters
  • Retouching essentials, such as blemish removal and body sculpting
  • Color correcting images
  • Using the essential blend modes, layer effects, and styles
  • Creating contact sheets and web photo galleries
Subjects:
Design Photography
Software:
Photoshop
Author:
Michael Ninness

Exporting web photo galleries

If you are a photographer or a designer or just want to share your images with your family, one of the things that you might want to learn how to do is create a Web Photo Gallery. Now, there are lots of different options available to you. If you want to create one that's a little bit interactive and has a slideshow and little thumbnails, you don't necessarily want to crack open a product like Flash and create that from scratch. Adobe Bridge can do a lot of the heavy lifting for you, if you take advantage of its Output module. So, here I have ten images. And I want to create a Web Photo Gallery of these ten images, and either post these online or save them to a folder and send that on a DVD to someone or something like that.

Let's begin by doing a Select All, Command+A, Ctrl+A of the images that I want to create a photo gallery of. I will switch over to the Output workspace inside Adobe Bridge. We are currently in Essentials. I will use the Workspace Switcher, the down arrow and switch over to Output. The default option for the Output module is to create a PDF contact sheet. We are going to go ahead and switch this to Web Gallery. I will go ahead and click on that. The first thing you want to experiment with is which Template you want to use. Bridge actually ships with quite a few different styles of Web Galleries that are very, very cool.

Let's just go ahead and choose the Standard one and see what that looks like. Now, to refresh the Preview, to get this to look like a Web Photo Gallery instead of a PDF contact sheet, you do need to hit the Refresh Preview button. That will update your center area here to actually show you what this looks like. You can see, just from the default Standard Template, you are already getting something really cool. This is actually an interactive Preview. You can actually test the interaction of your Web Photo Gallery right here inside Bridge, without actually having to go outside to our browser. You can see there is some placeholder text.

There is a default name of this called Adobe Web Gallery. You will probably want to change that to something more meaningful for you. You can put your Contact Information here. There is built-in navigation, and showing you how to go from slide to slide. You can click Play to slideshow and show you what number you are on. So, lots of flexibility, and there is color options and so forth. To customize your Web Photo Gallery, you have lots of options down below in this section here, starting with Site Info. Before we get there though, let's just try one of these other Templates. So, instead of Standard, we can choose Left Filmstrip, Filmstrip, Journal, and so forth.

I might even choose something like this, the Airtight PostcardViewer. Let's take a look what that looks like. Again, to preview this inside Bridge, you have to hit the Refresh Preview button. You will get a completely different looking Web Gallery. Now, this is actually kind of cool, because you zoom in, you click to zoom back out, your little thumbnails here. So, it's a much simpler navigation but kind of cool and engaging, like little snapshots thrown on an art table, so to speak. So, there is that version. Let's go back to Style. There is only one Style for this particular Template.

We can try Airtight AutoViewer. Let's see what that looks like. We will Refresh our Preview. So, this looks like it navigates from left to right. That's kind of cool as well. So, lots of different options here. You get really large preview images. Again, you can test this right inside Adobe Bridge. I am going to go back to a more standard one. Let's go back to just Filmstrip, and again, click the Refresh Preview button. You can start seeing what this is going to look like. We will just go from this one. All right.

Go into the Site Info. You see Gallery Title: Adobe Web Gallery. Let's call it Sisters. Gallery Caption: let's call this Greenlake Winter Shoot. We will hit Refresh Preview to make sure that's updated. You will see that changing here. You can put your Contact Information in here. So, I will put in Michael Ninness. Put your E-mail Address in there if you want, some Copyright information, and so forth.

You can give some information About This Photo Gallery. Go ahead and type in some stuff there if you want. I will just keep going. Here is where you can customize the Background colors and the menu colors and so forth. I am going to go ahead and leave everything at the defaults, but you can see, anywhere there is a Color Chip, that's something you can change. So, if I want to change the Main Background Color, you click on that. You get a Color Picker showing up. If I want this to be more of a dark gray, you can do that. We will click the Color Picker, and I would hit Refresh Preview again to modify that choice. You can see the background at the very back is this dark gray now.

Further customization, if you go down to Appearance, you have the ability to control the overall size of all the elements. So, the actual Thumbnail Size is the full size Gallery Image. If you want a Slideshow to happen automatically, how much time do you want to have happened between each Slide, what kind of Transition do you want? We will just go with the defaults and Fade, and so forth. When you are ready to actually save this out, you can either save this to your local hard drive, or if you have actually got a web page up and an access to your Web Server, your FTP Server, you can actually put the path to that FTP Server, your User Name or Password and a subfolder that you want to directly post this up to.

If you have got a live Internet connection, you can push this right from Adobe Bridge right up to your Web Server, which is pretty cool. For us, we are just going to go ahead and preview this in the browser, as if we had done a full on save. You would hit the Save button and give this a name. Save it to a location on your hard drive. We will assimilate that by just clicking the Preview in browser button, and that exports everything needed to create this custom Photo Gallery, and it will launch your default browser. We will go ahead and resize this browser window. You can see there is the Photo Gallery that we created without having to write any code, and we didn't have to crack open Dreamweaver or Flash Professional. It took care of all that, and you saw that we had quite a bit of customization available to us.

I can either just click the Play button to do an automatic Slideshow, and we said it would play for about five seconds, then fade into the next image. We can manually advance to each one if we want to do that. Again, we get that Fade transition from image to image. Or I can quickly jump to any specific Thumbnail with this Filmstrip mode down below. So, this is just to get you oriented, to see that you have a lot of power within Adobe Bridge. Let's go ahead and quit the browser. This will take us back to Adobe Bridge, and you see you have lots of different options to create a custom Photo Gallery that meets your needs, all from within Adobe Bridge, which, of course, is included with Photoshop.

There are currently no FAQs about Photoshop CS5 Essential Training.

Share a link to this course
Please wait... Please wait...
Upgrade to get access to exercise files.

Exercise files video

How to use exercise files.

Learn by watching, listening, and doing, Exercise files are the same files the author uses in the course, so you can download them and follow along Premium memberships include access to all exercise files in the library.
Upgrade now


Exercise files

Exercise files video

How to use exercise files.

For additional information on downloading and using exercise files, watch our instructional video or read the instructions in the FAQ.

This course includes free exercise files, so you can practice while you watch the course. To access all the exercise files in our library, become a Premium Member.

Upgrade now

Are you sure you want to mark all the videos in this course as unwatched?

This will not affect your course history, your reports, or your certificates of completion for this course.


Mark all as unwatched Cancel

Congratulations

You have completed Photoshop CS5 Essential Training.

Return to your organization's learning portal to continue training, or close this page.


OK
Become a member to add this course to a playlist

Join today and get unlimited access to the entire library of video courses—and create as many playlists as you like.

Get started

Already a member?

Become a member to like this course.

Join today and get unlimited access to the entire library of video courses.

Get started

Already a member?

Exercise files

Learn by watching, listening, and doing! Exercise files are the same files the author uses in the course, so you can download them and follow along. Exercise files are available with all Premium memberships. Learn more

Get started

Already a Premium member?

Exercise files video

How to use exercise files.

Ask a question

Thanks for contacting us.
You’ll hear from our Customer Service team within 24 hours.

Please enter the text shown below:

The classic layout automatically defaults to the latest Flash Player.

To choose a different player, hold the cursor over your name at the top right of any lynda.com page and choose Site preferencesfrom the dropdown menu.

Continue to classic layout Stay on new layout
Welcome to the redesigned course page.

We’ve moved some things around, and now you can



Exercise files

Access exercise files from a button right under the course name.

Mark videos as unwatched

Remove icons showing you already watched videos if you want to start over.

Control your viewing experience

Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.

Interactive transcripts

Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.

Thanks for signing up.

We’ll send you a confirmation email shortly.


Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

Keep up with news, tips, and latest courses with emails from lynda.com.

Sign up and receive emails about lynda.com and our online training library:

Here’s our privacy policy with more details about how we handle your information.

   
submit Lightbox submit clicked