Pretty much every profession has its own language or set of terms that those working in that field quickly master and use on an everyday level with colleagues. However, this can pose problems for those people not involved directly with a specific industry. For example, it can be a challenge for business owners to effectively communicate with Web designers and developers. To make things easier, it can be useful to know some of the more common Web design terms.
Here are 20 of the most used Web design terms that could help you communicate effectively with designers and developers about what you want from your website:
- Alignment – The position of the various elements on your page. Alignment can be focused on the borders of the page, or positioning of elements based on other elements – e.g., aligning all images to the left side of the page, and making sure the text is aligned to the right of each image.
- Banner – A form of advertising that is usually at the top of a page and goes from one side to the other. On many sites, the banner also contains links that can be clicked through to reach other pages.
- Below the fold – The point on the page where viewers will begin to scroll after the page has loaded. Generally you put the most important information above the fold (what the visitor sees first) and supplement information below it.
- Color wheel – A circle of colors that allows designers to easily pick out primary, secondary, and tertiary colors, as well as complimentary and contrasting colors – e.g., on most wheels red is opposite green because they complement one another.
- CSS – Cascading Style Sheets allows designers to dictate the look and feel of a page. These are usually codes that dictate the font, color, and layout of a Web page.
- DPI – Dots Per Inch is the resolution of an image or monitor. The higher the DPI, the higher the resolution or quality of the image.
- Entry and Exit pages – This indicates where a viewer enters your page from an external source, and where a viewer will usually exit your site from. The vast majority of entry pages are the homepage, so these should be designed to capture and maintain interest. Exit pages can be the homepage, or perhaps a signup form.
- GIF – Pronounced Jif, is an image format that is best suited for small images with few colors. These can also be animated.
- Header – This is the absolute top of any page.
- HTML – Hyper Text Markup Language, is the main language used to write webpages. For example, the bullet points in this article would be written as < ol><li>HTML – Hyper Text …</li></ol>. Browsers read this code and translate the directions given.
- JPEG – An image format best suited to pictures and images with a large number of colors. The vast majority of images on the Internet and websites are uploaded in the JPEG format.
- Lorem Ipsum – Placeholder text is used by developers when creating mockups of pages or layout so they can see how the text will look when the page is finished. This can be any form of text and is usually nonsensical, like ‘Lorem Ipsum Dolor’.
- Orphan – A word or short sentence that appears by itself, below the text on a page. Generally these should be avoided, and can be easily ‘adopted’ by adjusting spacing between letters and words, or editing content.
- Parent/Child elements – With HTML and other Web languages there is a relationship between elements (parts of code). Parents dictate elements that will be inherited by other codes (children) that are within the main parent group. For example, if you assign a headline a certain style this style becomes the parent. Any other elements like a bolded word within the headline will be a child. The child will take the same style as the headline and have the added bold format as well.
- Pixel – The smallest element of any image and your monitor. It is essentially one dot of color. The resolution of images and monitors (how clear the image is) is often displayed in pixels. The higher the number of pixels, the higher the resolution and quality.
- PNG – An image format that is most commonly used for images that have large amounts of uniform color or transparent backgrounds.
- Script – A small bit of code that enables browsers to do more than just displaying text. If you’ve ever watched a video while on a website or downloaded something directly from a page, you have interacted with a script.
- Watermark – A mark of ownership which is usually applied to the background of images or content. This is used to highlight ownership and deter theft of visual content. If you plan to post images on your site that you create, you might want to consider adding a watermark as protection.
- White space – Space that surrounds text, images or other parts of the page. It is generally believed that the more white space there is, the easier it is to read content and draw attention to important aspects of a page.
- Wireframe – A visual representation of a website’s layout with directions for visuals, location of content, and style for each page. This is usually constructed before the site is built and is more or less a road map for developers.
Of course, these are just a few of the terms designers and developers use on a regular basis. If you want to understand how to get the best out of your website and technology then we’re here to help.
