In general, you can use JPG, PNG, TIF and GIF files on our web site. However, for the Front page (http://www.catholicgizo.org) you can only use JPG files. The reason is that JPG files can be compressed more than the other types and because we have a lot of photos/imagery on the frontpage, it is necessary to minimise the amount of content downloaded. Most users will be working on articles for different parts of the web site and can choose from any of the formats.

The general recommendation is to use JPG files unless you want a transparent background. In the latter case, use PNG files.

You can cut/copy and paste (Ctrl X,C,V or Cmd on Mac) within an article and most probably also between articles if you have two articles open in two different tabs on your web browser.

You CANNOT just copy/cut/paste between your PC and an article! The article is “sitting” on a server elsewhere. Do not be tempted to do a copy/paste (for instance) between an email and an article. It might SEEM to work but when you see the final article published on the web, it will not have worked. You MUST upload photos/graphics to the web server before you insert them into an article. This is very easy with the drag/drop image manager in the article editor.

Many photos

If you have many photos (for instance, more than 10), there are simple ways to upload large numbers of photos to the website. I will not cover that here, but facilities can be put in place to make it easy if you need to do it from time to time. For “one offs” I am happy to assist you.

Resizing photos

As pointed out in the training, the webserver must resize every photo that is not the correct size before it is displayed on the user's computer screen. This is really important for the front page and also for frequently accessed parts of the website. People are very intolerant of slow websites.

In general, the drag/drop and resize facility of the photo editor in the JCE editor does a good job and works well. It is a significant improvement on the situation some years ago. Resize your photos to a maximum of 640x480 if they are going to be the full width of your article. Smallish photos would only need to be 220pixels (=dots) across. The smaller the dimensions, the quicker the web page will load.

In some cases, photos are just too big to upload (i.e. several megabytes=”MB”). In this case you need to resize and compress them before uploading to the website. There are three options:

Use an online service: This is quick and simple for single photos and there are a lot of free services. One good URL to go to is:

http://www.imageoptimizer.net

and follow the simple directions on the web page. Remember to set the size to something close to that desired, ideally no more than 640x480. Each time you resize and compress a photo you will lose something (detail, colour, focus...) so doing it once is better than doing it twice.

On a Mac, you can use Adobe Photoshop or even the Preview program. If using the Preview program, you need to perform two steps. The first is to resize using the Tools menu item (Go to Tools → Adjust Size), then you need to save it (File → Save as) and select the quality level. The final size is displayed in MB or KB (mega=millions or kilo=thousands) of bytes=characters. Ideally, photos should end up about 50KBytes (=50KB) or less but certainly no more than 100KB.

Microsoft Windows has the “Paint” program and here are the instructions for Windows 7.

Click the Start menu icon at the bottom left corner, then select "All Programs." Click to open the "Accessories" folder, then choose "Paint" to open the program.

Open the JPG image you want to shrink by clicking the "Paint" button at the top left, then click "Open" and select the image.

Select the "Home" tab at the top, select “Resize and skew” which has an icon showing a small rectangle overlapping with a larger one then click to open the "Resize and Skew" window. Under the "Resize" section, select the "Maintain aspect ratio" check box, then select "Pixels."

Enter the width you desire the image to be in the "Horizontal" box. For example, if you have an image that is 500 pixels in width, and you wish to shrink it by half, change that number to 250. This will automatically resize the length of the image as well. Click "OK" to confirm the changes.

Bulk processing: I have tried many bulk photo processing applications over several years. Far and away the best is something called Phatch which is a free application which runs on Windows, Mac, Linux and indeed many other computer platforms. It does an excellent job of scaling/shrinking/resizing photos in bulk. It can do much, much more. The downside is setting it up exactly as required because there are so many options. So, what I have done is set up three standard templates. All you need to do is select which of the three templates to use, select the folder where your photos are stored and run the process. Your processed photos will be stored in a subfolder so that the originals are undisturbed.

Phatch is particularly good if you have many photos and want to process them to a uniform standard. For instance, when uploading to one of our photo galleries or to create a slideshow.

The instructions for installing PHatch are contained in a separate document.

Best Regards,

Dave Kerr