Brightness. The image has more or less light. Too much light blurs and reducing light can sharpen. Too much reduction causes loss of visibility.
Hue. The image appears to have more of one (or two) of the colors red, blue, green, or yellow. A "shade" is a hue with some black added. A "tint" is a hue with white added. A "tone" is a hue with both white and black added.
Saturation. The image has more or less of its hue. Adjusting saturation can shift the image from sky blue to deep blue, for example.
Chromacity, or Color. The combination of hue and saturation. Some applications use "Color" to refer to saturation.
Transparency. In Photoshop and some other packages which support layers, the transparency of a given layer or portions of the layer determines the amount of the layer underneath which shows through the transparent layer.
Gamma correction. Gamma measures the contrast of an image's midtones. The correct monitor gamma setting is approximately 2.35. When gamma of an image is set too high for your monitor, highlights are faded and midtone shadows are mottled. When gamma is right, you have sharp whites and blacks, and much variation/contrast of midtones.
Warning! What you see on your screen depends, of course, on your monitor. Even the same brands and models may vary in color display depending on such factors as age of the picture tube. For precise work you will want to calibrate your monitor according to the instructions of the software you use (ex., PhotoShop). Low-end packages often have no calibration instructions but this may not matter for routine work.
1. Line Art. Line art, also called 'bitmap art' or 'one-bit color', is black-and-white. Some scanners can be set to line art, which is appropriate when the scanned image is, indeed, just black and white with no other colors, not even greys.
Halftone is a variant of line art, used for output only. Also one-bit color, halftone images simulate greyscale by printing with patterned arrays of dots of varying diameters. Areas with large dots approach black and areas with tiny dots approach white, with intermediate size dots simulating greys. Halftone is used for printing to one-color printers. That is, images are converted to halftone prior to printing.
2. Greyscale. Greyscale images are a form of 8-bit color, supporting up to 256 degrees of brightness on a black-white dimension or "channel". Some scanners can be set to greyscale, which is appropriate for scanning so-called 'black and white' photographs.
3. Indexed Color. Computer applications often create color tables which translate specific index code numbers into specific colors on your screen. Indexed color, also called mapped color, is usually a table of 256 colors (8 bit color). The specific 256 colors you have is called a "palette". You may have a palette loaded toward blues, for instance, and another loaded toward reds. Technically, 1-bit color allowing two options (one color, no color) is also indexed color but most of the time, the phrase 'indexed color' refers to 8-bit color with 256 colors. The main practical import is that the web often uses images in .GIF format, and .GIF is indexed color. In Photoshop you will have to select Image, Mode, Indexed color when saving .GIF images. Also, when you have multiple .GIF images in a single application, as in animated .GIFS, the application has to use the same palette, and it is necessary to find the optimal one which will make all the images look best. One way to select a single palette for .GIF images is to convert to RGB (Image, Mode, RGB), then immediately convert back to indexed color (Image, Mode, Indexed Color). When you convert to indexed color, Photoshop will open a dialog box. Select "Web" as the color palette you want. By converting all .GIF images to the "Web" palette, you will have standardized on a look which usually works.
4. RGB Color. RGB stands for red-green-blue, which can be used to construct 16.7 million colors when using 24-bit color. The 24-bit color mode is normally what people think of when referring to RGB, though 8-bit indexed color (256 color palettes) has tables which translate 256 specific colors into specific RGB settings (ex, purple is red=128, green=0, blue=128). Full 24-bit RGB, however, has three color channels (red, green, blue), each with 256 levels of density, hence 256 times 256 times 256 = 16.7 million colors.
RGB color corresponds to the fact that the eye has red, green, and blue color receptors. It also corresponds to the way monitors produce color on your screen.
Indexed color is efficient for computer displays but it is a barrier to color editing. Because the slots in the table of 256 colors can contain any specific colors out of 16.7 million available, with no particular sequence, color editing software cannot interpolate between index codes. In contrast, three-channel 24-bit RGB color mode allows full interpolation. Interpolation is needed for color editing effects like stretching bitmap images, using soft-tip brushes, gradient fills, and special effects. Interpolation is used in 'anti-aliasing' -- shading adjacent pixels to form smooth transitions. Anti-aliased type set on graphics appears artistic, without the "jaggy" edges of non-anti-aliased type (in PhotoShop, anti-aliasing is a feature of the Type Tool).
The bottom line is, you want to be in 24-bit RGB mode when color editing a graphic, even if you will later convert and save it as an indexed color graphic and/or even if the image was originally acquired as an indexed color image. (Saving the image as 256-color indexed color is currently standard for screen display purposes). Software applications may not label this choice as one between "indexed color" and "RGB". Instead you may have a corresponding choice between "256 colors" and "16 million" colors. Some applications only support 256 colors and give you no choice.
VGA monitors support indexed 4-bit color (16 colors). SVGA monitors support indexed 8-bit color (256 colors). RGB monitors support 24-bit color, called TrueColor, of 16.7 million colors. (Warning: because SVGA monitors support 256 RGB colors, they can be labelled 'RGB monitors' also, but they aren't TrueColor.) Note that, unfortunately, a given RGB color may appear differently on different monitors, even of the same type. Most monitors are of the RGB type today, though you may encounter old models.
5. CMYK Color. Cyan-magenta-yellow-black is a four-channel color model which can construct a slightly larger color space than can RGB TrueColor. CMYK is used for print presentations. CMYK corresponds to a "subtractive color" process of inking used by printers. CMYK is a 32-bit model, hence requiring 32-bit scanners for input. When you are in CMYK mode you may encounter an "out of gamut" error message, meaning the color on the screen can't actually appear in print. Unless you are doing professional process printing, CMYK is not the appropriate choice: use 24-bit RGB instead. (There is also a three-channel CMY model which is slightly different and is used with screen presentations as an alternative to RGB.)
There are several other color models beyond the basic five, such as YUV and YIQ for color television presentations. The L*a*b (LAB) model is used by the Kodak PhotoCD system. Higher packages will let you switch among these modes. Usually but not always the automatic color translation algorithms create an acceptable translation.
PANTONE colors are colors used in oil painting. Some packages, including PhotoShop, let you select PANTONE and thereby get RGB colors which correspond to those available at an art store. This is useful if you are used to picking PANTONE colors by virtue of experience as an artist and wish to specify, for example, PANTONE 2728CV, as a color.
Reminder: Often your original image will be line art, greyscale, or indexed color. You will have to convert to RGB TrueColor (or CMYK) to use the software tools you want in Photoshop and other color image editors.
"Palette size" refers to the number of indexed colors. Older monitors and video cards could handle only 16. All newer monitors and cards can handle 256.
"Pixel depth" refers to the amount of color information associated with each pixel. Thus 8-bit pixel depth, referred to simply as 8-bit graphics, corresponds to 256 colors. It takes 24-bit graphics to have 16 million colors. Some graphics packages give you options about "number of colors" and some give you a choice of "pixel depth", but it is the same thing. Naturally, the greater the pixel depth, the larger the graphics files and the slower they are to load.
"The palette" refers to just which colors are assigned to the available index numbers. If you are in 256-color RGB mode, you still can select just which 256 colors you want.
The palette may differ from graphic to graphic when in 256-color RGB mode. This doesn't matter if you are displaying one graphic at a time, independently. But if graphics are embedded in a single presentation program, such as Authorware, or if you are stringing multiple GIFs together in a GIF89a animation, the program needs to apply the same palette to all the graphics. The result can be that some graphics appear with very wrong colors.
"Optimizing the palette" refers to converting all one's graphics to the one palette which is overall best for displaying all of them. The Adobe ImageReady software which comes with Photoshop 5.5and higher can do optimization. In the Macintosh world, a program called DeBabelizer does this, and DeBabelizer is now available for Windows. Also in Windows, Adobe Premiere can accept a set of graphics files and generate an optimal palette, which can be saved in Adobe Photoshop format and reloaded as the default palette for that program. A less expensive and less powerful program called LView Pro can also be used for Windows palette optimization. If you are printing or displaying your images in 24-bit RGB mode, with 16 million colors, optimizing the palette is not an issue.
When converting RGB to indexed color images like .GIF, if your computer display application does not need the same palette for all your graphics you can use a feature such as selecting the "Adaptive Palette" in PhotoShop, where the best palette for the RGB picture is selected automatically. Naturally, each picture will get a different palette. If you need them all to have the same palette, as for an Authorware show, you will have to optimize the palette with Adobe Premiere or another package.
Tip: In PhotoShop you can use the Marquee Tool to select an area within the RGB image. PhotoShop will then use just this area to compose an adaptive palette. It may be a good idea to select a foreground area in this way. This causes the resulting palette to give better coverage to the foreground objects.
If you lack a palette optimization package, you may want to forego the "Adaptive Palette" option when saving in 8-bit, 256-color, indexed color mode, and instead use the "Uniform Palette" option which gives each color range equal play. This won't be the optimal palette, but at least all images will have the same palette. Uniform palettes also work where the original image has a great many colors.
Raster graphics represent images as a matrix of points called pixels. Scanners create raster images, for instance. The term "bitmap" refers to the bits, or pixels, for an entire raster image. Raster or bitmap images can be loaded and viewed quicker than vector images, which have to be recreated by redrawing lines and filling colors. If raster images are enlarged, the computer must interpolate the missing pixels, causing loss of resolution. Adobe Photoshop is an example of a raster graphics package.
Vector graphics represent images as a model of lines and directions. Vector graphics can be resized without loss of image. Three-dimensional vector graphics can be rotated as well. Vector images take less memory space than raster graphics, discussed below, but take much longer to display. Adobe Illustrator is an example of a vector graphics package.
PSD. Adobe Photoshop has its .PSD format. The .PSD format supports unlimited color channels and is consistent with saving 24-bit RGB TrueColor images. If you do not save your original in .PSD format, you will lose any layer information you have!
TIF. Scanners often generate .TIF (Tagged Image Format) formats, though some give you a variety of choices (try to use a 24-bit scanner). TIF works in Mac, UNIX, and PC environments. TIF supports multiple color channels and is consistent with saving RGB TrueColor images. There are several "flavors" of .TIF, so a .TIF file might work in one application but not in another. If you are not saving your original in .PSD, .TIF might be a good second choice.
PCD. The .PCD (Kodak PhotoCD) format is a photographic standard for raster images. You can convert your photos to PCD simply by asking your full-service camera shop for a PhotoCD from your undeveloped film when you turn it in. You get back a CD-ROM. Note that not all CD-ROM drives are Photo-CD compatible. The PCD format is consistent with 24-bit TrueColor images. Note that this format uses the LAB color model, one of the less-popular variants. If your software supports it (as does PhotoShop), import PCD images under the LAB color mode, then convert to other models such as RGB. Also, PCD is currently optimized by Kodak for television display, not computer monitor display, with the consequence that the gamma level may need to be adjusted also for computer display purposes.
There are many other raster graphics formats.
Formats for vector images
There is no agreed-upon vector graphics format for the web. Candidates include Web Schematics, DrawML, PGML, and VML, but none are implemented by leading browsers. For the most part, vector graphics are encountered in drawing, mapping, and page layout software packages not directly associated with web development.
AI. AI is the format for Adobe Illustrator, Adobe's vector graphics drawing package.
EPS. For professional print-oriented work, the .EPS (Encapsulated Postscript) format is the standard for vector graphics. EPS files are very rich in the vector information they hold, so much so that the Windows Clipboard sometimes can't handle all the information. EPS files need to be converted to other formats for use in screen presentations.
WMF. In Windows, the most common monitor-oriented formats are .WMF (Windows Metafile) for vector graphics and .BMP (Windows bitmap) for raster images. WMF files can incorporate raster images which have been cut-and-pasted from other sources.
There are many other vector graphics formats.
There are a seemingly infinite number of other graphics file formats. Hijaak Pro is a package for translating back and forth among dozens of formats. Keep in mind some formats contain less information than others (ex., .GIF), so you may want to retain richer-format graphics files in their original format as well as the translated format. For instance, .EPS files can contain .TIF image thumbnails useful in previewing/inventorying images, while most other formats do not support this.
Note that the Photoshop .PSD format saves information on layers, color modes, color channels, and more, such that reloading one's information from any other format is very likely to lose information if you are using Photoshop. If you are using another package, 24-bit TIF is a good choice for preserving color information.
Dithering is particularly important when reducing an image from 24-bit to 8-bit pixel depth, as when you go from RGB mode to indexed color mode. Normally you want "pattern dithering", which attempts to set available pixels in a pattern to "fake" otherwise unavailable colors. You can also use "diffusion dithering", which causes pixels with the greatest error in indexed mode compared to original RGB mode to be spread out over a larger area so as to fuzz obvious color errors.
When you load images into your application you will notice some may load as tiny images and some may load larger than your screen. While these often can be resized to fit your screen (the HTML web language, for instance, can easily force an image to display any size), it is best if images are created in the desired screen size (or paper size, if printing) in the first place. Projecting small images large produces graininess and image detrioration. Shrinking large images to project small is less dangerous but can make words and other fine details illegible.
Image resolution is measured in pixels-per-inch (ppi). The ppi you want depends on your output device as well as the size of the image on that device. For most screen-oriented presentations, 72 ppi is the norm, corresponding to 640x480 screen displays. (We anticipate eventually making 96 ppi the default, corresponding to 1024x768 screen displays, but for now most author for the lowest common denominator, which is still 640x480).
For print-oriented presentations, you need to figure out the lines per inch (lpi, also called "screen frequency") of your printer, then specify a ppi which is at least one-and-a-half to twice the lpi but not higher than your printer can handle.
"Monitor resolution" (and printer resolution) is measured as dots per inch (dpi). A typical PC monitor is 96 dpi, which has no problem handling a 72 ppi image without changing its size much. A much larger monitor with the same dpi, however, would lose resolution.
Image size. The higher the ppi, the smaller the image will display on any given device. Of course, the actual size depends on your monitor (or printer). When image resolution is higher than monitor resolution, the image size will be affected. For instance, If you had a 192 ppi image, a 96 dpi monitor would have to display it at twice its intended size.
Your graphics package may allow you to set the ppi, then set the number of inches (or pixels) of width and height for your image. Naturally, the higher the ppi and the larger the image, the more pixels, so the larger the file size.
Scanned images can become very large. Note an 8" by 10" photo scanned at 75 dpi on a 24-bit scanner will create a 1.2 MB file, but at 300 dpi it will create a 20.6 MB file! You may wish to crop your image prior to scanning. Cropping tools are usually built into one's scanning software.
Scanned images may come in too dark or too bright. Higher-end software allows this to be adjusted. In PhotoShop, for instance, choose Image from the menu bar, then Adjust, then Levels.
SELECTION TOOL. In most packages, you must "select" an area before you can use other tools on it, and usually those tools will then affect only the selected area. For instance, in Snapgraphics the arrow tool selects/deselects objects. In all packages, when an object is selected a dotted-line box will appear around selected objects, with little rectangles at the corners and middles. These rectangular "handles", common in many Windows applications, allow the object to be resized. Clicking in the middle, holding the mouse down, and dragging, allows objects to be moved. While bitmap pictures can be objects, resized, and dragged, the arrow tool cannot select objects within the picture. In the more powerful Photoshop system, there is no arrow tool. Instead there are three selection tools. The "marquee" tool creates rectangular or elliptical selection of areas. The "lasso" tool (tracing tool) allows you to select an irregular freehand shape, such as a human head from a bitmap picture. The "magic wand" tool allows you to select an area based on the similarity of color of adjacent pixels -- thus it can be an alternative to tedious tracing.
COLOR SELECTION TOOL. Sometimes depicted as an eyedropper icon, this tool allows you to click on a point to select the color of that point. Other approaches let you click on a matrix of colors or swatches or spectrums.
TEXT TOOL. Sometimes called a "type" tool, this allows you to overlay labels and other text. Most packages allow you to select color font, size, color, bold-italic-underline, and other attributes. Some packages have a "Caption" option for attaching text which is not on the image. Likewise, some have a "Credits" option for attaching copyright information.
FILL TOOL. Often indicated by a paint-bucket icon, this will fill an area with a selected color up until a sufficient pixel color change indicates a border has been reached. Holes in the border can cause the fill to go into undesired areas. Some fill tools will only fill on white. Some packages have a "gradient fill tool" which fills with a spectrum of a color rather than a solid color. There may be tools to darken, lighten, and change the saturation of an area.
DRAW TOOLS. There may be several drawing tools. Usually there will be a pen or pencil icon for drawing lines, a paintbrush for drawing broader lines, and a spray can or airbrush icon for drawing broader, fuzzier lines or areas. The line tool may have options for freehand and straight line. There may also be tools for laying down specific shapes such as circles, ellipses, and boxes.
EFFECTS TOOLS. There may be special tools for all sorts of effects, or these may be menu bar choices. for instance, there may be tools for blur/sharpen, emboss, extrude, ripple, pixelate, distort, spherize, twirl, wave, zigzag, add/subtract noise, add wind, despeckle, clouds, flare, pointillize, texture, spotlight, and change light source direction.
COPY TOOL. There is usually rubber stamp or two-sheets icon for a tool for replicating a selected object so you can make two or more of them automatically.
ERASE TOOL. There is usually an eraser icon which launches a tool for erasing lines or areas to a selected color. Note: Edit and then Undo selections also normally exist on the menu bar, but they are usually limited to undoing only the last editing action. Remember you can save frequently while editing: then you can go back to the last-saved version.
ZOOM TOOL. There is usually a magnifying glass icon for selecting an area to zoom to larger size so you can work on it with more precision. This does not affect the image size, only the size as it appears on the editing screen.
The Photoshop support number from Adobe is 206-628-3956. The Photoshop third-party add-on number is 800-685-3547.