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

iWeb '09 Essential Training

Adjusting images directly in iWeb


From:

iWeb '09 Essential Training

with Garrick Chow

Video: Adjusting images directly in iWeb

In the previous movie we looked at how you can work between iPhoto and iWeb to create your photo pages. Now if you are an iPhoto user, you may also already be using iPhoto to adjust and correct your photos. If so you'll be happy to know that many of the same adjustment tools in iPhoto can be found in iWeb. So if you need to tweak a photo on a webpage or even if you want to drastically change the appearance of a photo on your page without altering the original in your iPhoto library, you can do all your image adjustments from right here in iWeb. I am going to create another new blank page by clicking Add Page, selecting Blank and Choose. I just want a blank canvas so that I can put a larger version of an image on screen to work with. I'm not going to bother changing the movie text placeholders here. In fact, I'm just going to delete that one, so I have some more room to work with. I'm going to click Show Media, go to My Photos, and I'm going to find the image called Grand Hotel and drag that on to my page.

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...
iWeb '09 Essential Training
3h 30m Beginner May 13, 2009

Viewers: in countries Watching now:

Anyone looking for a fast and easy way to build a great web site can use iWeb to bring together and post photos and videos that were created using other iLife '09 applications. Instructor Garrick Chow demonstrates the basic functions and the new features of this application in iWeb '09 Essential Training. Garrick shows how to create and publish everything from basic web pages containing text and images to more involved pages with video. He also demonstrates how to create blogs and podcast pages. Exercise file accompany the course.

Topics include:
  • Manipulating and adjusting images directly in iWeb '09
  • Using built-in widgets to add interactivity
  • Importing movies from iMovie
  • Creating photo pages from iPhoto
  • Managing multiple sites
  • Using MobileMe with iWeb '09
  • Blogging and podcasting
  • Publishing a site via FTP
Subject:
Web
Software:
iWeb
Author:
Garrick Chow

Adjusting images directly in iWeb

In the previous movie we looked at how you can work between iPhoto and iWeb to create your photo pages. Now if you are an iPhoto user, you may also already be using iPhoto to adjust and correct your photos. If so you'll be happy to know that many of the same adjustment tools in iPhoto can be found in iWeb. So if you need to tweak a photo on a webpage or even if you want to drastically change the appearance of a photo on your page without altering the original in your iPhoto library, you can do all your image adjustments from right here in iWeb. I am going to create another new blank page by clicking Add Page, selecting Blank and Choose. I just want a blank canvas so that I can put a larger version of an image on screen to work with. I'm not going to bother changing the movie text placeholders here. In fact, I'm just going to delete that one, so I have some more room to work with. I'm going to click Show Media, go to My Photos, and I'm going to find the image called Grand Hotel and drag that on to my page.

And I'm just going to make this larger, so you can see it better. I'll just hide the Media Browser again. All right, so this is a nice image, but it could definitely use some fixing up. Let's click the Adjust button to open the Adjust image window, which we use to adjust and improve our images. So we have all these things we can adjust in here, but where to start. Well, it really depends on what you think you need to improve on in your picture. If you think the colors are off, you probably want to work with the Saturation, Temperature and Tint sliders. If we think the lighting in the picture is too dark or light, you want to play around with the Brightness and Contrast sliders as well as the Exposure and Level sliders. We also have a Sharpness slider, if you think the image needs a little bit of sharpening. But when adjusting your pictures probably the first thing you want to acquaint yourself with is the Histogram, which is this sort of graph looking thing down at the bottom of the Adjust window.

The Histogram represents the dark and the light tones of the Red, Green, and Blue channels that make up your pictures. Essentially, darker shades appear on he left side and lighter shades appear on the right. Generally, a good picture has data appearing across the entire histogram with some of these mountain shapes spikes appearing around it. The peaks represent the darker spots of your image and it's fine to have them in there. What you want to try to do is make sure your histogram is spread fairly evenly all the way across. Having large peaks together at one end or the other, very likely means your picture is either very under or overexposed. So it's a good idea to keep an eye on the histogram as you make your adjustments, but ultimately your eye is going to be the best judge of how a picture looks.

A good place to start in the Adjust panel is the Exposure slider. Ideally, you want to drag the sliders of e picture's midtones look acceptable. Midtones are the parts of the pictures that aren't really shadows and aren't really hot white spots. Notice if I drag the slider all the way to the left, the picture gets much darker and looks underexposed. All the way to the right and it looks very over exposed. You want to try to find a place in between where the contrast in the picture starts to look good to you. Use the histogram as a guide to make sure the peaks aren't bunched together at one end. Personally, I think this photo could use a little bit more exposure.

Now if you want to be able to make fine adjustments you can click the icons on either side of any slider in the Adjust panel. So I can click to advance one step at up at a time. And I think that looks pretty good. And you may have notice that the histogram now looks like it slightly shifted to the right or lighter side. Keep in mind that this is only the first step of the adjustment. Chances are you are not going to be able to completely improve your picture by just changing the exposure settings. Next, let's take a look at the Level sliders. As you just saw the Exposure slider lets you adjust the mid-tones of your picture, the Level slider lets you adjust the dark and light areas of the picture. The right slider adjusts the light color areas. Notice as I drag it to the left, the brightest areas of the picture get wider and wider. But the dark areas remain relatively unchanged.

