Optimize, describe, and cite images.

For Wordpress theme modifications as well as project media requirements.

This skill earns no extra credit points.

1. Find images.

Locate images that relate to your project, or take your own with a digital camera, digitize them with a scanner, or create them in your favorite graphics application.

• Images include charts, tables, graphs, drawings, and photos.
• Keep careful track of where you found them, who owns the copyright, and how you may use them.
  • Note: Google does not own the copyright of photos and art displayed on images.google.come
  • Copyright notices are either on the image, in the hover text, or in the footer area at the bottom of the web site page where you found it.
    • Use this format when citing images and other media: © year owner. For example: © 2012 Apple, Inc.
• Some images may be too big for web sites, so you must optimize them (next steps) to fit the dimensions of your theme and reduce the file size so they load fast.

2. Choose a software tutorial.

Use a tool that already exists on your computer, or choose an online application:

• Pixlr (edit images online)
• Sumo Paint (edit images online)
• Apple Preview

3. Meet these specifications:

Open an image in your chosen tool, then crop as needed, reduce the image dimensions, and save in the correct file format to reduce the resulting file size to no more than 30k.

Optimized images must meet these specifications so they download fast:

Small file size

Keep file size less than 30k if you can.

Exact dimensions

Crop and reduce the size of images to fit the dimensions of the space in your web page.

Correct file format

Online photos are usually .JPG. Flat-color images like logos and clipart are usually .GIF and sometimes 8-bit .PNG. Graphics with true transparency need 24-bit .PNG.

Reduced resolution

Monitors render between 72 and 640 pixels per inch (ppi). Stick with 72ppi so that files load quickly. They may be blurry on higher resolution displays.

Color Mode

RGB for .PNG and .JPG and Indexed for .GIF.

4. Save the files with descriptive names.

Rename optimized files so they are memorable and descriptive, like this:

• biography-marie-curie-portrait.jpg
• technology-radioactive-isotopes.jpg
• trends-french-science-gaps.jpg

5. Upload images to the Wordpress.

Once images have been optimized, use the Wordpress media uploader to add them to the Media Library.

1. Login to your Wordpress site and click the My Site button to get to the Dashboard.
2. Click on the Blog Posts or Pages button.
3. Click on the Post or Page link to edit it.
   • Place the cursor at the location where you want to add an image.
   • Click the icon on the toolbar to be transported to the Media Library.
     • Click the Add New button and locate the folder of photos you created in step 6.1.
     • Ctrl-click (Windows) or ⌘-click (Mac) to select multiple files at once.
     • Click Upload and wait for the files to load.

6. Edit each image.

Deselect multiple images in the Media Library Gallery.

Complete this procedure for each image.

1. Click on an individual item's ✎ pencil button to edit it.
   • In the Editing screen, add a descriptive sentence to the Caption field.
   • Also add the copyright statement, which includes three items: the copyright symbol 2) the year published, and 3) the photographer- or company-owner's name. It should look like this: © 2016 A&E Television Networks, LLC.. Make the symbol by copying this one ©.
   • Copy the Caption field's text (but not the copyright statement) and paste it into the Alt text field. This text makes your site more accessible to visually-impaired listeners.
   • The Description field can be left blank, or you can add the URL here for future reference.
   • Click the Insert button.
2. Reposition the image by clicking on the justified button.