Typefaces
There are three general types of fonts that can be used in basic classification:
-
serif
-
sans-serif
-
monospace
Serif Fonts
There are many examples of sites using "serif" fonts to great effect. Preview their usage on:
Sans-Serif Fonts
Likewise, there are many examples of websites using sans-serif fonts to great effect:
Monospace Fonts
Most modern fonts that are used for computers utilize "proportional width." This means a character is only as wide as necessary. Alternatively there is a class of fonts known as "fixed-width" or "monospaced." Each character in a monospaced font family is the same number of pixels wide.
There has been a recent trend in using monospaced fonts, due to their legibility and implication of typewritten content. However, these fonts are primarily utilized for code. As an example, the code blocks throughout this courses webpages use the "Fira Mono" fixed-width font.
One of the primary reasons for using these fonts is that characters will align vertically between different lines:
This line is 32 characters long.
I also take up 32 characters ...
We can have different phrases, :)
But the characters will align. :)
------------------------------ :)
Since using a monospaced font essentially creates a grid system, many hackers (and any 90's teenager worth their salt) have utilized monospace fonts to create "ASCII Text Art."
( )( ____ \( __ \ \__ __/( ___ ) ( ___ )( ____ )\__ __/( ____ \
| () () || ( \/| ( \ ) ) ( | ( ) | | ( ) || ( )| ) ( | ( \/
| || || || (__ | | ) | | | | (___) | | (___) || (____)| | | | (_____
| |(_)| || __) | | | | | | | ___ | | ___ || __) | | (_____ )
| | | || ( | | ) | | | | ( ) | | ( ) || (\ ( | | ) |
| ) ( || (____/\| (__/ )___) (___| ) ( | | ) ( || ) \ \__ | | /\____) |
|/ \|(_______/(______/ \_______/|/ \| |/ \||/ \__/ )_( \_______)