• 324k
  • 101
Web Design \ JUN 5th 2017

10 Classic Design Terms You Need to Know

While watching your brand’s website come to life in the Wix website builder is exciting, sometimes keeping up with design trends can feel overwhelming. This process can be even harder to manage when people begin throwing around words you’ve never heard before. Leading?! Kerning?! Resolution?! It’s like they are speaking another language.

It may feel like the world of web design is changing rapidly, and for the most part, it is. However, as the lines between the real world and digital world start to blur, there are several terms that have spanned the divide. These classic terms bring a little of the old school of design into the new world of digital media.

Typography

Typography is the process of arranging type – the words, the letters, the symbols and even the spaces between them.  The arrangement of type plays a large part in determining how a message is conveyed, therefore, your website’s typography should serve a specific purpose without neglecting the general one: readability!

Typography

Grid

A design framework made up of evenly divided, intersecting rows and columns is called a grid. Designers use grids to align and arrange elements in a cleaner and more consistent way. You can use columns on your site to help tell a visual story by separating your content into neatly organized, digestible sections.

Alignment

In design, alignment refers to the sorting of elements to achieve order, balance and a more logical layout. Not everything on your website has to be perfectly aligned or even use the same alignment. Instead, think about how you can mix your positionings. If you go with this approach, there will still be a pattern to every element on your website, but you’re creating something of visual interest that will keep your users exploring the website.

Alignment

Kerning

Kerning, also referred to as character spacing, refers to the space between two specific letters, numbers or characters. The process of adjusting that space improves legibility. To further understand kerning, imagine a box drawn around each letter of a word. Without kerning, each character would line up at the edges of these boxes. Kerning enables these edges to overlap so the space between each character can be adjusted to appear tighter or looser, depending on the desired effect.

Kerning

Leading

Leading refers to the space between each line of text. This is used when content has multiple lines of text to ensure the space from the bottom of a letter on one line and the top of a letter on the next line is appropriate enough to make the sentence legible. Lines of text that are set too close or too wide can be difficult to read, so you’ll want to take the time to find a sweet-spot.

Leading

Resolution

Generally speaking, the word resolution refers to the number of pixels in an image; the higher an image’s resolution, the higher the quality. A high-resolution image will be clear and crisp whereas a low-resolution image will feel a little pixelated and blurry. Luckily with Wix, all you have to do is take stunning photos, upload them and then let the Editor work its magic. Want to learn more? Check out this complete guide for optimizing images and see just how simple it is to have the best possible quality on all computers and devices.

Saturation

The degree of intensity and vividness of a color is dependent on the color saturation. Colors with low saturation may appear faded or pale, whereas a more heavily saturated color will appear vibrant and more colorful. Images with a high saturation give an appearance of weight, so try to increase the saturation of an image you want to stand out on your website. Conversely, if you’re adding text over a picture and would like the words to stand out, use a less saturated image to make your text pop!

Saturation

Contrast

We can use contrast to describe the difference in color found between the light and dark parts of an image, but it can also refer to the degree of difference between two elements. You may automatically think about color contrast like warm vs. cool and dark vs. light. While color is an essential principle of contrast, it can also refer to type, alignment and size. A website layout where every element is the same size, shape, or color is going to look pretty boring, but you can use contrast to liven things up.

Contrast

Opacity

The lower the opacity, the more transparent an element is. Lowering the opacity of an object allows us to see what is underneath. Designers will often edit the opacity of specific objects, allowing them to create arrangements that flow together.

Gradient

A gradient is a gradual change in color from one tone to another, one color to another, or one color to total transparency. This gradual change might include multiple colors, radiate from the center, come from a corner or maybe even span from top to bottom. We see gradients as a refreshing way of using colors—by blending two or more together, you are able to create a more modern and unique appearance.

Now that you know the design lingo, create your stunning website today!

Chase Lepard
By Chase Lepard
Community and Social Media Manager, Wix

Get The Wix Blog
Straight to Your Email

Subscribe to the WixBlog And never miss an update!

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address. Email already exists

Hmmm, that's not a valid email address. Invalid email

Join Us! \ 

Get the latest and freshest content on creating
& marketing your Wix website.

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address. Email already exists

Hmmm, that's not a valid email address. Invalid email