Still images

From UBC Wiki
Jump to: navigation, search


Finding, creating and displaying images online is an important aspect of creating any kind of web presence. The ability to make the right choices and provide the best possible images for your specific educational aims is highly dependent on understanding and mastering number of concepts around digital images and their use online.


The art and science of taking, developing and publishing pictures stayed pretty much the same for over a century, only to be completely reinvented in last decade or so. A couple of parallel processes that took place are responsible for fundamental changes in how we think about creating or using photography and pictures in general. These processes are:

  • The rapid development of the Internet, particularly the personal publishing aspect that offers a framework for being able to find, share and discuss photography.
  • The democratization of photography and image editing. In the past, the ability to take (or post-process) great pictures was reserved for small group of experts with expensive tools, including cameras, computers and software. Today, digital cameras are becoming more powerful and simultaneously cheaper; there are now many free (or very inexpensive) desktop and online tools for photo editing and sharing.

Design Questions/Issues

There is a wide range of topics that need to be addressed when considering using digital images in online education:

Managing your image repository

    • In case of large collections, you may consider software packages to manage you collections. Typical workflow includes image check-in, meta-data management, and delivery (information about its usage).
    • For smaller collections both PCs and Macs are well equipped with file tagging and description capabilities built into their operating systems; for larger collections, iPhoto or Picasa are good choices.

Sourcing images online

    • If there is no specific license attached to an image online, the image is copyrighted by default.
    • To use an image in your web space, you have to have explicit permission from the author, or an image has to have a Creative Commons (or other license) attached that explicitly says you can use it—usually with attribution: identifying the person who owns the image.

Taking pictures yourself

    • Inventory the tools that you need: cameras, scanners, software etc.
    • Preparing images for online
    • Uniformity of image treatment, resolution and size – you would like to have images that carry the same “feel” across, as much as possible. Different styles could confuse the learners and give wrong perspective on topicsdepending on purpose images should be compressed as either JPGs or GIFs, although lately the PNG file format is gaining popularity because of its flexibility. You should also consider size – keeping the large original is a must while resizing to appropriate sizes thumbnail, medium and large) for internet.


  • Images could be uploaded to the web server where the rest of material is hosted (in an LMS, for example), put on dedicated media servers, or on one of a number of photo sharing sites (see Additional Resources below).


  • Each image should be described using “alt” attribute of <img> tag. This assures that people who cannot see original graphics and use screen readers will get sufficient information about an image


In this activity you will edit two copies of the same image, following Picasa’s online tutorials. Picasa is an open source, cross-platform digital image software suite. It allows users to easily edit, manage, and transfer image files.You will need two copies of the same image to work with. Do not use your original photo, since you may not be able to undo your work.

To make copies of your image

  1. Upload a digital image to your computer from your digital camera, one with one or more persons. If you already have a collection of digital photos on your computer, use any one of those.
  2. Place a copy of the file to your Desktop
  3. Rename this image practice_crop
  4. Place a third copy of your original photo on your Desktop
  5. Rename this image practice_resize

Watch the How to Crop an image Using Google Picasa video tutorial, using your practice_crop file. Crop the image in a way that emphasizes one part: a person, object, or portion of scenery.

Watch the How to export and resize a photo using Picasa video tutorial, using your practice_resize file. Resize the image so it is 500 pixels wide.

There are all sorts of tutorials for Picasa on the web, including these. Have fun exploring!


Write an entry for your course weblog about your experience here (on your "Home" page and posting a new entry). How labour intensive was the process? What worked well? What was challenging? What surprised you?


Managing images repository on your computer

Both Mac OS and Windows include decent management tools to name, describe and tag photos. These applications are bundled on most new machines:

Online image respositories offering free hosting

Finding images online

Additional Resources

JIISC Digital Medai is a UK government agency whose mandate is to provide support to post-secondary and higher education educational professionals around issues of digital media usage. There are a number of excellent tutorials, best practice guides, and case studies.

Choosing a digital camera

Taking photos