Core Concepts of Raster Graphics

Understanding Raster Graphics Introduction A raster graphic (also called a bitmap) is a digital image stored as a rectangular grid of tiny colored squares called pixels. Think of it like a mosaic made of colored tiles—zoom in close enough and you'll see individual squares of solid color, each contributing to the overall image. This is fundamentally different from how vector graphics work, and this difference has important implications for how rasters can be used and manipulated. What Is a Raster Graphic? A raster image is simply a large array of pixels, where each pixel stores color information. The image you're looking at on your screen right now is a raster image—composed of millions of colored dots arranged in rows and columns. The key insight here is that rasters store actual color values for each pixel location. If you have a red pixel, the image literally records "this pixel is red" for that position. This is different from vector graphics, which store mathematical descriptions like "draw a circle from point A to point B." Rasters vs. Vector Graphics Understanding the fundamental difference between raster and vector graphics is crucial because it explains almost all the strengths and weaknesses of rasters. Vector graphics describe images using mathematical formulas that define shapes, lines, and curves. A circle in a vector graphic is stored as "circle with center at (100, 100) and radius 50" rather than as individual pixels. Raster graphics, by contrast, store the exact color of each pixel in the grid. There's no formula—just raw color data for thousands or millions of pixels. Why does this matter? This difference is why rasters can beautifully capture photographs and complex artwork with subtle color variations, while vectors are better for logos and diagrams that need crisp, scalable edges. Dimensions, Resolution, and Color Depth Raster images are defined by three key properties: Width and height (in pixels): A typical photo might be 1920 × 1080 pixels, meaning 1920 pixels wide and 1080 pixels tall, for a total of about 2 million pixels. Color depth: This measures how many bits of data are used to store the color of each pixel. Higher color depth means more possible colors. A 1-bit image can only show black or white. An 8-bit image can show 256 different colors. A 24-bit image (the modern standard) can show over 16 million colors. Resolution (pixel size): All pixels in a raster image are the same size. The resolution refers to both how many pixels there are and their physical size when printed. Higher resolution means smaller, more numerous pixels, which generally means sharper images. The Raster Data Model The raster data model is remarkably simple: it divides a two-dimensional plane into a regular rectangular grid of cells. Each cell is one pixel. This uniformity is both a strength and a limitation. The strength is simplicity—it's trivial to find any pixel (just use its row and column coordinates). The limitation is that uniform grids can be inefficient for images with large areas of solid color, and they can create jagged edges on curved shapes. Pixel Formats Pixels can be stored in different formats depending on what kind of image you're creating: Binary: 1 bit per pixel (black or white only) Grayscale: Multiple bits per pixel to represent shades of gray Palettized: Uses a color lookup table; each pixel stores an index into the palette Full-color (RGB): Each pixel stores separate values for red, green, and blue channels The 24-Bit Standard The modern standard for full-color raster images is 24 bits per pixel: 8 bits each for red, green, and blue (RGB). Each 8-bit channel can store values from 0 to 255. This means: Red channel: 0–255 (where 0 is no red, 255 is full red) Green channel: 0–255 Blue channel: 0–255 The combination of three 8-bit channels gives you $2^{24}$ or 16,777,216 possible colors, which is more than the human eye can distinguish. This is why 24-bit RGB became the standard for digital photography and most image applications. Important concept: Be careful not to confuse color depth (how many bits per pixel) with color space (the range of colors that can be represented). Both matter, but they're different. A 24-bit image in RGB color space can represent millions of colors within the RGB range. Resolution Dependence: A Critical Limitation Here's one of the most important characteristics of raster graphics: they are resolution dependent. This means the quality of a raster image is locked to its resolution. If you take a 100 × 100 pixel image and enlarge it to twice that size, the computer must guess what colors should fill the new pixels. The result is blurry or pixelated—you've literally seen this happen when a small image gets stretched on a screen. More precisely, when you scale up a raster image, you're either: Stretching pixels (each pixel becomes a larger square) → pixelation Interpolating (guessing new pixel colors) → blurriness Compare this to vector graphics, which are defined by mathematical formulas. A circle defined as "radius 50" looks crisp whether you display it at 100 pixels or 1000 pixels—the formula automatically generates the right edges at any size. This is why raster graphics work great for photographs (you can't usually improve a photo by enlarging it anyway) but poorly for logos and text (which need to look sharp at any size). Common File Formats <extrainfo> Several standard raster file formats are commonly used: GIF (Graphics Interchange Format): Supports 256 colors and animation; uses lossless compression JPEG (Joint Photographic Experts Group): Widely used for photographs; employs lossy compression for smaller file sizes PNG (Portable Network Graphics): Supports full color with transparency; uses lossless compression; designed as a replacement for GIF BMP (Bitmap): Simple uncompressed format; rarely used today due to large file sizes Understanding which format to use depends on your needs, but these details are less critical than understanding the compression techniques behind them. </extrainfo> Compression: Essential for Practical Use Why do we need compression at all? A high-resolution raster image contains thousands or millions of pixels, and storing the color value for each one creates huge file sizes. A single uncompressed photograph might be 50+ megabytes. Compression reduces this dramatically. There are two fundamentally different approaches: Lossless Compression Lossless compression allows the original pixel values to be perfectly reconstructed—no information is lost. Two common methods: Run-length encoding (RLE): If you have 50 consecutive red pixels, instead of storing 50 separate red values, store "50 × red." This works great for images with large areas of solid color but poorly for complex photographs with endless color variation. Lempel–Ziv–Welch (LZW) compression: Replaces repeated sequences of pixels with shorter codes. As the file is read, the algorithm builds a dictionary of common patterns and uses codes to reference them. Lossless compression is essential when you cannot afford to lose any information—medical images, legal documents, and archival photographs typically use lossless compression. Lossy Compression Lossy compression achieves much greater compression by discarding some information. The original pixel values cannot be perfectly recovered, but the human eye may not notice the difference. JPEG compression is the most famous example. JPEG works by: Converting the image to a color space that separates brightness from color information Removing detail from the color channels (humans notice brightness changes more than color changes) Quantizing colors—replacing slight color variations with the same value The result? A 5MB uncompressed photograph might compress to 500KB as a JPEG. The trade-off is that quality is permanently lost—if you zoom in very close, you'll see "artifacts" (blocky distortions) where compression removed detail. Key distinction: Use lossy compression for photographs and images where small quality loss is acceptable. Use lossless compression when you need to preserve every pixel exactly—or when the image has large areas of uniform color where lossless compression actually works efficiently. Summary: Raster graphics are the standard for photographs and complex artwork because they can represent subtle color variations beautifully. However, they're limited by resolution dependence (you can't enlarge them without quality loss) and storage requirements (compression is essential for practical use). Understanding when rasters are appropriate versus when to use vector graphics is crucial for working with digital images effectively.