Overview and review

Question 1

Who wrote an article in 2006, suggesting World Wide Web, is composed mostly of letters, therefore web designers had to start paying attention to text?

Answer 1

Oliver Reichenstein developed a hypertext luminary, “Web Design is 95% Type”, in 2006 which crashed into scene writing.

Question 2

What does Ellen Lupton rank her font in “Design For Web” in 2014?

Answer 2

Ranked it as: readability, showmanship and classiness which in the end HOW IT RENDERS

Question 3

Why do you have to look at visual anatomy and cultural geography of letters esp. digital typography?

Answer 3

Ellen Lupton said that digital typography teams up with diversity of tropical rainforest littered with trash

Question 4

When did TYPOGRAPHIC DIVERSITY develop? Why?

Answer 4

Typographic diversity happened when CSS2 was drafted in 1998 because it included @ font-face rule, which enabled browsers to download font info. Thus giving permission to any font being used. IE4 implemented in and still used today.

Question 5

What happened when @font-face was developed in 1998?

Answer 5

Typographic diversity happened - use any font you want and it contained no piracy protections. Users downloaded unlicensed fonts and linked them. It threatened type business.

Question 6

What allowed designers to spend more time perfecting their craft in 2000?

Answer 6

Implementation of web standards had made developing site a quicker process. Spend less time WRITING different versions of same page.

Question 7

Name 3 technologies that popped up to fill a void left by CSS 2.1. What was the purpose?

Answer 7

SIFR=Scalable Inman Flash Replacement
SVG=Scalable Vector Graphics
CANVAS=Typeface.js

These techniques worked well to allow any print font to be used on the web without need to purchase additional licenses.

Question 8

Why did designers start to worry less about piracy toward end of 2000?

Answer 8

They worried more about design market which was rapidly moving without them.

Question 9

Who was the early internet designed for in 1992?

Answer 9

It was designed to connect scientist working on different platforms

Question 10

Which font format is favored by Windows? And MAC?

Answer 10

TRUE TYPE: Favored by Windows

POSTSCRIPT: Favored by MAC

Question 11

What is TYPE ON SCREEN?

Answer 11

Survey new design principles born on screen-based communications while drawing on traditions of form and function

Question 12

What are 5 basic parameters of type on screen? Why is this necessary?

Answer 12

Weight, size, style, alignment, spacing - help users find info they are seeking

Question 13

What should be concerns for designers in order to create pleasing and engaging experiences for all readers?

Answer 13

Interconnected choices from typeface and page structure to modes of LINEARITY, INTERACTIVITY and NAVIGATION

Question 14

Can you explain the difference between following measurements of type on screen: ems, px, pt or %

Answer 14

EMS: Scalable, no fixed units determined in relationship to browsers current point size
PX: Absolute elements set by browsers
PT: Employing units can override user’s browsers settings
%: Scalable, no fixed units determined in relationship to browsers current point size

Question 15

How does the designer use a combination on method to enable pleasant reading across devices?

Answer 15

Responsive websites uses flexible foundations, otherwise large images typically forces users to zoom in when same content appears on smaller screens.

Question 16

Why have/do designers use grids? How would you make a grid for a website?

Answer 16

1. Subdivide into 16 equal parts
2. Work with 960px of screen width
3. Since 1950’s we have used grids to organize empty void into columns and rows of white space.
4. Digital screens consist of thousands of square pixels.
5. Designers define robust and flex grids for arranging content
6. Establish flex, adaptive grid systems

Question 17

Why has Google amassed a library of free fonts that’s designed well? List 5 Google Fonts.

Answer 17

Google pays current market rates to commission type designers in hope to give people access free web fonts and not use graphic GIFs. The end result is to create a searchable and translatable text (SEO).

David Crossland designed PT Sans & Serifs, Alegreya, Andika, Montserrat and Copriola

Question 18

What is a mutable typeface?

Answer 18

Mutable typeface gives designer multiple options to typeset the same message. The typeface comes with one STANDARD and ALTERNATIVE ways to typeset same words. This concept lends itself to animation, not exclusive to type design and address nature of fonts as software.

Question 19

Name 3 examples of mutable typeface?

Answer 19

JULIEN: 1000 alternate glyphs - Bil’ak
WALKER: Designed by Matthew Carter for Walker Art Center in 1995. It employs 5 different styles and weight on ‘snap on’ serifs, yielding numerous variant styles, unifying look includes horizontal rules
ED INTERLOCK: Designed by Ken Barber and Ed Benguitit. 1400 discretionary ligatures or typefaces in 1960-1970.

Question 20

What is monospace? Give an example.

Answer 20

Monospace is when EVERY GLYPH would have SAME WIDTH = UNICASE (mixing upper and lowercase) and GEOMETRIC SANS SERIF.

EXAMPLE: ALCANTARA designed AlphaBeta to create many legible glyps of each character.

Question 21

What achieve universal web typography?

Answer 21

HINTING

A TRUETYPE, favored by Windows, carries around its own instructions for making the leap from OUTLINE to RASTER

Question 22

99% of fonts lack _________ which makes them display poorly and inconsistent

Answer 22

HINTING

Question 23

1% hinted font is _______ and _______

Answer 23

Georgia and Verdana

Question 24

What does hinting tell operating systems to do?

Answer 24

• Hinting transforms shapes of letters based on size displayed.
• It tells the browser to adjust features such as: HEIGHT, STEM WIDTH, WHITE SPACE, SLANT of ITALICS, relationship between UPPER AND LOWER case
• Hinting creates sharper looks by increasing contrast along edges of letterforms, at expense of screen preserving character, shape and space

Question 25

How was the original outline of type transformed to fit to screen?

Answer 25

True Type Hinting

Question 26

What does it mean when a FONT TAKES A HINT?

Answer 26

1. Conforms to pixel grid of screen
2. Any digital font that goes from vector essence to raster through interpretation
3. Hinting is set of instructions that tells raster of browser (operating system) how to reposition a typeface outline for better display at different size

Question 27

Name the 3 type of design faces and where they come from

Answer 27

SERIF FACE: Introduced in 15th century, imitated older media, handwriting and stone carving

SANS SERIF FACE: Meet needs of commercial advertising devised in 19th century for printers

SLAB SERIF: 19th century have chunky, geometric end strokes with much heft and presence in main stroke of letters (WEB).

Question 28

What is the Cap Height and X-height?

Answer 28

CAP HEIGHT: Distance from baseline to top of letters

X-HEIGHT: (Size of x-height of font) Vertical main body and lowercase

Question 29

What is the Ascender or Descender?

Answer 29

ASCENDER: Extend above height of letters
DESCENDER: Hang below baseline, long descender

Question 30

What is an Overhang?

Answer 30

OVERHANG: Curve of letter hangs over baseline

(Bottom strong characters) like s, t, or u

Question 31

What is Ligatures?

Answer 31

Combination of 2 characters such as fi, ff, or fl that prevents awkward bumps or grinds