Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member

Preparing images

From: Moodle 1.9 Essential Training for Teachers

Video: Preparing images

Compressing images, audio and video for the web truly is an art form in and of itself. To really do this subject justice is well beyond the scope of this course. But what we can do is go through a couple of techniques for compressing images, audio and video that will help you get good enough results. In this movie we're going to step through the process of using a feature that's built into a lot of image editing programs and that is the building of a web photo gallery and then and extracting out the resources that are created as part of that process.

Preparing images

Compressing images, audio and video for the web truly is an art form in and of itself. To really do this subject justice is well beyond the scope of this course. But what we can do is go through a couple of techniques for compressing images, audio and video that will help you get good enough results. In this movie we're going to step through the process of using a feature that's built into a lot of image editing programs and that is the building of a web photo gallery and then and extracting out the resources that are created as part of that process.

So to begin let's go ahead and minimize Firefox out of the way and if you're following along with the exercise files, I'm inside of the Chapter 4 folder. There is a folder called Images and inside of Images are a whole bunch of JPEG images of Coral Reefs that we have ready for you to be able to compress. Now the images, if we go ahead and look at the pixel dimensions over here in my Finder, we can see that these images are roughly around 2000 pixels by 1500 pixels and that's way to big for distributional web. So what we want to do is we want to batch compress all of these pictures.

Now I'm going to go ahead and I'm going to use Adobe Photoshop CS3. Adobe has had, since version 5.5 of Photoshop all the way up through CS3, a plug-in that will automatically create a web photo gallery for you out of a folder of images. In CS4 they've moved this functionality into the Bridge. A lot of other programs out there that work with images will also create a web photo gallery. So if you don't have a copy of Photoshop, then go ahead and use whatever image editing program. The steps are going to be a little different but we'll show you the general process that you're going through.

So what you're going to do is go up to the File menu in Photoshop CS3 and come down to the Automate menu. Then you want to go over to the Web Photo Gallery and go ahead and select that option. The Web Photo Gallery window then opens up and we can choose a bunch of different parameters here. A lot of the specifics that we choose here are not going to be important. So for instance the Style that we choose to use, absolutely not important. We'll go ahead and just for the simplicity sake choose the Simple web photo gallery. We don't need to add an E-mail address but we do need to come down here to the Source images and select the Choose button and go ahead and navigate out to your Desktop, to the Exercise Files folder, to the Chapter 04 folder and select Images, then click the Open button. You want to make sure that the option for Include All Subfolders is selected if you have any subfolders that you have images in that you want those added into this gallery.

Next you need to click the button for Destination. Go ahead and then click on your desktop and we're going to create a New Folder here and we're going to call this simply Image Gallery and click Create. So we've got just a blank folder and this is where Photoshop is going to put out image gallery at. So I'll go ahead and click the Open button. Now there is two other places that we want to set some things. We want to go into the Options dropdown menu and start off first with Thumbnails. We can set the Size, the default Sizes are Small, Medium and Large. If we select large, you can see that the Thumbnails are going be about 100 pixels and that is the width of those images. Now 100 pixels for a thumbnail image is fine but if we want to use these inside of our Moodle site, we can customize this to make this a little bit better. So we'll go ahead and kick that up to about 150 pixels.

Next we'll go ahead and click the drop down menu here for Options again and go back to Large Images. Under Large Images, make sure that the Resize Images box is checked and we can change the pixel dimensions here. Let's go ahead and see what Large would give us in this case. It would give us a 450 pixel image. Let's go ahead and change that up to 500 pixels. The JPEG quality of Medium and 5 should be fine. We don't have to even worry about any of the other settings because all we really want Photoshop to do here is just batch compress all of these images.

Now again, yes there are ways you can go in and compress the images manually one by one yourself and get better results but this going to batch compress all of these images for us and give us two different versions at the same time. So then go up here and click on the OK button and sit back and watch as Photoshop just cranks through every image inside of that folder. It's going to open the original image. It's going to resize it down to that 500 pixel size, save out a JPEG, then resize it down again to the 150 pixel image size and then open up a finished web photo gallery for us in Firefox.

