Personal tools
You are here: Home Documentation Manuals Plone 3.0 User Manual Adding Content Preparing Images for the Web
Support

Get Help

Join our chat rooms or support forums if you have more specific questions.

Plone Training
Learn how to design, build, and deploy a website in Plone through one of the numerous Plone training sessions around the world.
Find Plone training…
 
Document Actions

2.11. Preparing Images for the Web

Up one level
Preparing images for the web is an essential part of using images in Plone, or in any online context. As you will see, size matters.

Many people source photographs taken with a digital camera, but they can also be scanned images, graphical illustrations made with software, and other specialized images.  Let's take a look at the case of a butterfly photo taken with a digital camera. 

Digital photographs taken with modern cameras are usually too big to post directly on a website, so they need to be resized.  A typical web site design may have a width of around 1000 pixels. When a photograph comes off your camera, it may be several thousand pixels wide and tall, and several megabytes in file size.  You need to use software on your computer to resize the image to something less than 1000 x 1000 pixels, often much smaller than that.

The software you use to view or print your digital photos will often have this resizing functionality, or you may have graphics software such as Corel Draw, Adobe Photoshop, Irfanview, or Gimp on your computer.  Resizing an image, sometimes called resampling, is a standard function you should be able to find in your software, often under the Image menu.

How do you know what width, in pixels, to resize your image?  It depends. For a little "head shot" photograph to go in a biography, maybe 200 pixels wide is just right.  For a group photograph, 200 pixels would be too small to allow identification of the people in the photograph, so it may need to be closer to 400 pixels wide. For a scanned map image, perhaps the image width would need to be 1000 pixels for the map detail to be usable.

After saving your resized image, give it a name that indicates the new size (e.g., butteryfly-resized-300px.jpg). The file format is most commonly .jpg (or .jpeg). Other common formats for images include .png and .gif.  Take note of where you save images on your computer so that you can find them when you upload them to your Plone web site.

 

image_resizing.png

 

 

 

To summarize:

  1. Take your photograph with your camera, or find an existing image you want to use
  2. Transfer it to your computer
  3. Use image software on your computer to resize your photograph
  4. Upload it to your Plone website

 

by Sam Knox last modified November 19, 2007 - 19:29
Contributors: JoAnna Springsteen, Martin Aspeli, Jon Baldivieso, Andrew Burkhalter, Sam Knox, Jon Stahl, Jeff Pittman, Esther Schindler, Rob Stevenson, Darci Hanning
All content is copyright Plone Foundation and the individual contributors.

For any issues with the web site functionality, please file a ticket.

Please consult the policy on plone.org content if you want your content published on this site.

Servers and hosting by