Diving into DIY design can be intimidating when you have no graphic background. Luckily, website and image design platforms like WordPress, Wix, Squarespace, Canva, LucidPress, etc. make it easy to create eye-catching, branded visuals.
But even with these tools, it’s easy to get overwhelmed and over-do it. The most important rule to remember, which governs all of the terms below, is “EYES LIKE BALANCE.” Keep that in mind as you read and design.
Here is all the vocabulary you need to make a strong start and teach yourself.
Palette – The set selection of colors you use to represent your brand. (Stick to them, and use the next two terms to determine them.)
Analogous and Complementary Colors – Think of two colors on a color wheel. Analogous colors are similar to each other and are placed next to each other on the color wheel (like blue and indigo). Complementary colors are opposites and are across from or on the same “ring” with each other on the color wheel (like red and green). Both look good together, and which combination you choose depends on the tone you want for your brand. When colors “clash”, it is because they are not well suited for each other and are most likely placed at odds on the color wheel.
Triadic – Like complementary colors, triadic colors look good together, but in groups of three. They are also evenly spaced and on the same “ring” on the color wheel. For example, the three primary colors (blue, red, yellow) are triadic.
Opacity/transparency – How see-through the color is. A touch of transparency, seeing a bit of what is below a color, adds depth to a design.
White Space (a.k.a. Negative Space) – Space that doesn’t have anything in it. You need some unoccupied space evenly spread out throughout the design, or else it’s too chaotic and hard for the viewer to look at.
Resolution (pixels) – Some people call this “sharpness”. The resolution of an image determines how well it holds up to stretching to a larger size. Every image is made of a set number of dots (or pixels). More dots makes for a sharper, more stretchable image. If you make an image larger and it gets blurry, it has a low resolution (not enough pixels to handle the size). When it comes to sharp images, the higher the better, but super-high resolution makes the file enormous and difficult to send or upload, so it’s important to find the right size for what you need.
Contrast – The degree of difference between light things and dark things. Different levels of contrast produce a different mood or feel, depending on what you’re going for.
Saturation – The intensity of the color. High saturation means the reds are mega red and the blues are super blue, making the colors intense and rich. Lower saturation gives the image a more muted, faded look. You can also set a saturation based on a certain colors if, for example, you want a generally colored image to be heavier on the reds.
Filter – Filters are preset combinations of contrast, saturation and other color settings. If you want all of your images to have a consistent look, sticking to a specific filter is a good way to do that.
Rule of Thirds – This applies to the overall arrangement of images and words in a design. If you draw two evenly-spaced lines horizontally and vertically on a page, a viewer’s eye will mainly focus on the places where the lines intersect. If too much is crammed into one area, it looks uneven and unpleasant, but if the interesting things are balanced across those four points, the design will be generally easier on the eye.
Pull quotes – On websites and in blog posts, pull quotes make quotations and key phrases stand out. They are larger and set out from the text around them. These provide some variety for the reader and make text look more readable because, [ pull quote ] “Variety is the very spice of life, That gives it all its flavor.” – William Cowper, poet
Legibility – How easy a font is to read. A font may look cool, but if a reader can’t make out all the words right away, he or she will probably pass it over.
Header & Paragraph – The header is the title of a new section and the paragraph is the section itself. If helps to have the fonts of these be very different from each other (see variety). This also applies to designs of images and advertising. A balance of a bold font and an ordinary font is more engaging to the eye than two similar fonts.
Orphans & Widows – This is actually a typesetting term from the magazine and newspaper print-o-sphere that still applies today. Orphans and widows are short lines of one or two words left to fend for themselves at the end of a column or paragraph. In the layout world, they’re a definite no-no. To the eye, they make the page look off kilter. On a website or blog, there’s not much to be done about these since the lines adjusts to fit the reader’s screen. But if you post a meme or square with text, like an inspirational quote or statement, make sure the lines are of a relatively even length throughout.
Watermark – This is how people prevent other people from claiming your design or image as their own. In the branding world, it also ensures that your company’s name follows a design on its journey through shares, reposts, and likes. Put your logo on everything you post. Period.