We now have a fully functional site; all of our images have been shrunken down to a fairly good size for us to be able to work with. If we wanted to click on any of these images, so here is this Aplysina fistularis image. We can go ahead and click on that and we can see the larger JPEG image that's been compressed for us and we have all the different images that we have here that we could work with. So we can close this tab down, minimize our browser and let's look and see what this actually did for us out in our Finder. So if go back out to our Desktop and we open up the folder Image Gallery that we just created, let's go ahead and get rid of this guy, get him out of our way. We have inside of the Image Gallery, there's a couple of folders, with lot of HTML files but what we're interested in are two folders in particular.

The first is the images folder itself. These are the large images that have been compressed for us by Photoshop. So if we go ahead and click on one of those, we can see the pixel dimensions, 500 by 339. This image is ready to go up on the web. It's being compressed down to a nice, small size and its dimensions have been reduced. The other folder of the images that we're interested in is the folder called thumbnails and thumbnails has these smaller images in here. You can see they have been shrunken down to 150 pixels by some other dimension and those are also ready go up on the web. So we're ready to go ahead and post both of these up there.

Now we have our large size images and our thumbnails. They've all been compressed for us and are ready to go up on the web. All we had to do was create a web photo gallery and inside of the resulting web photo gallery are these images, the source files that the application is using. Lots of different applications will do this. We've just showed you one example as to how to go ahead and work with that.

Show transcript

This video is part of

Image for Moodle 1.9 Essential Training for Teachers
Moodle 1.9 Essential Training for Teachers

108 video lessons · 9826 viewers

Chris Mattia
Author

 
Expand all | Collapse all
  1. 8m 21s
    1. Welcome
      2m 8s
    2. Course overview
      5m 22s
    3. Using the exercise files
      51s
  2. 34m 55s
    1. Getting started
      2m 59s
    2. Installing Moodle on a Mac
      8m 45s
    3. Installing Moodle on a Windows computer
      14m 24s
    4. Creating user accounts
      3m 55s
    5. Creating a new course
      3m 0s
    6. Just enough site administration to get you going
      1m 52s
  3. 41m 16s
    1. Logging in and getting oriented with Moodle
      5m 8s
    2. Customizing your profile
      4m 7s
    3. Customizing course settings
      3m 49s
    4. Editing the header block
      1m 33s
    5. Posting a course syllabus
      3m 55s
    6. Communicating news to students
      3m 5s
    7. Managing files and folders
      3m 41s
    8. Posting lecture slides
      3m 11s
    9. Setting up the gradebook
      5m 35s
    10. Sending email to the class
      2m 54s
    11. Creating a simple assignment
      4m 18s
  4. 51m 28s
    1. HTML editor overview
      10m 11s
    2. Formatting text
      8m 42s
    3. Creating tables
      9m 36s
    4. Creating internal links
      7m 27s
    5. Creating external links
      7m 2s
    6. Inserting local pictures with HTML
      3m 55s
    7. Inserting pictures from Flickr
      4m 35s
  5. 49m 22s
    1. Preparing images
      6m 53s
    2. Batch-uploading files
      5m 58s
    3. Posting image files
      2m 33s
    4. Posting a photo gallery
      3m 45s
    5. Preparing audio files
      10m 14s
    6. Posting audio
      3m 50s
    7. Preparing video files
      7m 45s
    8. Posting video
      3m 48s
    9. Inserting video from YouTube
      4m 36s
  6. 37m 11s
    1. Creating a text label
      6m 14s
    2. Linking to a web site
      6m 2s
    3. Creating a text page
      4m 45s
    4. Creating a web page
      10m 56s
    5. Linking to a folder of documents
      4m 18s
    6. Inserting an IMS content package
      4m 56s
  7. 27m 23s
    1. Assignments overview
      2m 13s
    2. Advanced uploading of files
      10m 32s
    3. Online text
      4m 26s
    4. Uploading a single file
      5m 1s
    5. Offline activity
      5m 11s
  8. 11m 39s
    1. Creating a live chat room
      5m 13s
    2. Creating a choice
      6m 26s
  9. 15m 45s
    1. Setting up a simple database
      4m 14s
    2. Creating database fields
      2m 49s
    3. Customizing a database template
      1m 33s
    4. Entering data into a database
      1m 43s
    5. Enabling database auto-linking
      3m 23s
    6. Enhancing a database with file uploads
      2m 3s
  10. 17m 16s
    1. Creating a main glossary
      4m 45s
    2. Adding concepts to the glossary
      3m 16s
    3. Enabling glossary auto-linking
      3m 38s
    4. Enabling students to edit a glossary
      2m 5s
    5. Creating a secondary glossary
      3m 32s
  11. 9m 58s
    1. Creating a forum
      5m 21s
    2. Using a discussion forum
      4m 37s
  12. 32m 17s
    1. Creating a wiki
      7m 3s
    2. Wiki editing basics
      4m 26s
    3. Creating lists
      6m 1s
    4. Subdividing a class wiki
      3m 43s
    5. Adding attachments and images
      2m 54s
    6. Creating external links
      2m 27s
    7. Creating a table
      5m 43s
  13. 1h 9m
    1. Online assessment overview
      1m 38s
    2. Creating question pool categories
      1m 58s
    3. Creating a first question
      6m 24s
    4. Creating true/false questions
      4m 39s
    5. Creating multiple choice questions
      7m 23s
    6. Creating short answer questions
      6m 59s
    7. Creating essay questions
      6m 22s
    8. Creating match questions
      6m 38s
    9. Creating numerical questions
      4m 56s
    10. Importing question pools from Blackboard
      6m 24s
    11. Creating a quiz
      9m 9s
    12. Adding questions to a quiz
      6m 50s
  14. 39m 16s
    1. Gradebook overview
      2m 6s
    2. Completing assignments as a student
      9m 34s
    3. Grading an assignment
      4m 52s
    4. Quick grading
      2m 25s
    5. Grading assignments with uploaded files
      2m 18s
    6. Grading offline assignments
      1m 16s
    7. Grading an online quiz
      3m 30s
    8. Quiz data analysis
      3m 4s
    9. Adding assignments
      2m 3s
    10. Exporting grades
      3m 55s
    11. Importing grades
      4m 13s
  15. 20m 4s
    1. Calendars and events overview
      3m 51s
    2. Creating a new event
      3m 21s
    3. Creating a repeating event
      3m 15s
    4. Exporting a calendar to iCal
      4m 5s
    5. Exporting a calendar to Outlook
      5m 32s
  16. 44m 40s
    1. Course administration overview
      3m 3s
    2. Managing course settings
      12m 48s
    3. Managing user roles
      2m 59s
    4. Managing groups
      4m 51s
    5. Backing up your course
      4m 34s
    6. Restoring data from a backup
      3m 14s
    7. Importing content to another course
      4m 53s
    8. Resetting a course
      3m 24s
    9. Running reports
      4m 54s
  17. 4m 14s
    1. Additional resources
      2m 58s
    2. Goodbye
      1m 16s

