Design Glossary Terms: Imagery

Decode the fundamentals of design, understand your designers, and elevate your brand with our Design Glossary Terms: Imagery.

December 18, 2024

Imagery in design isn’t just decorative—it’s a powerful storytelling tool. Yet, stepping into the realm of image formats, resolutions, and design jargon can feel like deciphering a foreign language. Considering how visuals play a critical role in communication, understanding these terms is essential for effective collaboration. In fact, effective communication in design is so vital that a recent report highlights that 88% of our workweek is spent communicating. This glossary (Design Glossary Terms: Imagery) aims to simplify the essentials, giving you the confidence to work with your team and partners, ensuring your visual choices enhance your brand’s message and make a lasting impact.

P.S. Don't forget to check out our other articles on design glossary terms:

Design Glossary Terms: Imagery

Aspect Ratio

The proportional relationship between an image's width and height, expressed as two numbers (e.g., 16:9 for widescreens). It affects how visuals are framed and displayed, ensuring proper scaling across devices and mediums.

Bit Depth (Colour Depth)

The number of bits per pixel, determining the range of colours an image can display. Common depths include 8-bit grayscale and 24-bit RGB. Higher bit depths offer greater colour precision, crucial for vivid, realistic images in digital and print design.

Bleed

Bleed extends artwork beyond the trim line to prevent unprinted edges after cutting. It ensures the design fully covers the area without gaps, making it essential for professional-quality print materials like posters, brochures, and business cards.

Colour Mode (RGB vs CMYK)

RGB, used for screens, blends red, green, and blue light, ideal for web and digital. CMYK, for print, uses cyan, magenta, yellow, and black (Key) inks. Choosing the right mode ensures colour accuracy in different formats.

Cropping

The process of trimming an image to focus attention on a particular area. It’s a critical technique in design to adjust the composition and emphasis, ensuring that the most relevant parts of the image are highlighted for viewers.

Crop Marks

Lines used to indicate where an image or document should be trimmed during printing, overlapping with the bleed area to ensure precise cutting and prevent unwanted white space around the image after trimming.

DPI (Dots Per Inch)

A measure of print resolution, indicating how many dots fit in an inch. Higher DPI produces finer detail and sharper images, essential for professional-quality prints, while lower DPI is better suited for everyday use or web graphics.

GIF (Graphics Interchange Format)

A raster format supporting 256 indexed colours and basic animations. Widely used online, it’s ideal for simple, low-resolution visuals like memes, icons, and banners, but less suited for detailed, high-quality images.

Greyscale

An image mode using only shades of grey, from black to white, to eliminate colour information. This mode simplifies images for printing or when colour is not necessary, maintaining focus on contrast and light.

Hero Image

A large, attention-grabbing image at the top of a webpage used to communicate a key message. It captures the visitor’s attention instantly, often setting the tone for the site’s content and branding.

JPEG (Joint Photographic Experts Group)

A popular raster format with lossy compression, balancing quality and file size. Supporting up to 24-bit colour, it’s ideal for digital photography and web use but may lose detail in repeated edits due to compression.

Layer Mask

A non-destructive editing tool that hides or reveals parts of a layer without deleting content. It allows precise adjustments, blending, and effects application, enabling advanced control over image composition.

Lossy Compression

Permanently removes data from files to reduce their size, which may lead to noticeable degradation upon repeated compression. This method offers higher compression ratios but sacrifices some quality.

Lossless Compression

Retains all original data during compression and decompression, ensuring no loss of quality. While it compresses files less significantly compared to lossy methods, it preserves the integrity of the data.

Monochrome

A colour scheme consisting of various shades of a single colour. In design, it creates a harmonious and unified look, often enhancing focus and simplicity in visuals. Monochrome images contain only one colour in different tints and shades, which can convey a sense of timelessness and elegance.

PNG (Portable Network Graphic)

A raster format offering lossless compression, supporting up to 16 million colours and transparency. Ideal for web graphics, logos, and overlays, PNG ensures quality without losing detail, making it a favourite for designers.

PPI (Pixels Per Inch)

A measure of pixel density on a screen, affecting image sharpness and clarity. Higher PPI provides finer detail, crucial for high-resolution displays, while lower PPI may suffice for basic web images or small displays.

Raster Image

A pixel-based file dependent on resolution, commonly used for photographs and web graphics. Formats like JPEG, PNG, and GIF are popular but become blurry when scaled up, unlike vectors, which retain clarity.

Resolution

The number of pixels in an image, usually measured as width x height or PPI. Higher resolution improves clarity and detail, making it essential for professional prints and large displays. Low resolution may result in blurry or pixelated visuals.

Safe Zone

The area within the margins where all crucial content like text and logos should stay to avoid being cut off during trimming. Adhering to safe zones ensures no critical information is lost in the final printed design.

Smart Object

A Photoshop feature preserving an image’s source data, enabling non-destructive editing. Smart Objects allow resizing, filters, and effects without losing quality, making them invaluable for flexible and reversible design workflows.

Transparency

In design, transparency refers to the ability of a part of an image or element to blend with the background, allowing what’s behind it to show through. It’s commonly used in graphics like PNG files to overlay images or text without a solid background, creating a layered, more dynamic visual effect.

Vector Image

Created using mathematical paths, vectors are infinitely scalable without losing quality. Ideal for logos, icons, and illustrations, they maintain sharpness at any size, unlike raster images, which depend on resolution.

Looking for more design terminology?

If you liked this article "Design Glossary Terms: Imagery", check out our other articles on design glossary terms:

More Articles

You might also like…