A Non-Designer’s Guide to Web Design Terms

robintek_linkedin_background

Written by Rachel List, Photographer and Web Developer

We all know that technical jargon can be overwhelming. When working with a designer on your website there may be some terms you aren’t familiar with, or you may just want to make sure to communicate your vision for your website clearly. Here are some common terms and their definitions which might be helpful.

 

Back End:

The back end of a website is the part which is not accessible by general website visitors. It usually encompasses the structure, application and any content management system (CMS) used by the website.

 

Below the Fold:

This is a term that has been carried over from the newspaper industry and refers to any content on the lower half of a page, which would have been below the physical fold of the newspaper. The term is currently used to refer to any content which a user has to scroll to view on a webpage.

 

Cache/Caching:

When you visit a webpage your browser will save some files so that the next time you visit the site it loads faster, this is called caching. This is great for giving you faster load times, but doesn’t always allow you to see updates which have been done to your website. You may have to refresh your browser or clear your cache to view website updates.

 

Call to Action:

A page element which is designed to make a user act, this could be a button, text, banner or image. An example of a call to action would be a button saying click her to learn more.

 

Color Scheme:

Color schemes are combinations of colors used in your website design.

 

Copy/Content:

Clear and descriptive text.

 

Footer:

Design element at the bottom of a website, usually consistent throughout the site. This area usually includes navigation items, contact information and copyright information.

 

Front End:

The front end of a website is the part which visitors see when they come to the site. It is the look and feel of a website and is generally what most people think of when they talk about designing a website.

 

Header:

Design element at the top of a website, usually consistent throughout the site. This area generally includes a logo, navigation items, and often some contact information.

 

Navigation:

The elements used to maneuver throughout a website; this often includes a menu, footer links, and navigational buttons.

 

Resolution:

Resolution refers to the number of pixels in an image and is identified by width and height. Images need to have a certain resolution to display properly without degrading the image.

 

Serif and Sans Serif Typeface:

A Sans Serif font has no decorative flourishes at the ends of strokes of letters or symbols. An example of a Sans Serif font would be Arial. Sans Serif fonts are preferred for body copy in online formats for readability.

A Serif font has decorative flourishes at the ends of some strokes of letters or symbols. An example of a Serif font would be Times New Roman.

 

Saturation:

How intense or bright a color is.

 

Slider:

A rotating banner of images and or video usually placed on the homepage of a website.

 

Typeface:

The fonts used on your website. Generally, sans serif fonts have been found to be easier to read in online formats are so are preferred for web design. The number of fonts used on a website should also be streamlined to make sure the design is cohesive.

 

Web Safe Fonts:

Browsers have improved their capabilities in displaying a wider range of fonts in recent years, however not all fonts are able to be viewed consistently across all browsers online still. A web safe font is a font which displays consistently online.

 

Weight:

When used in reference to typeface/font this is the thickness of the stroke (light, regular, bold). Weight can also refer to the emphasis of elements in a design based on their perceived hierarchy or importance.

 

White Space:

The empty or blank space in a design.

 

Vector:

Vector images are made up of lines and shapes, not pixels and can be resized without compromising image quality.

 

Visual Hierarchy:

Visual Hierarchy is a design principle used to emphasize certain elements of a design.

Contact Us

  • This field is for validation purposes and should be left unchanged.