Start learning today

Get unlimited access to all courses for just $25/month.

Become a member
Sometimes @lynda teaches me how to use a program and sometimes Lynda.com changes my life forever. @JosefShutter
@lynda lynda.com is an absolute life saver when it comes to learning todays software. Definitely recommend it! #higherlearning @Michael_Caraway
@lynda The best thing online! Your database of courses is great! To the mark and very helpful. Thanks! @ru22more
Got to create something yesterday I never thought I could do. #thanks @lynda @Ngventurella
I really do love @lynda as a learning platform. Never stop learning and developing, it’s probably our greatest gift as a species! @soundslikedavid
@lynda just subscribed to lynda.com all I can say its brilliant join now trust me @ButchSamurai
@lynda is an awesome resource. The membership is priceless if you take advantage of it. @diabetic_techie
One of the best decision I made this year. Buy a 1yr subscription to @lynda @cybercaptive
guys lynda.com (@lynda) is the best. So far I’ve learned Java, principles of OO programming, and now learning about MS project @lucasmitchell
Signed back up to @lynda dot com. I’ve missed it!! Proper geeking out right now! #timetolearn #geek @JayGodbold
Share a link to this course

What are exercise files?

Exercise files are the same files the author uses in the course. Save time by downloading the author's files instead of setting up your own files, and learn by following along with the instructor.

Can I take this course without the exercise files?

Yes! If you decide you would like the exercise files later, you can upgrade to a premium account any time.

Become a member Download sample files See plans and pricing

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.


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.

Join now "Already a member? Log in

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 Moodle 1.9 Essential Training for Teachers.

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
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.

Are you sure you want to delete this note?

No

Your file was successfully uploaded.

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
Terms and conditions of use

We've updated our terms and conditions (now called terms of service).Go
Review and accept our updated terms of service.