Note About Input Restrictions: TOP

Throughout your SearchErin.ca administration interface, you will notice that there are references to restrictions for the input fields. These restrictions are put in place to maintain the look and functionality of your website.

The restrictions for text input are very generous and should be of little or no issue to the website administrator.

The restrictions for images (team logo, sponsors and article photos) use "PIXELS*" as the restricted unit of measure. Logos and Links / Sponsors can be up to 358 pixels wide x 178 pixels high, additional Sponsors can be up to 178 pixels wide x 178 pixels high, News Article Photos can be can be up to 598 pixels wide x 798 pixels high.

* PIXEL (combination of Picture & Element) is the smallest element of a display which can be assigned a colour. If your display is set to the maximum resolution, it is the smallest building block on the monitor. If your display is set to a lower resolution, it can be made up of several blocks to form each pixel.

For more information about adding images to your website see; "Working with Images"

TIP: For supplying high resolution images for your players and parents to download and print, use the "Stats and Info" section of your website to upload image files up to 3 MB.
 

Working with Images: TOP

There are many image editing programs commercially available. (i.e. ADOBE Photoshop, JASC Paint Shop Pro, MICROSOFT Image Composer and many others) Most digital cameras also come with a photo-editing program.

There is a wide price range in these programs from "Freeware" to high performance graphics programs. You can find many of these programs at "TUCOWS" or "CNET"

Please refer to your image-editing program for details on resizing images. In the "Help" index "resize", "resize image" or "image resize" for details about your particular image-editing program.

Information About Adobe Photoshop: Image Size and Resolution

In order to produce high-quality images, it is important to understand how the pixel data of images is measured and displayed.

Pixel dimensions The number of pixels along the height and width of a bitmap image. The display size of an image on-screen is determined by the pixel dimensions of the image plus the size and setting of the monitor.

For example, a 15-inch monitor typically displays 800 pixels horizontally and 600 vertically. An image with dimensions of 800 pixels by 600 pixels would fill this small screen. On a larger monitor with an 800-by-600-pixel setting, the same image (with 800-by-600-pixel dimensions) would still fill the screen, but each pixel would appear larger. Changing the setting of this larger monitor to 1024-by-768 pixels would display the image at a smaller size, occupying only part of the screen.

When preparing an image for online display (for example, a Web page that will be viewed on a variety of monitors), pixel dimensions become especially important. Because your image may be viewed on a 15-inch monitor, you may want to limit the size of your image to 800-by-600 pixels to allow room for the Web browser window controls.

How large an image appears on-screen depends on a combination of factors--the pixel dimensions of the image, the monitor size, and the monitor resolution setting. The examples above show a 620-by-400-pixel image displayed on monitors of various sizes and resolutions.

Image resolution The number of pixels displayed per unit of printed length in an image, usually measured in pixels per inch (ppi). In Photoshop, you can change the resolution of an image; in ImageReady, the resolution of an image is always 72 ppi. This is because the ImageReady application is tailored to creating images for online media, not print media.

In Photoshop, image resolution and pixel dimensions are interdependent. The amount of detail in an image depends on its pixel dimensions, while the image resolution controls how much space the pixels are printed over. For example, you can modify an image's resolution without changing the actual pixel data in the image--all you change is the printed size of the image. However, if you want to maintain the same output dimensions, changing the image's resolution requires a change in the total number of pixels.

When printed, an image with a high resolution contains more, and therefore smaller, pixels than an image with a low resolution. For example, a 1-by-1-inch image with a resolution of 72 ppi contains a total of 5184 pixels (72 pixels wide x 72 pixels high = 5184). The same 1-by-1-inch image with a resolution of 300 ppi contains a total of 90,000 pixels. Higher-resolution images usually reproduce more detail and subtler color transitions than lower-resolution images. However, increasing the resolution of a low-resolution image only spreads the original pixel information across a greater number of pixels; it rarely improves image quality.

Using too low a resolution for a printed image results in pixelation--output with large, coarse-looking pixels. Using too high a resolution (pixels smaller than the output device can produce) increases the file size and slows the printing of the image; furthermore, the device will be unable to reproduce the extra detail provided by the higher resolution image.

