Web Tip Wednesday | Web Design Terms
Web design terms are sometimes confusing for people who don’t work with design every day. Here are some design terms that can help get a better understanding of this sometimes complicated profession.
Alignment
You’re probably familiar with alignment as term to describe the positioning of text: left, right, justified, and centered. Alignment can apply to any element on a web page, not just text.
Branding
Many people think branding is just a logo. Branding is also communicated through your website, business card, product packaging, and any other promotional materials used in your business. Your branding describes what your businesses is and what it stands for. It is important that your web designer understand your brand in order to maintain a consistent image.
Color Scheme
A color scheme is a selection of colors to be used together in a design. Colors within a scheme should look appealing together. While there is no hard and fast rule for how many colors you should choose, the more colors you use the harder it is to created a cohesive design. The color scheme of your website should match the color scheme of your overall branding.
Copy
Copy refers to the text content on a web page and includes the main text as well as any headlines or captions.
Fold
Fold is a term with origins from the days of printed news, referring to the fold in a newspaper that separated the top of half that was visible when folded (above the fold) from the bottom half (below the fold). In web design, “above the fold” refers to the content that is visible at the top of a web page without any scrolling. Anything “below the fold” is content that the user cannot see unless they scroll down the page.
Layout
The layout of a website is the arrangement of all visual elements on a page. This includes the position of the logo, navigation, text, and images. The layout is the the foundation of a website’s design and is used to guide the user through the page.
Lorem Ipsum
Don’t be alarmed if your designer hands over a mockup filled with Latin-looking text. Lorem Ipsum is filler or dummy text often used in design mockups to demonstrate a font or to hold the place of actual copy if that copy isn’t ready.
Mockup
A mockup is a non-functioning graphic representation of a website. They are often built in Photoshop and are used to determine how a website will look before development begins. By establishing a website’s design through static mockups, rather than fully-functional coded pages, it is easier to make adjustments to fonts, colors, etc. This saves time and money on a web project.
Navigation
A website’s navigation is a collection of links that allow users to “navigate” to other pages of your website. Your website’s navigation can also be called a “menu.” Your primary navigation, or main menu, is generally located near the top of a web page.
Placeholder
A placeholder often refers to images used in the design or early development stages of website for position only. Its purpose is to fill the space of an image on a web page or design mockup until the final image is ready. Placeholder can also refer to text, though this is usually referred to as “dummy text” instead.
Responsive Design
Responsive design solves the problem that was created when smart phones and tablets became popular. Traditional web sites were fixed-width and designed for computer monitors only. Fixed-width sites create lots of usability issues on phones and tablets, which is why people started creating separate mobile sites.
Responsive design solves this problem by using fluid-width layouts instead of fixed-width layouts. Responsive websites adjust to different sized screens and display properly on any device. This eliminates the need for dedicated mobile sites.
Typeface
Arial and Helvetica are typefaces. You probably know these as “fonts.” Technically, there is a difference between the two, but this distinction is only critical to professional type designers. In web design, the terms typeface and font are often used interchangeably, and your web designer may use either one.
White Space
White space is the empty areas on a page. Proper amounts of white space create balance between elements on a page. It is important not to cram things too close together on a web page. White space can also be used to bring focus to elements like images and blocks of text.