Similarly, if I drag the left slider to the right, the dark areas get blacker and the light areas don't change as much. The trick you use usually to drag both sliders inward until they reach the base of the first mountain peak and the left slider or the dark slider is pretty much just about there. Let me just drag in a little bit and I can drag the right slider in a little bit as well. Now if you drag any further than the base of the first mountain peak, you start losing the picture's data. One technique I like to use is the purposely drag into too away, I know it looks bad, and then I start dragging out again until it looks good to me. Again, your eye should be the best judge. Don't get too caught up in the numbers.

Once you adjusted the Exposure and Level settings your picture should be looking better. Now we also have the Brightness and Contrast settings at the top of this window. In older versions of iPhoto these used to be the only way to manually adjust your images. Now that you have the Exposure and Level sliders both in iPhoto and iWeb, you probably won't even need the Brightest and Contrast sliders most of the time. But there will be pictures in which you might find slightly tweaking these sliders can improve your results. Changing the brightness essentially moves the entire histogram to the lighter or darker side. You are basically moving the midtones, highlights, and shadows all together. So you can see it doesn't give you nearly as much control as the individual Exposure and Level sliders have.

Even in this picture I have this very slight brightness adjustment to lighten the whole picture up a bit. Now the Contrast slider takes histogram and stretches it out. So if you drag it to the right, you are getting yourself more contrast or dragging to the left, sort of smooshes the histogram together giving you less contrast. I'll just add a little bit of contrast until I think it's a little too bright, now I'm just going to back the Level slider off a little bit. Now another thing Adjust panel lets you do is to correct the colors of your pictures. Depending on your camera you may find your pictures tend to be little on the reddish side or they might look a little green or blue. You can usually fix these sort of issues with the Saturation, Temperature, and Tint sliders found in the Adjust window. You will probably find you get the best results if you start with the Tint slider and move upwards from there.

The Tint slider adjusts the overall colorcast of the picture. Moving it to the right, moves things towards the green into the spectrum; to the left, and everything gets redder. How you use this is going to depend on your subject. In this particular picture the tint actually looks a little on the red side to me. But if you are not sure about your picture's tint, just drag the slider to the extreme and see what the effect is. I'm going to just drag mine slightly to the right. Next, the Temperature slider adjusts the photo in the Blue/Orange spectrum. Dragging to the left makes the picture bluer or cooler; dragging to the right makes it warmer or more orangish red. Now dragging to the left brings up the blue of the sky a little more, but also gives the whole image a blue cast.

I think it looks better in this case, if I drag to the right a little bit to warm the picture up. Last, you can use the Saturation slider to increase or decrease the intensity of the color tones that you just set. Dragging to the right really makes the colors pop. And in many cases it can make it look unnatural, if you drag too far. Dragging to the left eventually drains the picture of all color and you end up with a grayscale image. I'm just going to add a little bit of saturation. All right, looking good. I'm going to reset the image back to its original settings. Hit the Rest Image button to see the original.

So if you are not comfortable with moving all these sliders around just yet, you can try using the Enhance button, which is another feature from iPhoto. And you can see by the tool tip that appears there, this enhances colors automatically. So let me go ahead and click that. So the enhance feature examines among other things the picture's light levels, color balance and saturation and adjusts everything to give you a better-looking version of your picture. Sometimes that results in no significant change in your picture, but more often or not the results are better than what you started out with. So it's going to be up to you to determine whether you want to manually adjust your image or hit the enhance button or you could do both. Hit the enhance button first and start playing with the sliders. Now the last slider we hadn't looked at yet is the Sharpness slider.

Basically, this slider works by increasing the overall contrast of individual pixels in your picture giving you the illusion of improved focus. As I drag to the right notice that image starts look a lot crisper. You want to avoid dragging too far to the right, or else you will start seeing weird hallows and another strange looking pixels in your picture. Just drag enough to the right to make your picture look a little sharper. Now don't be fooled by its name though. If you have a blurry or out of focus picture, there is a very little the Sharpness slider can do. But you can also use the sharpness slider in the other direction too. If you want to make a background picture blurry, so that the text on top of it shows up, better just drag this slider all the way to the left or just as far as you want it to look the way you want it to look. But in this case I'm just going to make it a little sharper.

For the most part the Sharpness slider should be the last tool you use when you are adjusting your pictures. When you perform certain edits like color adjustments or hitting the Enhance button you might end up slightly blurring your image. So it makes sense to wait until you are done with all of your edits before adjusting the sharpness. So that's in the Adjust Image window. Go ahead and save this page and next we'll take a look at adding movies to a web page.

There are currently no FAQs about iWeb '09 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 iWeb '09 Essential Training.

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


OK

Course retiring soon

iWeb '09 Essential Training will be retired from the lynda.com library on April 24, 2014. Training videos and exercise files will no longer be available, but the course will still appear in your course history and certificates of completion.


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