Essay: Font Terminology or Typography – web design

To make text easy to read and access on a website, typography is a very important aspect for web designers. There are two major factors in typography; readability and legibility. Readability is about how text and groups of text are arranged on the page and Legibility is about designing a typeface and making each character distinguishable from another.
4.2.2. Readability
Readability is about arranging words or text to allow easier access to the content for the viewers.
Some important things concerning readability can be seen as follow.
Line Spacing
Improper type spacing is one of the easiest mistakes of typography to find on websites. It occurs when a text block does not have enough margins, subheadings and related body text which aren’t visually tied together properly, and so on. Placing spacing properly allows the viewers to easily read the text and search the preferred points.
Line spacing is the vertical distance between each line of text. Letter spacing, paragraph spacing and the space around a text block seem to be related with the line spacing. For example, if the line spacing of a paragraph is given 2em and another paragraph of same sized text is 1.5em, the first one would need more paragraph spacing and may require more margin space around it.
For example,
Size
Every web designer knows well that the text size shouldn’t be very small. The ages and eyes of the viewers accessing the website will vary and it is important to make the text easy to read by most eyesight. Traditionally, 13px should be the smallest but today, with the responsive websites, designers are moving towards larger text. In RWD (responsive web design), designers use flexible text size or different sizes of text for different devices.
Measure
Another typography mistake that makes it difficult to read is making horizontal lines of text very wide on a web page. This horizontal distance is called measure or line length. If a line of text is very long, it is difficult to read and to go back to the left edge of next line after reading one line. It’s frustrating to see such kind of text block and some viewers may not even want to read it. The maximum length of a text block normally depends on the font size. Larger text size may have longer measure or text length.
Letter Spacing
Letter spacing is the distance or length of gap between each letter in a word. Letter spacing is commonly used in adjusting the density of a text block or subheading or a headline. Letter spacing seems not to harm the readability but too wide or too narrow spacing will affect the readability. As shown below, the uppercase letters are more readable when a little more space is added around them.
Contrast
Contrast is also important for readability of text on a page. It can be making a particular part of text to draw more or less attention, or to make layers to place things according to their importance in the design. It is important to note that elements and text vary from screen to screen, and too much using contrast is not best for every situation.
Hierarchy
Hierarchy is also a very important part in the readability. An effective hierarchy arranges the content into easily accessible parts and allows the users to read and find their preferred content easily.
4.2.1. Legibility
Various typefaces were created for different purposes. For example, Garamond was first created for a large block of text to be legible when it is printed on paper. There are also typefaces which were designed particularly to display on digital screens like Georgia and Verdana.
Some fonts can be very flexible including various weights and usable in many ways, and others are meant to be used for particular purposes. A few things concerning typeface’s legibility can be seen as follow:
Display vs. Text
Some typefaces were created to use as large content like headlines. Such typefaces will not likely to be easy to read as small text and content like body copy should not use them. Such typefaces are called display faces.
For example, Knockout
Some typefaces are meant to use as small content in a large body copy. Such typefaces are known as body faces or text.
Serif and Sans Serif
Whether serif or sans-serif typeface is more legible is difficult to say. Traditionally, serif typefaces are assumed more legible because they are commonly used for printing large content of text. It is easier to scan text in the serif typefaces increasing speed of reading and reducing eyestrain.
But there are tons of sans-serif typefaces which are easy to read too. Sans-serif faces seem to be used more for online body copy. The reasons can be for looking more modern or websites normally not containing large passages of text, so they are alright to be used in short body copy on a page.
Height
Another important thing for readability is height or x-height which is normally used for body sizes of texts. The x-height means the vertical distance of small letter “x” of a font. The ascenders or descenders are not taken into account when measuring the x-height of a word. X-height of different typefaces varies greatly. It is easier to read with large x-heights even typefaces are small.