Hue & Tone Creative

View Original

Your guide to design jargon

Feeling more then a little confused when you're trying to communicate with your designer? We get that. As designers, we do our best to explain things to our clients -- but it's easy to make assumptions or run through things a little too quickly. 

We put together this handy to guide to help cut down on client + designer relationship miscommunication. There's seemingly no end to the amount of technical terms out there -- but these 39 terms will give you a solid footing to get the conversation rolling. So... get studying!  

 

Alignment: Can refer either to the position of elements within the margins, or the idea of placing items so that they line up in an organized way.

Ascender: Any part of a letter that extends beyond the rest of the word. Examples: “b” + “h”.

Descender: Any part of a letter that drops beyond the x height/baseline of a character set.

Asymmetrical: A design in which the graphic elements or text on each side of the central line have unequal visual weight. One visually large element could possibly be balanced out by a grouping of smaller elements on the other side. Asymmetrical balance is typically more interesting.

Bleed: In printing, the bleed is what goes beyond the margin of the edge of the sheet of paper before trimming. A full bleed design means there is no white border/margin, and the color/images will go all the way to the edge of the paper.

Branding: The collection of language, ideas, principles, and visual elements that represent a company or business to clients and consumers.

Body copy: The main text in an advertisement, brochure, or website. Body copy is longer than headlines and is meant to be easily readable.

Body font: The text formatting for the main content of a magazine, website, or other printed material. Body fonts will contrast with the headlines, and is typically easily readable.

CMYK: A color mode used for print purposes. CMYK stands for ‘Cyan, Magenta, Yellow, Key (black)’.

Display Type: Fonts with distinctive personality that often sacrifice some readability for the purpose of being unique and eye catching. Typically used for headlines.

DPI: A measurement of resolution for a printed image. Stands for dots per inch.

Element: Individual parts of a logo or design. An element can be a flourish, a border, or something like a headline or image.

Favicon: A small icon that’s associated with a specific web page or URL. A favicon is displayed in the browser's address bar or near the site name in a bookmark.

Hero image: A common term to describe an oversized banner image -- usually near the top of the web page.

Kerning: The process of adjusting the horizontal distance between letters.

Leading: The process of adjusting the vertical distance between lines of type.

Letterpress: A printing process that results in an impression/indented design being left in the paper.

Logo mark: A graphic symbol or emblem that represents a business, organization, or individual.

Logo type: Also known as a wordmark, a logotype is the name of the company designed in a visual way.

Lorem ipsum: Latin text that’s used to demonstrate the graphic elements in a document or visual.

Margins: Only shown in computer layout programs, margins are the space around the printable area of a document.

Mobile responsive: A web or email design that automatically adjusts it’s sizing, layout, and proportions when viewed on a mobile device.

Negative space: Simply an area on the page that doesn’t contain any design elements.

Opacity: An object's degree of opacity. The lower the opacity the more transparent an element is. 0% = completely invisible, 100% = opaque/fully visible.

Palette: A set of cohesive colors you use for a design, brand, or campaign.  

Pantone Colors: The Pantone Matching system (or PMS) is a set of over 700 standardized colors used in a variety of industries.

Pica: A unit of type size and line length equal to 12 points (about 1/6 inch or 4.2 mm).

Pixel: A minute area of illumination on a display screen, one of many from which an image is composed.

Printer-ready (or camera-ready): Files/artwork is ready to be printed.

Proof: Can refer to either a “concept proof” or “printed proof.” A concept proof is a rough drawn, incomplete, or early stage preview of a project that demonstrates the concept to a client. A printed proof is designed to demonstrate the exact final product -- and is great for catching any last minute mistakes!

Raster files: A raster image consists of a dot matrix structure. Most of the images you see on your computer are a raster image. They can easily be scaled down without a loss of quality, but not scaled up without looking pixelated. Common formats like JPEGs, PNGs, and GIFs are all raster images.

RGB: A color mode used primarily for web. Colors are mixed from red, green, and blue (RGB).

Sans Serif: Typefaces that don’t have serifs at the ends of the stroke (aka the little feet). In print sans serif fonts are typically used for headlines (not body text). Sans serif fonts are popular for display or web fonts.  

Serif: Short strokes that extend from the top or bottom of the long part of a letter.

Slab Serif: A thick, block like serif font. Can be either blocky or rounded.

Typeface: A set of letters, numbers, etc. all in the same style.

Vector file: Created using illustration software (like Adobe Illustrator). Creates clean, camera-ready art that can be scaled up infinitely and still maintain a clean look.

Visual Brand Identity: The collection of all the individual logos marks, graphics, photos, print collateral and web graphics that make up the visual appearance of your brand.

Wireframe: A rough outline used for planning a website’s structure and functionality. Outlines all functional elements of a website or web page.

 

Feeling more prepared for your next meeting? The next time you give your designer feedback, break out a few of these terms and watch the look on their face as they realize what a pro you are!

If you're looking for even more advice on how to work with a designer we've got these 8 tips to help you create a smoother working relationship