Object-oriented graphics Made-up of vectors Resolution independent – can be scaled to any size without losing any detail Used primarily for hard-edged graphics such as drawings, logos, charts, illustrations, and type Adobe Illustrator, Macromedia Freehand, Corel Draw
Made-up of pixels – each pixel (picture element) is assigned a specific location and color value Resolution Dependant – contain a FIXED number of pixels (size of image is based on the image resolution) Can represent subtle gradations of color - used primarily for continuous-tone images such as photographs Adobe Photoshop, Paintshop Pro, Painter
Issues to consider Type of Image Intended Usage Open standard or proprietary format TIFF & EPS GIF, JPEG, PNG
TIFF(Tagged ImageFile Format) – raster only This format is a good way to save scanned images. (Long-term archival storage) It is a platform-independent file format. TIFF is strictly used for bitmap data. The TIFF format allows for changes in contrast, density, and color to be made easily. TIFFs support virtually all color spaces and support a large number of compression algorithms. (can remain uncompressed) A TIFF file can be any resolution you choose. The main drawback to saving a file in TIFF format is that, because of the large amount of information saved, the file size may be quite large.
EPS (Encapsulted PostScript Files) EPS is a vector file format. (can hold raster data) The EPS “package” contains the PostScript information (the page description language that defines desktop publishing) that the file needs for printing, and QuickDraw/Preview information (rasterized (TIFF or PICT) preview) that the computer uses for display of images on screen. Originally the native format of Illustrator Since EPS files are written in PostScript, they should work with every PostScript device and most layout, illustration, and paint programs. EPS files are mostly exported from a graphics program (Illustrator/Photoshop) and placed in a layout program.
PSD AI Adobe’s proprietary file formats for Photoshop & Illustrator PDF (Portable Document Format) Not really a graphic file format Designed to contain entire pages (graphics, type, vector shapes, layout) Electronic equivalent of your printed documents Incorporates fine detail and quality of print publications with the interactivity of electronic publications
Common Web File Formats GIF Graphics Interchange Format JPEG Joint Photographic Experts Group PNG Portable Network Graphic SVG Scalable Vector Graphic
We prepare images based on our intended use Output device Images for PRINT Should have a higher resolution Usually in CMYK color mode Images for DIGITAL DISPLAY Usually have a lower resolution Use RGB color mode
The quantity and distribution of pixels in an image PIXEL An abbreviation for picture element. The smallest element of a bitmap image Monitors and printers use a fine grid of pixels to display images Each pixel can be turned on or off and assigned a color.
Pixel dimension (ppi??) (web) # of pixel elements of image 800pX 600p Dots per Inch (dpi) - Resolution “dots” of ink per inch when a digital image is printed Resolution often referred to in dpi (distribution of pixels in an image) 300 dpi image 5X7 image at 300dpi resolution = pixel dimensions of 1500X2100
When we create or scan a digital image we are capturing pixel information Scanners record the color value and brightness of each area of an image when scanned. (resolution/bit depth) WE decide how much pixel information to capture by setting the resolution as we scan. The resolution or image dimension determines what we can do with the image (print/video) (resolution determines how large we can print or display our image and still have it be sharp)
The number of bits used to represent the colors of each pixel in an image. The greater the bit depth means more bits of information per pixel. Black & white: 1-bit one bit to describe each pixel – black & white (on/off) (lineart) Grayscale: 8-bit 256 possible colors (Ex: 256 shades of gray in a grayscale image) Full Color: 24-bit millions of colors (full color, truecolor) Three 8-bit channels: 256X256X256 = 16 million color combinations Represents a significant portion of the range of colors visible to the human eye 32-bit = CMYK images or RGB images with a 4 th Alpha channel 48-bit = generally highest bit-depth available Three 16-bit channels Most software and hardware not able to display this much data
Images for digital display typically have a lower resolution (72 ppi) – pixel dimension Image pixels map one-to-one with the display resolution of a monitor Monitor resolution varies by platform and user configuration Monitor resolutions http://www.w3schools.com/browsers/browsers_dis play.asp http://www.w3schools.com/browsers/browsers_dis play.asp X
High resolution graphics – not needed online. They just appear larger on screen and take up more file size and bandwidth.
Intended use of the graphic will determine Type of file Tool used to create it File format needed
BITMAP IMAGES CONTAIN A FIXED # OF PIXELS! Good Ducky! Bad Ducky!
Create Archival Master Scanned at highest level possible - appropriate for your environment Save in uncompressed file format Create all derivative files from the archival master Back-up Archival Master
The Claremont Colleges Digital Library Scanning Best Practices http://ccdl.libraries.claremont.edu/inside/CCDLScanningBestPractices.pdf
To produce good quality images we must… understand image dimension & resolution Create or edit the image size to be suitable for our intended use Start with a good source file (digital image/scan) If you plan to edit or scale the image in any way, start with a higher resolution image and optimize and compress image for web after all edits are complete.