Monitor resolution The number of pixels or dots displayed per unit of length on the monitor, usually measured in dots per inch (dpi). Monitor resolution depends on the size of the monitor plus its pixel setting. Most new monitors have a resolution of about 96 dpi, while older Mac OS monitors have a resolution of 72 dpi.

Understanding monitor resolution helps explain why the display size of an image on-screen often differs from its printed size. Image pixels are translated directly into monitor pixels. This means that when the image resolution is higher than the monitor resolution, the image appears larger on-screen than its specified print dimensions. For example, when you display a 1-by-1 inch, 144-ppi image on a 72-dpi monitor, it appears in a 2-by-2 inch area on-screen. Because the monitor can display only 72 pixels per inch, it needs 2 inches to display the 144 pixels that make up one edge of the image.

Printer resolution The number of ink dots per inch (dpi) produced by all laser printers, including imagesetters. Most desktop laser printers have a resolution of 600 dpi and imagesetters have a resolution of 1200 dpi or higher. To determine the appropriate resolution for your image when printing to any laser printer, but especially to imagesetters, see "screen frequency."

Ink jet printers produce a spray of ink, not actual dots; however, most ink jet printers have an approximate resolution of 300 to 600 dpi and produce good results when printing images up to 150 ppi.

Screen frequency The number of printer dots or halftone cells per inch used to print grayscale images or color separations. Also known as screen ruling or line screen, screen frequency is measured in lines per inch (lpi)--or lines of cells per inch in a halftone screen.

The relationship between image resolution and screen frequency determines the quality of detail in the printed image. To produce a halftone image of the highest quality, you generally use an image resolution that is from 1.5 to at most 2 times the screen frequency. But with some images and output devices, a lower resolution can produce good results. To determine your printer's screen frequency, check your printer documentation or consult your service provider.

Note: Some imagesetters and 600-dpi laser printers use screening technologies other than halftoning. If you are printing an image on a nonhalftone printer, consult your service provider or your printer documentation for the recommended image resolutions.

File size The digital size of an image, measured in kilobytes (K), megabytes (MB), or gigabytes (GB). File size is proportional to the pixel dimensions of the image. Images with more pixels may produce more detail at a given printed size, but they require more disk space to store and may be slower to edit and print. For instance, a 1-by-1-inch, 200-ppi image contains four times as many pixels as a 1-by-1-inch, 100-ppi image and so has four times the file size. Image resolution thus becomes a compromise between image quality (capturing all the data you need) and file size.

Another factor that affects file size is file format--due to varying compression methods used by GIF, JPEG, and PNG file formats, file sizes can vary considerably for the same pixel dimensions. Similarly, color bit-depth and the number of layers and channels in an image affect file size.

Photoshop supports a maximum file size of 2 GB and maximum pixel dimensions of 30,000 by 30,000 pixels per image. This restriction places limits on the print size and resolution available to an image.

To Change the Pixel Dimensions of an Image: Adobe Photoshop

When preparing images for online distribution, it's useful to specify image size in terms of the pixel dimensions. Keep in mind that changing pixel dimensions affects not only the size of an image on-screen but also its image quality and its printed characteristics--either its printed dimensions or its image resolution.

1. Choose Image > Image Size.
2. Make sure that Resample Image is selected, and choose an interpolation method.
3. To maintain the current proportions of pixel width to pixel height, select Constrain Proportions. This option automatically updates the width as you change the height, and vice versa.
4. Under Pixel Dimensions, enter values for Width and Height. To enter values as percentages of the current dimensions, choose Percent as the unit of measurement.

The new file size for the image appears at the top of the Image Size dialog box, with the old file size in parentheses.

5. Click OK to change the pixel dimensions and resample the image.

For best results in producing a smaller image, downsample and apply the Unsharp Mask filter. To produce a larger image, rescan the image at a higher resolution.

To Change the Pixel Dimensions of an Image:  Adobe ImageReady

1. Choose Image > Image Size.
2. To maintain the current proportions of pixel width to pixel height, select Constrain Proportions.
3. Under New Size, enter values for Width, Height, or Percent. The New Size text field displays the new file size for the image.
4. Select a resampling method from the Quality pop-up menu.
5.
 
Click OK to change the pixel dimensions and resample the image.