Are you curious about the concept of leading in typography? Have you ever wondered why it’s such an important consideration in typography design?
In this article, we’ll explore the meaning of leading and its significance in typography.
Whether you’re a graphic designer, a typography enthusiast, or simply interested in the world of design, this article will provide you with a comprehensive understanding of leading and its impact on typography.
So if you’re ready to dive into the world of typography and learn about the importance of leading, read on!
Let’s dive in!
What is Leading in Typography?
Leading is a distance between two lines of text, and it’s important because it helps to polish your content piece and make it more successful. Specifically, it is the line spacing in the vertical direction. It’s also called the distance that a line has from another line vertically.
Leading is a term you’ll often hear in typography along with kerning and line height. However, to better understand its use, you need to know the difference between leading and kerning and leading and line height.
Leading is a great tool to make your content stand out and engage readers more since it improves legibility.
While you usually don’t need exact measurements in leading, there is still a way to calculate leading based on the font size of your text.
When we write a line with words, there is a baseline where all the letters and characters sit.
The leading in typography starts from this baseline.
For example, in the above line, all the letters sit on an invisible baseline.
However, some letters like t and g fall above or below the invisible lines that hold the other letters. One of these lines is in the baseline, and the other is above the letters, but it’s not a baseline.
Instead, it’s the x-height – the height of lower-case letters.
For example, in abcdefgh, there is a base starting below a, not g, and the x-height is above a, not for h. In the example, g is called a descender – letters that have a part that falls below the baseline – and f and h are ascenders, whose parts go above the x-height.
These ascenders and descenders need to be taken into consideration when we calculate leading in typography.
The correct use of leading helps make the text more readable, especially on digital media, making the project look more polished and professional.
Examples of Leading
Here are some examples of leading (vertical spacing between lines) in typography:
1. Single Spacing
In a single-spaced document, there is minimal space between lines of text.
This is common in many novels and standard business documents where maximizing content on the page is important.
This is an example of single-spaced text. There is minimal space between the lines.
2. Double Spacing
Double spacing provides more vertical space between lines, making the text easier to read and allowing for notes or comments to be added between lines.
This is an example of double-spaced text. There is more space between the lines, which improves readability and leaves room for annotations.
3. 1.5 Line Spacing
This is a common choice for many documents because it strikes a balance between single spacing and double spacing, offering better readability while conserving space.
This is an example of text with 1.5 line spacing. It provides a bit more room between lines compared to single spacing, which enhances readability without using too much space.
4. Leading for Headings
Leading can also be adjusted for headings or titles to create a specific visual hierarchy.
For instance, you might use tighter leading for a heading to make it stand out.
**Title** This is the content of the document with standard leading.
5. Leading for Poetry
Poetry often uses varying leading to create unique visual effects, emphasizing line breaks and the rhythm of the poem.
Roses are red, Violets are blue, Sugar is sweet, And so are you.
Common Leading Adjustments
There are three main terms associated with leading: normal leading, positive leading, and negative leading.
Each of these concepts relates to how the lines of text are spaced in relation to the default or normal leading.
We write leading with the typeface size. For example, look at Arial 12/14.
The first number is the font size, and the second number is the leading point size.
In most design software such as Illustrator and InDesign, the default leading size is two points greater than the font size.
There are three terms you need to know in leading: Normal, Positive, and Negative leading.
- Normal Leading: The leading is the same as the font size, for example, Arial 12/12.
- Positive Leading: The leading is greater than the font size, for example, Arial 12/16.
- Negative Leading: The leading is less than the font size, for example, Arial 12/10.
1. Normal Leading
Normal leading, also known as “default leading” or “standard leading,” is the baseline line spacing used in typography without any adjustments.
It typically provides enough space between lines to ensure readability and legibility, and it’s determined by the typeface and font size being used.
Normal leading varies depending on the typeface and design choices but is usually set to a comfortable and visually pleasing value by default.
2. Positive Leading
Positive leading refers to increasing the vertical space between lines of text beyond the normal or default leading.
This can be done for various reasons, such as improving readability, accommodating larger font sizes, or enhancing the overall aesthetic of the text.
Positive leading can make the text appear less crowded and is often used in documents where readability is a priority.
For example, if you have a paragraph of text with a 12-point font size and normal leading, you might increase the leading to 14 points to create positive leading.
3. Negative Leading
Negative leading, on the other hand, involves reducing the vertical space between lines of text below the normal leading.
This is a less common practice and is typically used sparingly for specific design effects.
Negative leading can create a more compact appearance, but it should be used cautiously to avoid making the text difficult to read or cluttered.
For example, if you have a paragraph of text with a 12-point font size and normal leading, you might decrease the leading to 10 points to create negative leading.
Positive and normal leading work well in body text, but the negative leading works well with headings in all caps.
Likewise, long blocks of text will require more leading, Sans Serif fonts, and bolded typeface.
Small-size fonts, around 8pt, also need extra or more leading. Also, use extra leading in typography if your background is black. It will increase legibility.
Moreover, In MS Word, you can access the leading or line spacing section by right-clicking your Word document. Then, click the Line & Paragraph Spacing option.
The line spacing options in Word are Single (equals to 117% of the font size), 1.5 lines (175% of font size), and Double (233% of font size) – they are way out of the optimal range, so avoid them.
Multiple is the only one that works but select 1.03 to 1.24 leading there, not 1.20 to 1.45. At least is another option but avoid it since it allows Word to change the leading automatically.
It’s best to adjust the leading based on your content type and where it’s used, for example, is it a heading or a body text, etc.
Why is Leading Important?
Leading in typography is essential because it can help to make the text more legible and easier to read.
However, the lines may overlap if the leading is too short, and the text will become tangled.
In the same way, if the leading is too much, the lines may look too far apart – too much space will be left unfilled, which isn’t good visually. Both of these are extremes detract readers from your work.
The success of your work depends on the leading, too, along with font, color, and size.
In software like MS Word, the default leading is usually fine, but in web pages, it’s usually best to increase it since, on the screen, tight spacing can irritate your readers’ eyes.
Likewise, your content won’t be a success if no one can read it.
Why is it Called Leading in Typography?
Long ago, when digital printing and the web were unimaginable, people used to typeset by hand.
Typesetting refers to composing words or text with physical letters and symbols. In those days, typography was composed in a typeset using hand.
Metal or wood was used to make characters, and often lead was used to separate text blocks from each other. Old print shops used lead strips between lines of text to make the vertical distance more.
It allowed the text or the design to have more breathing room and look more open. Since then, the term lead stayed, and even now, the line spacing is called leading, pronounced as ledding, not leading.
It’s why leading is called leading in typography.
Leading vs. Kerning
Leading in typography and kerning are terms we often hear in typography and typeface, and they refer to the spacing.
But, here is where the similarities end. Kerning and leading are both different processes related to adjusting different spacing types, and they help polish the design.
Check out the difference table here to get a quick overview of the differences:
|Vertical spacing between lines of text||Horizontal adjustment of space between individual characters|
|Ensures proper line spacing for readability||Improves visual balance and character spacing|
|Applied to entire lines or paragraphs||Applied to specific character pairs|
|Typically measured in points (e.g., 12pt leading)||No specific unit; usually expressed as positive or negative values|
|Adjusted for an entire paragraph or text block||Adjusted for specific character pairs in a word or line|
|Too tight leading can make text appear crowded; too loose leading can make it disjointed||Inconsistent or inadequate kerning can lead to awkward gaps or collisions between characters|
|Vertical spacing between lines in a paragraph||Horizontal spacing between individual characters in a word or line|
|In a paragraph, setting 14pt leading between lines||Adjusting the kerning between “A” and “V” in the word “AVOID”|
|Crucial for overall text legibility and readability||Important for achieving uniform and aesthetically pleasing character spacing|
|Applied to entire blocks of text||Applied to specific character pairs in typography and design|
Kerning is the space between individual characters while leading is the space between lines of content, and it starts from a baseline.
They are very different from each other, but they both work to improve the legibility of a piece of content and graphics by adjusting the spacing.
Too tight or big spaces between lines can make reading the content and understanding the message difficult, and that’s why leading in typography is used.
In the same way, if the spacing between the letters is too tight or too loose, it can hinder reading – kerning helps here.
Kerning is the spacing between different characters, and each letter takes up a different amount of space, and we can adjust where the spacing seems too loose or too tight.
On the other hand, leading is the line spacing, and we need to take the ascender, descenders, x-height, and baseline into account.
Leading vs. Line Height
You might be thinking, aren’t leading and line height the same? Leading and line height are both different.
Line height is different from leading even though some consider Line-height as the same as leading in typography.
Check out the difference table here to get a quick overview of the differences:
|Vertical space between lines of text||Vertical space within a single line of text|
|Ensures proper line spacing for readability||Defines the height of a line of text, including character height and spacing|
|Applied to entire lines or paragraphs||Applied to individual lines or specific elements within a line|
|Typically measured in points (e.g., 12pt leading)||Can be measured using various units, including ems, pixels, or percentages|
|Adjusted for an entire paragraph or text block||Adjusted for specific text elements, such as headings, paragraphs, or individual lines|
|Too tight leading can make text appear crowded; too loose leading can make it disjointed||Incorrect line-height can lead to text that looks cramped or spaced too far apart|
|Vertical spacing between lines in a paragraph||Vertical spacing within a single line or block of text|
|Setting 14pt leading between lines in a paragraph||Defining a line-height of 1.5 for a paragraph of text|
|Crucial for overall text legibility and readability||Important for controlling the vertical spacing and aesthetics within a line of text|
|Applied to entire blocks of text||Applied to specific text elements within a block of text, such as headings, paragraphs, or lists|
Another way to look at line height is that it adds space below and above the text, and it’s primarily a CSS property.
At the default setting, the line height is around 20% bigger than your font’s size, e.g., if the font is 14px, the line height should be 16.8px.
Here the line height is 1.2 times larger than the font size.
Line height can even be 130% or 150% larger than the font size, but it depends on what you’re using it for. Line height is calculated differently for different designs.
In web paging, you can even go for 200% – 2 times the font size. On the other hand, designers often use a line height of 1.5 times greater than the font size to start with – 150% of the font size – and you can change the ratio according to the design and the font size.
Leading is calculated a bit differently, but the math behind it is the same.
If you want to learn more about line height, we recommend this video by Full Stack Coding Tutorials:
How is Leading Calculated?
Similar to line height, leading is calculated per the font size of your content or design. Moreover, we measure leading in typography in pixels.
While the leading can vary from project to project, the optimal leading is usually between 120%-145% of the font size. In other words, 1.2 to 1.45 times the font size works well for most content.
On a digital screen, 110% or less like 90% of the font size will make the text look too tight and hinder legibility. Similarly, leading of about 160% or 170% will make the text look very loose.
However, the results can be different for the same leading values since other software use math differently. Also, for different fonts, the line spacing is liable to change.
So, for example, it’s less for small-size fonts and more for larger fonts.
Like other software, Photoshop has a default setting for leading for about 50px for a 40px size font. Leading is calculated by multiplying 125% with 40px.
You can increase or decrease the leading using the Leading Setting.
MS Word, like other text editors, uses 1.2 times the font size as the default setting for the leading, but it can be a bit tight for the web. Leading values closer to 1.45 work better for digital media.
To see leading be adjusted in real time, we recommend this video by Jason Ford:
Leading in typography is an effective tool to increase the space between the lines of text and make your content easier to read on-screen.
You can calculate the leading using basic math and estimated optimal leading percentages.
Leading is necessary, and you need to use it to polish your content correctly. If you don’t use it correctly, it can destroy the legibility and decrease traffic to your website.
Usually, 150% to 200% of the font size is a leading size for web paging, and you should adjust based on the font size, font type, and background color – with black, you need more leading than white.
Is leading the same as line height?
While leading and line height are closely related, they are not exactly the same. Leading refers to the vertical distance between lines of type, while line height is the total height of a line of type, including the space above and below the letters themselves.
Why is it called leading in typography?
The term “leading” in typography comes from the early days of printing, when strips of lead were used to separate lines of type. The thickness of the lead strips determined the amount of space between lines, and the term “leading” stuck even after other materials replaced lead.
Nate Torres is an entrepreneur, growth marketer, and photographer and writes mostly on those topics. Nate runs his own professional photography business and photography blog called Nate Torres Photography. Nate enjoys learning about new digital marketing strategy and new ways to think creatively. He is also a photography speaker and author on Photofocus.