We were to create, name and design a magazine that fits into an existing category: fashion, music, design, men’s style, architecture, food, etc. I started by creating a fun creative logo for the magazine, then I experimented with different typography choices to find the most suitable typeface for my audience. Stock images were sourced that offer an architectual feel to the magazine, which also helped to design each page layout. The light use of colour played a role as well, using complimentary colours throughout the magazine. Page elements, styles, pull quotes and folios were also used in Indesign to achieve the overall design of my architecture magazine.
This week in class we learned about the anatomy of typography. Typography is an art and a technique that arranges type to make it more readable, legible and visually appealing when displayed. The arrangement of type involves selecting typefaces, point size, line length, line-spacing (leading), letter-spacing (tracking), and adjusting the space within letters pairs (kerning). At first it all seemed overwhelming to me but I watched a few tutorials on the topic and I actually started to understand it. I’ve come to respect the amount of detail that goes into the art of typography. Who knew there was so much behind the font and type we see everywhere now a days? From corporate branding to logos and even t-shirt designs. It’s everywhere and understanding it is an art all on it’s own. Here is a break down of the rules and structure behind typography. I’ve also added a couple video links that might help you understand it better, hope you enjoy.
A stylized character of the Latin et used to represent the word and.
Definition: The typographic symbol used to designate the word and (&) is the Latin symbol for et which means and. The name, ampersand, is believed to be derived from the phrase “and per se and.” On a standard English layout keyboard the ampersand (&) is accessed with shift+7. In many fonts the ampersand looks much like a cursive S or a curvy plus sign but in other fonts you can almost see the word Et in the design of the ampersand.
Also Known As: & | and
The partially enclosed, somewhat rounded negative space in some characters.
Definition: The aperture is the partially enclosed, somewhat rounded negative space in some characters such as n, C, S, the lower part of e, or the upper part of a double-story a.
Also Known As: counter
A point at the top of a character where two strokes meet.
Definition: The point at the top of a character such as the uppercase A where the left and right strokes meet is the apex. The apex may be a sharp point, blunt, or rounded and is an identifying feature for some typefaces.
Also Known As: top
A curved stroke that is continuous with a straight stem.
A horizontal or upward, sloping stroke that does not connect to a stroke or stem on one or both ends.
Definition: The arm of a letter is the horizontal stroke on some characters that does not connect to a stroke or stem at one or both ends. The top of the capital T and the horizontal strokes of the F and E are examples of arms. Additionally, the diagonal upward stroke on a K is its arm. Sometimes arm is used interchangeably with bar or crossbar or cross stroke.
Arm is often also used to describe the mostly horizontal top stroke of C, double-story a, G, and other glyphs, to include the finial, terminal, spur, or other elements of the stroke.
Also Known As: crossbar, cross stroke
An upward vertical stroke found on the part of lowercase letters that extends above the typeface’s x-height.
Definition: In typography, the upward vertical stem on some lowercase letters, such as h and b, that extends above the x-height is the ascender. The height of the ascenders is an identifying characteristic of many typefaces.
The ascenders of some letters may touch or almost touch letters in the line above causing awkward or distracting patterns. This is most likely to happen or be obvious when a line of text with tall ascenders is below a line of text with long descenders. To resolve the problem of touching ascenders and descenders you can: Increase the leading (line spacing) between lines of type; Choose a different typeface; For headlines and subheads, some careful editing/re-wording can eliminate the problem; Changing the alignment of the text may also help.
The invisible line marking the height of ascenders in a font.
The invisible line marking the farthest distance between the baseline and the top of the glyph.
An imaginary line drawn from top to bottom of a glyph bisecting the upper and lower strokes is the axis.
Definition: An imaginary line drawn from top to bottom of a glyph bisecting the upper and lower strokes is the axis. For typefaces that exhibit changes in the thickness of curved strokes, the inclination of the axis of the lowercase o is used to measure the angle of stress. A completely vertical axis indicates a design with an angle of 0 or vertical stress. When the axis leans to the left or right the design has angled (positive or negative) stress. Early styles of typefaces generally shared similar axis or stress angles.
The axis or design axis is also an adjustable attribute of some fonts, such as Multiple Master fonts. Adjusting the design axis results in variations in the weight, width, size, and other features of the typeface.
Also Known As: stress, angle of stress, design axis
A circular form at the end of the arm in letters.
Definition: In typography, the terminal is a type of curve. Many sources consider a terminal to be just the end (straight or curved) of any stroke that doesn’t include a serif (which can include serif fonts, such as the little stroke at the end of “n” as shown in the illustration). Some curved bits of tails, links, ears, and loops are considered terminals using the broader definition (see the Microsoft Typography site for further explanation).
Ball terminal is a combination of a dot (tail dot) or circular stroke and the curved bit (hook) at the end of some tails and the end of some arms (a, c, f). Beak terminal refers to the sharp spur or beak at the end of a letterform’s arm and the curved bit (terminal) between the beak and the arm.
The horizontal stroke in letters. Also referred to as Crossbar.
Definition: The (usually) horizontal stroke across the middle of uppercase A and H is a bar. The horizontal or sloping stroke enclosing the bottom of the eye of an e is also a bar. Although often used interchangeably, the bar differs from an arm and a cross stroke because each end connects to a stem or stroke and doesn’t (usually) intersect/cross over the stem or stroke. The varying positioning, thickness, and slope of the bar is an identifying feature of many type designs.
Also Known As: crossbar, arm, cross stroke
The invisible line where all characters sit.
Definition: In typography, the baseline is the imaginary line upon which a line of text rests. In most typefaces, the descenders on characters such as g or p extend down below the baseline while curved letters such as c or o extend ever-so-slightly below the baseline. The baseline is the point from which other elements of type are measured including x-height and leading. The baseline is also significant in the alignment of drop caps and other page elements.
A sharp spur, found particularly at the top of letters in some 20th century Romans.
Definition: A beak is a type of decorative stroke at the end of the arm of a letter, connected to the arm by the terminal. Similar to a spur or serif, it is usually more pronounced.
A serif extending to both sides of a main stroke. They are reflexive.
The complete area covered by all of the characters in a font.
The fully closed, rounded part of a letter.
Definition: In typography, the curved part of the character that encloses the circular or curved parts (counter) of some letters such as d, b, o, D, and B is the bowl. Some sources call any parts of a letter enclosing a space a bowl, including both parts of a double-story g and the straight stem on a D or B. The curved strokes of a C are sometimes also referred to as bowls although they aren’t closed.
The shape and size of the counter and bowl can affect readability and is also an identifying factor for some typefaces.
At small sizes or at low resolution the bowls of some letters may fill in and appear solid. Print at a larger size, higher resolution, or change to a different typeface if this becomes an issue. Heavy typefaces or ones with normally small bowls and counters are especially prone to closing up.
A curved or wedge-like connection between the stem and serif of some fonts. Not all serifs are bracketed serifs.
Definition: The bracket is a curved or wedge-like connection between the stem and serif of some fonts. Not all serifs are bracketed serifs.
Brackets can have different shapes with deep or gentle curves. Brackets may taper all the way to the end of the serif or attach at a midpoint before the serif ends.
The height of a capital letter measured from the baseline.
A line marking the height of uppercase letters within a font.
The open space in a fully or partly closed area within a letter.
Definition: In typography, the enclosed or partially enclosed circular or curved negative space (white space) of some letters such as d, o, and s is the counter. The term counter may sometimes be used to refer only to closed space, while partially enclosed spaces in m, n, or h are the aperture. The shape and size of the counter and bowl (curved stroke enclosing the counter) can affect readability and is also an identifying factor for some typefaces.
Also Known As: aperture, inner space, enclosed space
A horizontal stroke that intersects the stem of a lowercase t or f.
Definition: The horizontal stroke across the stem of a lowercase t or f is a cross stroke. Although often used interchangeably, the cross stroke differs from an arm and a crossbar because it intersects/crosses over the stem. The varying positioning, thickness, and slope of the cross stroke is an identifying feature of many type designs.
Also Known As: arm, crossbar
The horizontal stroke in letters. Also known as a Bar.
Definition: The (usually) horizontal stroke across the middle of uppercase A and H is a crossbar. The horizontal or sloping stroke enclosing the bottom of the eye of an e is also a crossbar. Although often used interchangeably, the crossbar differs from an arm and a cross stroke because each end connects to a stem or stroke and doesn’t (usually) intersect/cross over the stem or stroke. The varying positioning, thickness, and slope of the bar is an identifying feature of many type designs.
Also Known As: bar, arm, cross stroke
An acute, inside angle where two strokes meet.
The part of the letters that extends below the baseline.
Definition: The portion of some lowercase letters, such as g and y, that extends or descends below the baseline is the descender. The length and shape of the descender can affect readability of lines of type and is an identifying factor for some typefaces.
The descenders of some letters may touch or almost touch letters in the line below causing awkward or distracting patterns. This is most likely to happen or be obvious when a line of text with long descenders is above a line of text with tall ascenders and capital letters. Some solutions include: Increase the leading (line spacing) between lines of type; Choose a different typeface; For headlines and subheads, some careful editing/re-wording can eliminate the problem; Changing the alignment of the text may also help.
Also Known As: extender, tail, loop
The invisible line marking the lowest point of the descenders within a font.
The invisible line marking the farthest distance between the baseline and the bottom of the glyph.
A ancillary mark or sign added to a letter.
Definition: Diacriticals are the accent marks used on some characters to denote a specific pronunciation. Rare in English, they are a common occurrence in French, German, Italian, Spanish, and other languages. Some of the more commonly seen diacriticals include acute, cedilla, circumflex, grave, tilde, and umlaut.
Also Known As: accents, accent marks
An angled stroke.
A small distinguishing mark, such as an diacritic on a lowercase i or j. Also known as a Tittle.
A small stroke extending from the upper-right side of the bowl of lowercase g; also appears in the angled or curved lowercase r.
Much like a counter, the eye refers specifically to the enclosed space in a lowercase ‘e’.
Definition: Much like a counter, the eye refers specifically to the enclosed space in a lowercase e.
Also Known As: counter
A tapered or curved end.
Definition: The part of a letter known as a finial is usually a somewhat tapered curved end on letters such as the bottom of C or e or the top of a double-storey a.
Another definition for finial is a swash or ornamental flourish, much like an extended serif, ascender, or descender, often added as a variation to some characters in a typeface.
Also Known As: terminal
The horizontal stroke present on the numeral 5.
A thin stroke usually common to serif typefaces.
Definition: In typeface anatomy, a hairline is the thinnest stroke found in a specific typeface that consists of strokes of varying widths. Hairline is often used to refer to a hairline rule, the thinnest graphic rule (line) printable on a specific output device. Hair or hairline is also a type of serif, the minimum thickness for a serif.
Also Known As: hair stroke
A curved, protruding stroke in a terminal. Usually found on a lowercase f.
A cursive alphabet which is matched with a roman font and used along chiefly for emphasis.
Definition: While roman typefaces are upright, italic typefaces slant to the right. But rather than being just a slanted or tilted version of the roman face, a true or pure italic font is drawn from scratch and has unique features not found in the roman face.
Most word processing and desktop publishing programs have an option to turn a roman font into italic. If a matching italic version is installed, this may work fine. However, if an italic version is not available, some programs will create fake italics by simply slanting the roman typeface.
Venetian printer Aldus Manutius and his type designer, Francesco Griffo are credited with creating the first italic typeface — the term italic paying homage to Italy where the style originated.
Also Known As: oblique, tilted, slanted
Short, descending portion of a letter.
Definition: The lower, down sloping stroke of the K and k is called a leg. The same stroke on R as well as the tail of a Q is sometimes also called a leg.
Also Known As: tail
Two or more letters are joined together to form one glyph or character.
Definition: Two or more letters combined into one character make a ligature. In typography some ligatures represent specific sounds or words such as the AE or æ diphthong ligature. Other ligatures are primarily to make type more attractive on the page such as the fl and fi ligatures. In most cases, a ligature is only available in extended characters sets or special expert sets of fonts.
Ligatures used to improve the appearance of type are usually character pairs or triplets that have features that tend to overlap when used together. The ligature creates a smoother transition or connection between characters by connecting crossbars, removing dots over the i, or otherwise altering the shape of the characters.
A stroke that connects the top and bottom bowls of lowercase double-story g’s.
Definition: In typeface anatomy, the link is that small, usually curved stroke that connects the bowl and loop of a double-storey g.
Also Known As: neck, terminal
A rounded projecting stoke attached to the main structure of a letter.
The enclosed or partially enclosed counter below the baseline of a double-story g.
Definition: In a double-story g, the loop is the enclosed or partially enclosed counter below the baseline that is connected to the bowl by a link. The enclosed or partially enclosed extenders on cursive p, b, l, and similar letters are also called loops. Both uppercase and lowercase cursive letters often have extra loops and flourishes. Sometimes the small curve or hook at the end of a j or q is called a loop although it really isn’t.
The smaller form of letters in a typeface.
Definition: The little letters or non-capital letters of the alphabet are lowercase glyphs. They make up the bulk of written text, with uppercase or capital letters used primarily only to start sentences or proper names.
The term lowercase is derived from the days of metal type where the more frequently used letters were kept near at hand in the lower case while the less frequently used capital letters were kept in the harder to reach upper case.
Also Known As: l.c. | little letters | small letters
Imaginary line running along the top of non-ascending, lowercase letters. The mean line falls at the top of many lowercase letters such as “e,” “g” and “y.” It is also at the curve of letters like “h.”
Numbers with varying heights, some aligning to the baseline and some below.
Definition: Style of Arabic Numerals where the characters appear at different positions and heights as opposed to the modern style of all numerals at the same size and position are called Old Style Figures. Some Old Style figures sit entirely above the baseline while others (such as the tail on the numeral 9) descend below the baseline. Often Old Style Figures are available only in Expert Character Sets although some fonts may come with both Old Style Figures and Lining Figures (those that sit on the baseline).
Also Known As: ornamental figures, old style numerals, non-lining
The partially open space within a character that is open on one end.
Ascenders extending into the space of a following character.
An antiquated sort or glyph, used to recreate the typographic flavor of a bygone age.
A stroke added as a stop to the beginning and end of the main strokes of a character.
Definition: In typography, a serif is the little extra stroke found at the end of main vertical and horizontal strokes of some letter-forms. Serifs fall into various groups and can be generally described as hairline (hair), square (slab), or wedge and are either bracketed or unbracketed.
Hairline serifs are much thinner than the main strokes. Square or slab serifs are thicker than hairline serifs all the way up heavier weight than the main strokes. Wedge serifs are triangular in shape. Unbracketed serifs attach directly to the strokes of the letter-form, sometimes abruptly or at right angles. Bracketed serifs provide a curved transition between the serif and the main strokes. Within these divisions serifs can be blunt, rounded, tapered, pointed, or some hybrid shape.
Some special serif-like character parts are spurs and beaks.
The curved stroke aiming downward from a stem.
The main curved stroke of a lowercase or capital S.
Definition: The spine is the main left to right curving stroke in S and s. The spine may be almost vertical or mostly horizontal, depending on the typeface.
Beyond typography, a spine is specific type of a mathematical curve and the tool used for drawing it.
A small projection off a main stroke.
Vertical, full-length stroke in upright characters.
A straight or curved diagonal line.
Definition: The main diagonal portion of a letter-form such as in N, M, or Y is the stroke. The stroke is secondary to the main stem(s). Some letter-forms with two diagonals, such as A or V have a stem (the primary vertical or near-vertical stroke) and a stroke (the main diagonal).
Other letter parts such as bars, arms, stems, and bowls are collectively referred to as the strokes that make up a letter-form.
A flourish addition replacing a terminal or serif.
A descending stroke, often decorative.
Definition: In typography, the descending, often decorative stroke on the letter Q or the descending, often curved diagonal stroke on K or R is the tail. The descender on g, j, p, q, and y are also called tails.
The tear dropped ends of strokes in letters of some typefaces.
The end of a stroke that does not include a serif.
Definition: In typography, the terminal is a type of curve. Many sources consider a terminal to be just the end (straight or curved) of any stroke that doesn’t include a serif (which can include serif fonts, such as the little stroke at the end of “n” as shown in the illustration). Some curved bits of tails, links, ears, and loops are considered terminals using the broader definition (see the Microsoft Typography site for further explanation).
Ball terminal is a combination of a dot (tail dot) or circular stroke and the curved bit (hook) at the end of some tails and the end of some arms (a, c, f). Beak terminal refers to the sharp spur or beak at the end of a letter-form’s arm and the curved bit (terminal) between the beak and the arm.
A small distinguishing mark, such as an diacritic on a lowercase i or j. Also known as a Dot.
Credits: about.com, wikipedia.com, typographydeconstructed.com, lynda.com
Marek Szkudlarek 