Glossary of Common Graphic Design terms

(Cyan, Magenta, Yellow, Black) A color format consisting of 4 colors which can be used to reproduce any color variation. Commonly used in offset printing. e.g.. magazines.

DPI stands for Dots Per Inch and refers to the number of individual dots of color that can be placed in a line within the span of one inch. In the printing world, DPI is used to describe the resolution of an image. The higher the DPI, the greater the level of detail and clarity in the printed image.

DPI is also used in the context of computer monitors, where it describes the number of pixels per inch on a screen. This measurement helps determine the sharpness and clarity of text and images displayed on the monitor. A higher DPI value generally results in a clearer and more detailed display.

In the world of digital images and graphics, DPI is an important factor to consider when preparing an image for print. Images with a low DPI value may appear blurry or pixelated when printed, while images with a high DPI value will result in a clear and detailed printed image.

In summary, DPI is a measurement used to describe the resolution and clarity of images in printing, displays, and mouse tracking.

(EPS, Encapsulated Post Script). A vector based line drawing generally created with Adobe Illustrator which can be scaled to any size and printed on any output device at any resolution without losing its detail or clarity. Great for use in all areas of print.

(Gif, Graphic Interchange Format) A Rastor based Image which is resolution dependent—that is, represents a fixed number of pixels. As a result, they can appear jagged and lose detail if they are scaled on-screen or if they are printed at a higher resolution than they were created for. The GIF format uses 8-bit color and efficiently compresses solid areas of color while preserving sharp detail, such as that in line art, logos, or illustrations with type. GIF is also used to create animated images. GIF is a commonly used file for the Internet because it yields files that are smaller in size while retaining crisp definition in solid color usage.

(JPEG, Joint Photographers Expansion Group) A Rastor based Image which is resolution dependent—that is, represents a fixed number of pixels. As a result, they can appear jagged and lose detail if they are scaled on-screen or if they are printed at a higher resolution than they were created for. JPEG compresses file size by selectively discarding data which allows for a smaller file size while retaining the integrity of the image. One of the most common used files for the Internet.

Short for ‘picture element,’ a dot that represents the smallest graphic unit of measurement on a screen. A pixel is screen-dependent; that is, the dimensions of screen elements vary with the display, system, and resolution.

(PNG, Portable Network Graphic) PNG files were developed to build upon the purpose of gifs but to provide a much better solution to transparency. Web development created a need for low-resolution images that loaded quickly but also could be represented transparently over the top of other images or backgrounds. This is where PNG comes in. PNG-8 does not support transparency, but PNG-24 and PNG-32 do. PNG transparency is different from Gif transparency, because they can have different levels of transparent pixels also referred to as true alpha transparency. Gifs are either transparent or opaque and cannot display an in-between transparency pixel but a PNG file can.

(Psd, Photoshop Document) A Rastor based Image which is resolution dependent—that is, represents a fixed number of pixels. As a result, they can appear jagged and lose detail if they are scaled on-screen or if they are printed at a higher resolution than they were created for. The benefit of a photoshop document is that the file contains a transparent background making it easy to place on different layouts. Generally used by more advanced users for custom applications.

Paint and image-editing software, such as Adobe Photoshop, generate bitmap images, also called raster images. The images use a grid (also known as a bitmap or raster) of small squares, known as pixels, to represent graphics. Each pixel in a bitmap image has a specific location and color value assigned to it. For example, a bicycle tire in a bitmap image is made up of a collection of pixels in that location, with each pixel part of a mosaic that gives the appearance of a tire. When working with bitmap images, you edit pixels rather than objects or shapes.

Bitmap images are the most common electronic medium for continuous-tone images, such as photographs or images created in painting programs, because they can represent subtle gradations of shades and color. Bitmap images are resolution dependent—that is, they represent a fixed number of pixels. As a result, they can appear jagged and lose detail if they are scaled on-screen or if they are printed at a higher resolution than they were created for.

The number of pixels displayed per unit of printed length in an image, measured in dots per inch (dpi) or pixels per inch (ppi). An image with a high resolution contains more, and therefore smaller, pixels than an image of the same printed dimensions with a low resolution. For example, a 1-inch-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-inch-by-1-inch image with a resolution of 300 ppi would contain a total of 90,000 pixels.

Because they use more pixels to represent each unit of area, higher-resolution images usually reproduce more detail and subtler color transitions than lower-resolution images when printed. However, increasing the resolution of an image at a lower resolution only spreads the original pixel information across a greater number of pixels and inherently reduces image quality

To determine the image resolution to use, consider the medium of final distribution for the image. If you’re image is for online display, the image resolution only needs to match the typical monitor resolution (72 dpi). However, 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 what the output device can produce) increases the file size and slows the printing of the image.

To make minor changes to an already existing design. This includes color changes, position changes, adding/subtracting content, etc. Does not mean to re-design.

(Red, Green, Blue) A color format consisting of 3 colors which can be used to reproduce any color variation. Commonly used in large format printing, Internet jpgs and computer screen graphics

SVG stands for scalable vector graphics, which is a file format that allows you to display vector images on your website. This means that you can scale an SVG image up and down as needed without losing any quality, making it a great choice for responsive web and app design.

(TIFF Tagged Image File Format) A Rastor based Image which is resolution dependent—that is, represents a fixed number of pixels. As a result, they can appear jagged and lose detail if they are scaled on-screen or if they are printed at a higher resolution than they were created for. Good for manipulating in rastor based programs such as Adobe Photoshop

Drawing programs such as Adobe Illustrator create vector graphics, made of lines and curves defined by mathematical objects called vectors. Vectors describe graphics according to their geometric characteristics. For example, a bicycle tire in a vector graphic is made up of a mathematical definition of a circle drawn with a certain radius, set at a specific location, and filled with a specific color. You can move, resize, or change the color of the tire without losing the quality of the graphic.

A vector graphic is resolution-independent—that is, it can be scaled to any size and printed on any output device at any resolution without losing its detail or clarity. As a result, vector graphics are the best choice for type (especially small type) and bold graphics that must retain crisp lines when scaled to various sizes—for example, logos.