- General Best Practices
At Finalsite, web designers get the amazing opportunity to work with a variety of clients, from independent schools to public school districts. From time to time, we get questions asking what certain design terms mean. We've compiled a list of a few terms you might hear while communicating with designers.
Accessibility takes into account how everyone, including users with visual, physical, and temporary impairments will interact with and navigate your website. A website with little to no considerations for Accessibility will be impossible for a person with disabilities to use.
2. User Interface and User Experience (UI/UX)
User Interface (UI) and User Experience (UX) are two parts of overall website usability. User Interface is what the person using the website sees and interacts with. User Experience is the journey and process of a person completing a task on your website. The website design (interface) is directly influenced by what you want your website visitors to achieve and the workflow of that process (experience).
3. Information Architecture
Information architecture is the organization of all the parts of something in order to make it more understandable. This includes the structure of your website pages. It also includes the content on your pages and how that information is structured.
4. Sticky Header
"Sticky" headers are the header bars that follow the user down the page as they scroll. They usually contain the site logo and website links. A useful sticky header can help speed up your user's navigation through your site, helping them find the pages they need quickly without losing their place.
5. San-serif vs. Serif
Fonts are grouped into two main categories: Sans Serif and Serif. A sans serif font is a typeface that looks like Arial or Tahoma, where it has straight lines. A Serif font is a typeface similar to Times New Roman or Georgia, where it has a more traditional look.
Font Weight is how thin or bold a font is. It can be written as both a word and number format. For instance "bold" can also be written as "700".
Font style indicates whether a font is italicized or not.
8. Hexadecimal (Hex Code)
This is a base 16 Color Code system used to define colors online. It uses a series of six numbers, 0-9, and letters, A - F to define each specific color. They are always prefaced with the # sign. This color code is used by all web designers.
RGB is an acronym for Red, Green, Blue. It is used for in web design because these are the colors monitors use. Each value is a number from 0 - 255 to display the amount of red, green, or blue it takes to make a specific color. Occasionally you'll see an "A" on the end, making it RGBA. This A stands for alpha and notes if a color has transparency. That transparency is a number from 0 (transparent) to 1 (full color). This is a color code that web designers use as well.
CMYK is an acronym for Cyan, Magenta, Yellow, and Black. It is primarily used for off-set printing. Each value is a percent from 0 - 100% to display the amount of cyan, magenta, yellow, and black it takes to make a specific color. These codes can be converted to RGB or Hex codes, but they may appear different on screen versus when printed.
11. Pantone / PMS
PMS is an acronym for Pantone Matching System. Pantone colors are primarily used for spot color printing. These codes can be converted to RGB or Hex codes, but they may appear different on screen versus when printed.
12. JPG (JPEG)
JPG is an acronym for Joint Photographic Experts Group. It is an image type that produces a minimal perceivable loss in quality. That means the image is compressed down to load for web, but it still appears high quality. This format is best for photographs.
PNG is an acronym for Portable Network Graphic. It is an image type that is best used when an image has a transparent background or large areas of color. PNGs produce a similar quality to JPG.
GIF is an acronym for Graphics Interchange Format. It is a format that is best for small image files with limited colors and animated images.
SVG is an acronym for Scalable Vector Graphics. This format is designed for images that need to be scalable and provides support for interactivity and animation. One common use of SVGs are website logos. This file format allows for website logos to adapt to a variety of screen sizes.
ABOUT THE AUTHOR
Keisha is one of Finalsite's talented Web Designers and Front-end Developers. She is an outgoing graphic designer who is a fashion chameleon that lives to lift heavy in the gym.
- Web Design