FED1 Mod 5

em

A unit of measurement typically used for fonts or spacing that should be tied to the font size in the current context. Technically stands for the width of a capital M with the current font.

GIF

A common image file format usable in all browsers, often best for line art, illustrations or images with few complex colors. Stands for Graphics Interchange Format. Typically pronounced hard-g "gif", but the originator intended it to be pronounced with a soft-g "jif". Supports basic animation and transparency.

property shorthand

Many properties in CSS can be specified at a very modular level, like font-size, font-family, and line-height for text. But a quicker way to assign multiple related property values like this would be the font shorthand property.

Family name

When listing multiple fonts in a font family property, the specific font names are called family names.

Imported font

Pulling a specific font into the browser for use.

CDN

A Content Delivery Network is an online host that your website can use to access a common development resource, such as a font, style sheet, or script. Referencing external resources like this can speed up development time or reduce download time for users through browser caching. It also introduces outside dependencies.

PNG

A common image file format usable in all browsers, blending some of the features of jpeg and gif. Stands for Portable Network Graphics. Typically pronounced "ping". Supports transparency but not animation.

JPG/JPEG

A common image file format usable in all browsers, often best for photos or images with many complex colors. Stands for Joint Photographic Experts Group, which developed the format. Typically pronounced "J-Peg".

CSS font family

A font family in CSS is the property to specify the font to be used. However, it is usually set to a collection of font choices, listed in the order of highest preference first. This can be important because a specified font may not exist on the user's computer, or there may even be a problem importing a font.

CSS Named Colors

A limited palette of colors identified by specific names. There are 16 core colors, but browsers tend to support a fuller list of 140 based on the CSS3 recommendation.

Font

A named collection of character designs following a similar aesthetic , typically mapping to commonly recognized letters, numerals and symbols used in written languages. Can be used to change the look, feel and readability of text. Examples: Times, Arial, Helvetica, Courier, and Comic Sans MS.

Favicon

A small image that is displayed in a browser page's tab and with any bookmarks. Used for branding your site and quickly distinguishing it from others (usually you use the same favicon for all pages in your site.

Pixels / px

A standard unit of measurement for the number of pixels. Doesn't allow users to adjust sizes in their browser as easily. More control for the designer, but less responsive.

Transparency

An image with transparency has a "see-through" background. When you place it atop another background, that background shows through. (All digital images are some form of rectangle. With transparency, instead of having the image fill the entire rectangle, or having an image sitting on a specific background that extends to the edges of the rectangle, transparency allows that main image to sit on a "blank" background that will be determined by the background upon which it is placed.)

Icon fonts

Fonts that provide simple icon images, often highly scalable and usually through a combination of imported files, HTML and CSS.

Generic family

Generic font families are generally used as the "last resort" in the list of font family choices, and "fall back" to a font of a general type that is guaranteed to be available through the browser. These families include cursive, fantasy, monospace, serif, sans-serif.

Hex / Hexadecimal shorthand

Hex shorthand allows many common color choices (those that use repeating digits for contributing colors) to be shortened to only 3 digits, rather than 6. This also limits the color range to 4096 total color combinations (16 shades per contributing color), rather than 16+ million. Examples: #333 is shorthand for #333333 (a darker shade of gray), #0F0 shortens #00FF00 (green), but #123455 (a shade of blue) cannot be expressed with hex shorthand because it doesn't meet the pattern requirements.

Animation

In the context of GIF files, the animation supported is a simple looping-in-place of various image frames.

Alt tag

More accurately an alt attribute (although less commonly called that), this attribute of the HTML image tag allows the developer to provide alternate text in case the image is not displayed for any reason.

RGB

RGB is a color coding system that lists the combined red, blue and green levels that contribute to any specific color. It supports over 16 million different colors (256 different shades for each of the 3 contributing colors). There are 4 ways to designate the RGB value: using hexadecimal, hex shorthand, standard numbers or percentages.

RGBA

RGBA is a color coding system that was added later to CSS, based off the original RGB system, which provides for transparency levels. The last value specified is the A, and it stands for "alpha transparency". It supports a range from 0 to 1, where 0 is no transparency (solid color) and 1 is fully transparent (absence of any coloring). All decimal values between 0 and 1 designate some partial level of transparency, such as 0.4 being 40% transparent. Example: rgba(10%, 10%, 70%, 0.75) for a 75% transparent blue.

Optimization

Reducing the size, features and quality of images to limit the file size. Aids in reducing the duration users must wait to download the image.

Hexadecimal

The original RGB color coding syntax for the Web, hexadecimal is used to specify RGB values (levels of red, green and blue) using only 2 digits per contributing color. So black is represented as #000000, white is #FFFFFF, red is #F00000, green is #00FF00, blue is #0000FF, a lighter gray is #DDDDDD, and a darker gray is #333333. Hexadecimal means a 16-based numbering system. So one digit can express 0-15, where after 9, instead of moving to a 2nd digit like we do in our 10-based decimal system, we use A for 10, B for 11, up to F for 15. After F, we move to a 2nd digit, and so 10 becomes 16 in a hexadecimal system, 11 becomes 17. Continuing, the pattern plays out with 1A becoming 25, 1F becoming 31, and 20 becoming 32. Ultimately the top of the range is reached at FF becoming 255, with a total of 256 possible options for each of the 3 contributing colors of red, green and blue.

Flash of ... Text

The unintended consequence of using an imported font whereby the text is displayed poorly before the imported font is applied. Some browsers apply the text in a default font (FOUT, Flash of Unstyled Text) or hide it completely (FOIT, Flash of Invisible Text) until the imported font is applied.

CSS Gradient

a blending of 2 or more colors over distance and trajectory.

Box Shadow

a shadow applied to an HTML element's box model. Box Shadows can have color, horizontal and vertical length, blur radius and spread.

Text Shadow

a shadow applied to text within an HTML element. Typically used to add definition and/or color contrast. Shadows can have horizontal and vertical length, blur radius and color.