Advanced Typography / Task 1
5.4.2023 - 26.4.2023 (Week 1 - Week 4)
Loke Yan Ling / 0344602
Advanced Typography / Bachelor of Design in Creative Media
Task 1
Lecture
Week 1 / Typographic System
Elements of typographical organization are dependent on communication in order to function.
The typographic system provides a solid framework as a guiding to learners.
Shape grammar is a set of shape rules that apply in a step-by-step way to generate a set, or language, of designs.
Fig 1.1 Axial System
Axial System: All elements are organised to the left or right of a single axis.
Fig 1.2 Radial System
Radial System: All elements are extended from a point of focus.
Fig 1.3 Dilatational System
Dilatational System: All elements expand from a central point in a circular fashion.
Fig 1.4 Random System
Random System: Elements appear to have no specific pattern or relationship.
Fig 1.5 Grid System
Grid System: A system of vertical and horizontal divisions.
Fig 1.6 Transitional System
Transitional System: An informal system of layered banding.
Fig 1.7 Modular System
Modular System: A series of non-objective elements that are constructed as a standardised unit.
Bilateral System: All text is arranged symmetrically on a single axis.
Week 2 / Typographic Composition
Fig 2.1 Principle of Design Composition - emphasis
Principles of Design Composition: Emphasis, isolation, repetition, balance (symmetry/asymmetry), alignment, perspective, rhythm, contrast.
Fig 2.2 The rule of thirds
The Rule of Thirds: a photographic guide to composition. The intersecting lines are used as a guide to place the points of interest, within the given space.
Fig 2.3 Post-modernist era poster
The post-modernist era in Typographical systems where chaos, randomness and asymmetry were explored. Order was replaced with apparent chaos. As such the asymmetry, random, repetition, dilatational and radial systems began to take root in the lexicon of designer.
Fig 2.4 Environmental grid
Environmental Grid: Based on the exploration of an existing structure or numerous structures combined.
Fig 2.5 Form and movement
Form and Movement: Based on the exploration of an existing Grid Systems. The placement of a form on a page, over many pages creates movement. The forms could represent images, text or colour.
Week 3 / Context & Creativity
The first mechanically produced letterforms were designed to directly imitate handwriting. Handwriting would become the basis or standard for form, spacing and conventions mechanical type would try and mimic.
Fig 3.1 Cuneiform c. 3000 B.C. E.
Cuneiform: the earliest system of actual writing, was used in a number of languages between the 34C. B.C.E. through the 1st century C.E. Its distinctive wedge form was the result of pressing the blunt end of a reed stylus into wet clay tablets. The cuneiform characters evolved from pictograms and were written from left to right.
Fig 3.2 Hieroglyphics 2613–2160 B.C.E.
Hieroglyphics: The Egyptian writing system is fused with the art of relief carving. The system was a mixture of both rebus and phonetic characters—the first link to a future alphabetic system.
Hieroglyphic images have the potential to be used in three different ways:
- As ideograms, to represent the things they actually depict.
- As determinatives to show that the signs preceding are meant as phonograms and to indicate the general idea of the word.
- As phonograms to represent sounds that "spell out" individual words.
Early greek (5th C. B.C.E.): Drawn freehand, not constructed with compasses and rules, and they had no serifs. In time the strokes of these letters grew thicker, the aperture lessened, and serifs appeared.
Roman Uncials: By the 4th century Roman letters were becoming more rounded, the curved form allowed for fewer strokes and could be written faster.
English Half Uncials (8th C.): In England, the uncial evolved into a more slanted and condensed form.
Carolingian Minuscule: Capitals at the start of a sentence, spaces between words and punctuation. It was this style that became the pattern for the Humanistic writing of the fifteenth century; this latter, in turn, was the basis of our lower-case roman type.
Black Letter (12-15 C. CE): Characterised by tight spacing and condensed lettering. Evenly spaced verticals dominated the letterform. Condensing line spacing and letter spacing reduced the amount of costly materials in book production.
The Italian Renaissance: Newly rediscovered letterforms Antica. The renaissance analysis of form that was being applied to art and architecture was directed toward letterform — resulting in a more perfect or rationalised letter.
Fig 3.4 ‘Indian’ subcontinent the Indus Valley Civilization (IVC) script (3500-2000 BCE)
The oldest writing found in the ‘Indian’ subcontinent the Indus Valley Civilization (IVC) script (3500-2000 BCE), is as yet undeciphered and seems to have been somewhat logo-syllabic in nature.
The earliest writing system developed in India after the Indus script. It is one of the most influential writing systems; all modern Indian scripts and several hundred scripts found in Southeast and East Asia are derived from Brahmi.
Fig 3.6 Southeast Asia scripts, scripts of the communities that assimilated into Peninsula Malay communities.
Week 4 / Designing Type
1. Research
- Understand type history, type anatomy, type conventions and terminologies.
- Determine the type’s purpose or what it would be used for and what different applications it will be used in.
- Study existing fonts that are presently being used for inspiration/ideas/reference/context/usage pattern/etc.
Fig 4.1 Sketch of Johnston Sans, designed by Edward Johnston, sketch by Eiichi Kono
2. Sketching: Traditional/Digital
3. Digitisation
Professional software: FontLab and Glyphs App. Some designers also use Adobe Illustrator then only the specialised font apps. This however is frowned upon by the purist.
Fig 4.2 Prototype Stencil (Stenz) developed and designed by Vinod J. Nair.
4. Testing
The results of testing are part of the process of refining and correcting aspects of the typeface. Prototyping is also part of the testing process and leads to important feedback. Depending on the typeface category (display type/text type) the readability and legibility of the typeface becomes an important consideration. However, it is not as crucial if the typeface is a display type, where expression of the form takes a little more precedence.
Fig 4.3 Prototype Number plate typeface (Car license registration) Myno & Nomy designed by Vinod J. Nair 2018.
5. Deploy
Even after deploying a completed typeface there are always teething problems that did not come to the fore during the prototyping and testing phases. Thus, the task of revision doesn’t end upon deployment. The rigour of the testing is important so that the teething issues remain minor.
Typeface Construction
Fig 4.4 Construction grid for roman capitals (8 x 8 cells)
Using grids (with circular forms) can facilitate the construction of letterforms and is a possible method to build/create/design your letterform.
Construction and considerations
Fig 4.5 Classification according to form and construction
Different forms and constructions must be taken into account when designing a new type. An important visual correction is the extrusion of curved (and protruding) forms past the baseline and cap line (overshoot). This also applies to vertical alignment between curved and straight forms.
Fitting the type: A visual correction is also needed for the distance between letters. The letters must be altered to a uniform visual white space - the white space between the letters should appear the same.
Fig 4.6 Ink traps
Ink traps were generally used when printing on cheap absorbent paper and when printing is fast and not very precise. Excess ink gathers at the corners, but with ink traps the corners remain visible.
Week 5 / Perception and Organisation
Perception in typography deals with the visual navigation and interpretation of the reader via contrast, form and organisation of the content.
Contrast
Carl Dair posits 7 kinds of contrast:
1. Size
A contrast of size provides a point to which the reader’s attention is drawn.
2. Weight
Weight describes bold type stand out in the middle of the lighter type of the same style. Using rules, spot, and squares is also provide a contrast for a powerful point of visual attraction or emphasis
3. Form
the distinction between a capital letter and its lowercase equivalent, or a roman letter and its italic variant, condensed and expanded versions of typeface are also included under the contrast of form.
Fig 5.4 Structure
4. Structure
Structure means the different letterforms of different kinds of typefaces.
Fig 5.5 Texture
5. Texture
By putting together the contrasts of size, weight, form, and structure, and applying them to a block of text on a page, you come to the contrast of texture.
6. Colour
A second color is often less emphatic in values than plain black on white.
Fig 5.7 Direction
7. Direction
The opposition between vertical and horizontal, and the angles in between.
Fig 5.8 Form
Form
The overall look and feel of the elements that make up the typographic composition. To represent a concept by doing so in a visual form. The interplay of meaning and form brings a balanced harmony both in terms of function and expression.
Organisation / Gestalt
The meaning of the way a thing has been “placed” or “put together”.
In design, the components/ elements that make up the design are only as good as its overall visual form.
Fig 5.9 Gestalt theory for organisation
The Law of Similarity: Elements that are similar to each other tend to be perceived as a unified group. Similarity can refer to any number of features, including colour, orientation, size, or indeed motion.
The Law of Proximity: Elements that are close together tend to be perceived as a unified group. This straightforward law states that items close to each other tend to be grouped together, whereas items further apart are less likely to be grouped together.
Fig 5.10 Law of Closure
The Law of Closure: The mind’s tendency to see complete figures or forms even if a picture is incomplete, partially hidden by other objects, or if part of the information needed to make a complete picture in our minds is missing
Fig 5.11 Law of Continuation
Law of (Good) Continuation: Tendency to perceive each of two or more objects as different, singular, and uninterrupted object even when they intersect.
Fig 5.12 Law of Symmetry / Law of Praganz.
Instructions
Task 1: Exercise 1 - Typographic Systems
We will use the content from the MIB to investigate 8 systems in InDesign, including axial, radial, dilatational, random, grid, modular, transitional, and bilateral. The InDesign tutorial films on the lecture playlist were also directed towards us.
- Size 200 x 200 mm
- Colours: Black, White and additional one colour
- Minor graphical elements such as line, circle, rectangle
Week 1 attempts
Fig 6.1 Axial attempts, Week 2 (6.4.2023)
San Serif typefaces such as Universe and Futura are more likely suits the theme of the topic. After I reviewed the poster which provided in MIB, heavy titles such as Black typefaces or bold typefaces are applied.
Font used:
Left: Universe LT Std (Extra Black Oblique, Extended Oblique, Black, Roman)
Right: Universe LT Std (Extra Black Oblique, Bold Oblique, Bold, Roman)
Fig 6.2 Bilateral attempts, Week 2 (9.4.2023)
I find interesting on this system, there are some many composition and layout can be try. This system really provide a balance layout which make it visually appealing. I like the left Figure 2.3 with its clean and comfort layout. However, the middle Figure 2.3 have the theme of the topic itself.
Font used:
Left: Universe LT Std (Extra Black, Black, Bold Oblique, Roman)
Middle: Universe LT Std (Extra Black Oblique, Black, Bold Oblique, Roman)
Right: Universe LT Std (Extra Black, Bold Oblique, Roman)
Fig 6.3 Dilatational attempts, Week 2 (9.4.2023)
The most challenging aspect of this system is to meet its requirements while also ensuring the fluidity of the reading rhythm. I try to avoid isolating information and try to connect them subtly using some creative ways.
Font used:
Left: Universe LT Std (Extra Black, Bold, Roman)
Right: Universe LT Std (Extra Black, Bold, Roman)
Fig 6.4 Grid attempts, Week 2 (10.4.2023)
I'm really confused about how to lay out the grid system to meet the requirements. Plus, I’m also not that clearly understand what the requirement is. So, I make my attempts based on my understanding, but it is clear to see that I did not meet the requirements.
Font used:
Left: Universe LT Std (Extra Black, Black, Bold Oblique, Roman)
Middle: Universe LT Std (Extra Black, Black, Bold, Bold Oblique, Roman)
Right: Universe LT Std (Extra Black, Black, Bold, Bold Oblique, Roman)
Fig 6.5 Modular attempts, Week 2 (10.4.2023)
I played with two standardised units which 2 different size. The heading would be one standardised unit while the detailed information while be the small standardised unit.
Font used:
Left: Universe LT Std (Extra Black, Bold, Bold Oblique, Roman)
Right: Universe LT Std (Extra Black, Bold, Bold Oblique, Roman)
Fig 6.6 Radial attempts, Week 2 (11.4.2023)
The first attempt I tried was basically following the example in the lecture slide to help me have more understanding of the radial system. I think having two focuses can be a bit distracting, thus I minimise into one.
Font used:
Left: Universe LT Std (Extra Black, Bold, Bold Oblique, Roman, Light)
Right: Futura Std (Extra Bold, Bold, Bold Oblique, Medium, Book, Light)
Fig 6.7 Transitional attempts, Week 2 (11.4.2023)
I would try to apply the zig-zag again in this system. However, I made a mistake on my second attempt without noticed the layered band is not shown consistently.
Font used:
Left: Universe LT Std (Extra Black, Bold, Bold Oblique, Roman, Light)
Right: Universe LT Std (Extra Black, Bold, Bold Oblique, Roman)
Fig 6.8 Radial progression inspiration, Week 2 (11.4.2023)
Fig 6.9 Random attempt, Week 2 (11.4.2023)
I have used the shortest time to create this system layout. It was 2am at midnight, and my head was totally blurred and out of focus. The inspiration is taken from the progression of creating the radial system. Although it looks randomly placed, I have highlighted the information in white words with a contrast of black and red background to make sure the information is visible to the reader.
Font used:
Futura Std (Extra Bold, Heavy, Heavy Oblique, Medium, Book, Light)
Fig 6.10 The 8 system, Week 2 (6-11.4.2023)
The favourite and fulfilled the system requirement was picked into the 8 system displayed. I received feedback from classmate and suggestion from Mr Vinod.
Week 2 attempts
Fig 6.11 Axial attempt, Week 2 (12.4.2023)
Fig 6.12 Bilateral attempt, Week 2 (12.4.2023)
With the feedback given, a completely 45 degrees layout should be avoided. I tilted it to 15 degrees.
Fig 6.13 Dilatational attempt, Week 2 (12.4.2023)
The enhancement done is just to move the whole things up.
Fig 6.14 Grid attempt, Week 2 (12.4.2023)
Fig 6.15 Grid attempt with guides, Week 2 (12.4.2023)
Fig 6.16 Modular attempt, Week 2 (13.4.2023)
Fig 6.17 Modular attempt with guides, Week 2 (13.4.2023)
I reviewed the modular system video again before rearranging the grid and modular information. However, it is really hard to make sure all the words in one box and accomplish the rules of typography. I really like both of these works.
Fig 6.18 Radial attempt, Week 2 (13.4.2023)
“The information in the radial system is too spread, and the heading layout can be in a circular shape”, this is the feedback I received. Thus, the improvement is based on the feedback given.
Fig 6.19 Transitional attempt, Week 2 (13.4.2023)
I take the inspiration from the axial system. All the information was arranged in one way and aligned to one axis. The axis line has to be thicker to make sure harmony and balance because of the heavy header.
Final Task 1 - Exercise 1: Typographic Systems
Fig 6.20 Final Axial System - JPEG, Week 2 (12.4.2023)
Fig 6.21 Final Bilateral System - JPEG, Week 2 (13.4.2023)
Fig 6.22 Final Dilatational System - JPEG, Week 2 (13.4.2023)
Fig 6.23 Final Grid System - JPEG, Week 2 (13.4.2023
Fig 6.24 Final Modular System - JPEG, Week 2 (13.4.2023)
Fig 6.25 Final Modular System 2 - JPEG, Week 2 (13.4.2023)
Fig 6.26 Final Radial System - JPEG, Week 2 (13.4.2023)
Fig 6.27 Final Random System - JPEG, Week 2 (13.4.2023)
Fig 6.28 Final Transitional System - JPEG, Week 2 (13.4.2023)
Fig 6.29 Final Task 1 - Exercise 1: Typographic Systems - PDF, Week 2 (13.4.2023)
Fig 6.30 Final Task 1 - Exercise 1: Typographic Systems Grids and Guides - PDF, Week 2 (13.4.2023)
Task 1: Exercise 2 - Type and Play
Identify the object
Fig 7.1 Chosen subject - tree, Week 3 (17.4.2023)
The image is taken by myself in Japan. I chose the tree as my subject because the curvature looks really unique and interesting. The observation to explore potential letters has been done before the image was selected. The letters I found were A, B, O, V, and Y.
Fig 7.2 Traced letters - A, B, O, V, Y, Week 3 (17.4.2023)
The letterforms are extracted in Adobe Illustrator with pen tools. Thus, the characteristic is extracted in detail.
Fig 7.2 Letterform Extraction, Week 3 (17.4.2023)
Identify the direction
Fig 7.3 Typeface reference, Roboto Condensed, Light
Fig 7.4 Typeface reference guiding, Week 3 (17.4.2023)
I selected this San serif typeface as my reference because it has an even thickness stroke and clean design which look similar in thickness to extracted letterforms B and Y.
Fig 7.5 Attempt 1 progression, Week 3 (17-19.4.2023)
Fig 7.6 The last progression for attempt 1, Week 3 (19.4.2022)
The artboards are 1000 px in height and 3000 px in width. The letterforms were simplified to make it not look that messy. I was trying to retain the curvature and appearance of the reference typefaces but the curvature characteristic does not look obvious.
As the feedback said, the characteristic doesn't retain, it looks more similar to the referenced typefaces. Mr Vinod suggested I redo all the steps starting from the extraction. Minor distortion is accepted, the main is to remain the characteristic. Mr Vinod also pointed out that the branches are not completely in a straight line, it has more bending between the angles.
Fig 7.6 Attempt 2 progression, Week 4 (21-26.4.2023)
In the progression, I have tried to achieve the smoothness of the curvature. Not having a totally straight stroke and having some bending in it. The letterform 'O' have remain its characteristic with the small bending on the above.
After approaching Mr Vinod for extracted letterform improvement, I finally found a constant way to develop the core characteristic of the tree, by using pen tool to create strokes not create shapes, editing the width by using the width tool, and then converting them to outline strokes. Consistent stroke also can be achieved. Along with the development of the curvature, the branches of the tree develop as a core feature. I have noticed the extracted letterform "O" have thin and thick stroke transformation, above and bottom have thinner stroke, and left and right have thicker stroke.
Fig 7.8 Final Typedesign, JPEG, Week 5 (30.4.2023)
Fig 7.9 Letter A, JPEG, Week 5 (30.4.2023)
Fig 7.10 Letter B, JPEG, Week 5 (30.4.2023)
Fig 7.11 Letter O, JPEG Week 5 (30.4.2023)
Fig 7.12 Letter V, JPEG, Week 5 (30.4.2023)
Fig 7.13 Letter Y, JPEG, Week 5 (30.4.2023)
Fig 7.13 Final Typedesign, PDF, Week 5 (30.4.2023)
Part 2: Type and Image
In part 2 of exercise 2, we are to choose an image and incorporate a word/sentence of our choice which fits the chosen image. The objective is to enhance/support the interplay between the letter/word/sentence and the selected visual. The text must be woven into a symbiotic relationship with the image.
- Do not manipulate the image (colour editing is fine).
- Text and image takes up 50% each, they shouldn't overwhelm each other, you'll want to see the interplay of each other.
- Either add to the motion or guide the motion.
Fig 8.1 Image source from Pinterest
Fig 8.2 Attempt 1 - "Dying Inside", Week 4 (24.4.2023)
The word "Dying Inside" shows the emotion express by the character in the image.
The word "Dying" used 181px and the word "Inside" used 60px. The difference point size of the words and different colours enhance the protagonist first then the words. The large point size is also used to fill in the negative places and to strongly express the emotions of the protagonist.
Fonts used:
ITC Garamond Std (Book narrow)
Tools used:
Kerning: Creating balance for the words.
Brush: Connect the word inside with the image.
Clipping Mask: Prevent the brush out of the selected place.
Quick Selection tool: To mask out the protagonist and make the word stay behind.
Fig 8.3 Image source from Pinterest
Fig 8.4 Attempt 2 - "Through The Glass", Week 4 (24.4.2023)
The word "DYING INSIDE" shows the emotion express by the character in the image.
The word "Through" used 350px and the word "The Glass" used 78px. The curve effect is applied to show the curvature of the glass like in the aquarium. The main colour of the image is black colour thus the text colour is also black. To make a small contrast on the word " The Glass", an outline stroke is applied in blue colour by using a colour picker to select the colour of the water.
Fonts used:
Bell MT (Bold)
Tools used:
Stroke: To add outline stroke on the words
Wrap text: To bend the words in a spherical shape.
Clipping Mask: Prevent the brush out of the selected place.
Quick Selection tool: To mask out the protagonist and make the word stay behind.
Fig 8.5 Image about the text in rp aesthetic by --Cheyenne
Fig 8.6 Attempt 3 - "Run Until You Found Me", Week 4 (24.4.2023)
I like how the picture is edited in a contrast of green and white. Thus, with the motion of the running pose. The sentence will be run until you find me.
The words are placed in different point sizes and the layout of the text gives the impression of a maze. I duplicate the effect of the leaves of the tree to make it more harmonious. With the adjustment of the effects, Shows a back-and-forth relationship between the tree. Export a Photoshop file of the image in psd version with no-colour image by using shortcut key (ctrl+shift+u), then in the distort filter, displace the psd file into the psd file you are working on. Then, adjust the filter with the blending option by double click the layers.
Tools used:
Distort filter: To distort the words in the shapes of the leaves
Blending Option: To adjust the filter applied.
Instruction updated:
"Type and Image using final extracted letter forms and integrate it with a related image mimicking a poster of a movie @1024px"
Finally, I saw the message updated by Mr Vinod on Facebook and found out I'm working in the wrong direction. Based on my extraction letterforms, Fig 7.5 suits the most. The same filter is applied and attempted with different layouts of the text.
Fig 8.7 Attempt 4 - "ABOXY", Week 4 (25.4.2023)
Fig 8.8 Attempt 5 - "ABOXY", Week 4 (25.4.2023)
Fig 8.9 'From Earth’ —Tree Series (@minhyunwoo_)
Fig 8.10 Attempt 6, Week 5 (1.5.2023)
Fig 8.11 Attempt 7, Week 5 (1.5.2023)
We then require to select a logo and place in the type and play image, the logo should not take away the attraction from the letterform. Black and white logo would be the best. Mr.Vinod also remind me to select one of the image as final submission. I have selected #Attempt 6 as my submission because attempt 7 have a extremely red root which having the same color with the letterform brings distraction.
Mr Vinod suggested that maybe fashion logo will be more suitable than sports logo such as Gucci. The logo bring a slightly imbalance into the image, so black and white colour of logo will not enlarge the imbalance.
Final Part 2: Type and Image
Fig 8.13 Final Type and Image - "ABOXY", JPEG, Week 7 (17.5.2023)
Fig 8.14 Final Type and Image - "ABOXY", PDF, Week 7 (17.5.2023)
Feedback
Week 1
General Feedback: For some typefaces that don’t have small capitals options, downside the point size of the typeface within 0.5 -1 pt. If have the options, then just use the lowercase. The information should align with the axis of the axial system leading point size of the information will be between 8 - 12 pt.
Week 2
General Feedback: Submission of the final JPEG image, does not exceed 1024px which is the maximum resolution accepted by the blogger. Submit in both JPEG and PDF with grid, guides or column for task 1.
Specific Feedback: The grid system does not achieve the requirement of the system and also the alignment of the information is not united. The information in the radial system is too spread, the heading layout can be in a circular shape. The transitional system is good with the banding, but the layout can be improved better. Totally tilted at 45 degrees should be avoided, that have shown in the bilateral system. The dilatation system has achieved the balance. The axial system does not really align with the axial.
Week 3
General Feedback: The reference typeface just a guide for the progression, the core characteristic should be remain. After you under understood the object's nature, you can start to abandon the unnecessary part.
Specific Feedback: The object's core characters should remain at the end. The curvature of letter the is interesting, and the suggestion of the characteristic also can include thick to thin. Maybe you should work backwards and improve the progression with the core characteristics.
Week 4
General Feedback: Update the blog with the newest feedback and finalize. Prepare Task 2 with multiple ideas, not multiple concepts.
Specific Feedback: The consistency in the letterforms can be seen, the core characteristic still does not develop well from the progression of extraction. the image selected also does not suit with extracted letterform.
Reflections
Experience
I felt a bit overloaded and stressed during this Task 1. The first part of the task, which I did find quite fun, was difficult in terms of how to bring out the ideas through the system. Due to the time constraint, I was not able to make good improvements and progress with the system that I had not mastered very well. In the second part of the task, as always, I was unable to grasp the relationship between shapes and fonts and was often in a blind spot. Fortunately, the critiques helped me to have a better understanding of what I was doing. This task 1, facilitated our learning to use 3 different software, for example. Finally, I find a way to create typography more consistently by using the pen tool and convert to outline stroke.
Observation
I learnt from this exercise that to design a good poster, it is important to ensure the flow of the reading sequence, balance, categorisation of primary and secondary messages, and the importance of colour and font choice. The eight systems that I learnt from this exercise are occasionally seen in everyday posters, so the exercise was designed to allow us to learn how to use them, as a poster can contain more than two systems, depending on the type of message.
Findings
Through my coursework and practice exercises, I gained a deeper understanding of the anatomy of letterforms, the principles of typography, and the role of typography in graphic design and visual communication. I also learned about the historical and cultural context of typography, as well as the latest trends and technologies in the field. Overall, I found that learning typography requires both technical skills and a creative mindset and that a solid foundation in typography.
Further Reading
Fig 9.1 The Elements of Typographic Style" by Robert Bringhurst (1996)
Bringhurst, R. (1996). The Elements of Typographic Style (2nd ed.). Vancouver: Hartley & Marks Publishers. (pp. 25-36).
Fig 9.2 The em space and the point size
Type is normally measured in picas and points, but the horizontal spacing is measured in ems, and the em is a sliding measure. One em is a distance equal to the type size. In 6 point type, an em is 6 points: nin 12 pt type it is 12 points. Thus a one-em space is proportionately the same in any size.
Spacing is essential for rapid reading of long, fundamentally meaningless strings, such as serial numbers, and it is helpful; even for shorter strings, such as phone numbers and dates. Number set in very short strings - triples or pairs - need not be letterspaced. This is the rationale behind the long standing European habit of setting phone numbers in the form 00 00 00 instead of 0 0 0-0 0 0 0.
Fig 9.4 custom setting roman numerals
When arabic numerals joined the roman alphabet, they too were given both lowercase and uppercase forms. Typographers call the former text figures, hanging figures, lowercase figures or old-style figures, and make a point of using them whenever the surrounding text is set in lowercase letters or small caps. the alternative forms are called titling figures, ranging figures, or lining figures, because they range or align with one another and with the upper case.













































































.jpeg)















Comments
Post a Comment