The anatomy of Letterforms describes the different elements that make up printed letters in a typeface. The figure below shows the different parts of the letters in a typeface.
Parts of a glyph: 1) x-height; 2) ascender line; 3) apex; 4) baseline; 5) ascender; 6) crossbar; 7) stem; 8) serif; 9) leg; 10) bowl; 11) counter; 12) collar; 13) loop; 14) ear; 15) tie; 16) horizontal bar; 17) arm; 18) vertical bar; 19) cap height; 20) descender line.
A typeface broadly consist of 3 different parts
1) Strokes
2) Terminals
3) Space
Stroke refers to the main body of the letterform. They may be straight, as in letters like l, z, k, v or curved like in c or o. The different parts of the stroke are given below
Terminals are the end of the strokes. They are of two types Serif and Sans-Serif. A seriffed terminal has proftusions on the edges which can be described as a wedge, bulbous, teardrop, slab, etc. Sans-Serif on the other hand does not have these extending features at the end of strokes. Sans-Serif is used often on digital displays these days since they have better legibility on lower resolution displays where serifs are hard to display.
Space refers to the white space that is found between the letters and also inside letters like o and p with closed loops.
Below are some basic definitions to help you understand how type is described and measured.
A typeface refers to a group of characters, such as letters, numbers, and punctuation, that share a common design or style. Times New Roman, Arial, Helvetica and Courier are all typefaces.
Fonts refer to the means by which typefaces are displayed or presented. Helvetica in movable type is a font, as is a TrueType font file.
The different options available within a font make up a type family. Many fonts are at a minimum available in roman, bold and italic. Other families are much larger, such as Helvetica Neue, which is available in options such Condensed Bold, Condensed Black, UltraLight, UltraLight Italic, Light, Light Italic, Regular, etc.
Serif fonts are recognizable by the small lines at the ends of the various strokes of a character. As these lines make a typeface easier to read by guiding the eye from letter to letter and word to word, serif fonts are often used for large blocks of text, such as in a book. Times New Roman is an example of a common serif font.
Serifs are small lines at the ends of character strokes. Sans serif, or without serif, refers to typefaces without these lines. Sans serif fonts are often used when a large typeface is necessary, such as in a magazine headline. Helvetica is a popular sans serif typeface. Sans serif fonts are also common for website text, as they can be easier to read on screen. Arial is a sans serif typeface that was designed specifically for on-screen use.
The point is used to measure the size of a font. One point is equal to 1/72 of an inch. When a character is referred to as 12pt, the full height of the text block (such as a block of movable type), and not just the character itself, is being described. Because of this, two typefaces at the same point size may appear as different sizes, based on the position of the character in the block and how much of the block the character fills.
The pica is generally used to measure lines of text. One pica is equal to 12 points, and six picas are equal to one inch.
The baseline is the invisible line on which characters sit. While the baseline may differ from typeface to typeface, it is consistent within a typeface. Rounded letters such as “e” will extend slightly below the baseline.
The x-height is the distance between the meanline and the baseline. It is referred to as the x-height because it is the height of a lowercase “x.” This height can vary greatly between typefaces.
The distance between characters is controlled by tracking, kerning and letterspacing. Tracking is adjusted to change the space between characters consistently across a block of text. This may be used to increase legibility for an entire magazine article. Kerning is the reduction of space between characters, and letter spacing is the addition of space between characters. These smaller, precise adjustments may be used to tweak a specific word, such as in a logo design, or a large headline of a story in a newspaper. All of the settings may be experimented with to create artistic text effects.
Leading refers to the distance between lines of text. This distance, measured in points, is measured from one baseline to the next. A block of text may be referred to as being 12pt with 6pts of extra leading, also known as 12/18. This means there is 12pt type on 18pts of total height (12 plus the 6pts of extra leading).
Baseline: The imaginary horizontal line that a majority of letters rest on.
Cap height: The imaginary horizontal line that marks there all capital letters end at the highest point.
Crossbar: The horizontal line that connects two other lines in a letter such as “A” or “H”.
Counter: The negative space inside a letter. The counter can be fully enclosed like letters “O” or “A”, or partially enclosed like letters “C” or “U”.
Descender: The imaginary horizontal line that marks the lowest point of special lowerclase letters such as “g”, “j”, “p”, “q”, and “y”.
Leg: The lower angled stroke in letters such as “K”, “R”, and “Q”.
Mean line: The imaginary horizontal line that marks the top point of lowercase letters.
Serif: The finishing stroke at the end of the text that creates a “foot” appearance.
Stem: The main vertical stroke in a letterform. This can also be diagonal like in letters “W” or “N”.
Tittle: The dot above the lowercase letters such as “i” and “j”.
Letterform broadly refers to a letters shape and includes typography. Typography is the apperance of printed letters. In order to understand typography requires a certain vocabulary. By learning the terms of typography, you can also become more critical viewer of printed type.
original article reference courtesy of https://guide.freecodecamp.org/
Techniques
Accessible Graphic Design
Accessible graphic design is the practice of creating visual content that is inclusive and easily understandable for all individuals, regardless of their abilities or disabilities. It involves designing graphics and visual elements in a way that accommodates various needs, ensuring that the information is perceivable, operable, understandable, and robust for everyone.
Colour & Contrast impairment
A comprehensive guide for exploring and learning about the theory, science, and perception of color and contrast. A website for designers to learn about color, contrast, and how it can affect experiences of a user interface...