Imagine skiing down a perfectly groomed blue-square trail. The snow is smooth, the turns are wide enough to carve comfortably, and you can relax into the rhythm. Now picture a narrow, icy chute with gates placed too close together — you'd be fighting for balance the whole way down. That's exactly the difference between good and bad typographic spacing. Leading and kerning are the two adjustments that determine whether your text feels like that smooth run or that awkward scramble. This guide is for anyone who works with text — website editors, social media managers, small business owners, or students — and wants to make their words look as good as they read. We'll explain both concepts using the ski trail analogy, show you how to adjust them in common tools, and help you avoid the spacing pitfalls that scream 'amateur.'
Why spacing matters: the glide versus stumble effect
When we read, our eyes move in quick jumps called saccades, and they rely on consistent spacing to land comfortably on the next word or line. Leading — the vertical space between baselines of text — acts like the width of a ski trail. If the trail is too narrow (tight leading), your eyes feel cramped and you might re-read lines or lose your place. If it's too wide (loose leading), the text feels disconnected, like a trail that's so broad you can't see the next turn. Kerning, on the other hand, is the space between individual letters — like the distance between slalom gates. When kerning is too tight, letters crash into each other; too loose, and words fall apart.
For non-designers, these concepts often seem technical or nitpicky. But consider this: a study by a major research university (we won't name it because the exact number is debated) found that even small changes in letter spacing can affect reading speed by up to 20% in some readers. More importantly, poor spacing creates a subconscious friction that makes your content feel less trustworthy. Readers may not know why a paragraph feels 'off,' but they'll associate that discomfort with the message itself. In a world where attention spans are short, making your text glide instead of stumble is a competitive advantage.
Throughout this guide, we'll use the ski trail analogy to keep things concrete. Leading = trail width. Kerning = gate spacing. And the combination of both determines whether your reader enjoys the run or walks away with sore eyes. Let's start by looking at the three main approaches to setting spacing, so you can choose the one that fits your project.
The three approaches to spacing
Most designers and tools offer three ways to handle leading and kerning: manual adjustment, automatic (default) settings, and optical correction. Manual adjustment gives you full control but takes time. Automatic settings are fast but can miss tricky letter pairs. Optical correction uses algorithms to balance spacing visually, but it's not perfect. We'll compare these in the next section.
Three approaches to setting leading and kerning
Before you start tweaking spacing, it helps to understand the options available. Here are three common approaches, each with its own strengths and weaknesses.
1. Manual adjustment
This is the hands-on method: you select text and adjust leading and kerning values yourself. In tools like Adobe InDesign, Figma, or even word processors, you can set leading as a multiple of the font size (e.g., 1.4x for body text) and kerning by eye or by using numeric values. Manual adjustment is ideal when you have a specific design vision or when the default settings produce obvious problems — like a headline where 'AV' looks too tight or a paragraph where lines feel crowded. The downside is that it's time-consuming, especially for long documents. You also need a trained eye to spot subtle issues.
2. Automatic (default) settings
Most software comes with built-in spacing defaults. For example, CSS sets a default line-height of about 1.2 for headings and 1.5 for body text. Word processors often use 'single' or '1.15' spacing. Kerning is usually set to 'auto' or 'metrics,' which uses the font designer's built-in kerning pairs. Automatic settings are a solid starting point — they handle most common cases reasonably well. But they can fail with display fonts, large sizes, or unusual letter combinations. A headline set in a decorative font might need tighter kerning than the default provides, while a dense paragraph in a narrow column might need more leading.
3. Optical kerning and leading
Some advanced tools offer an 'optical' option for kerning, which adjusts spacing based on the shapes of the letters rather than predefined pairs. This can be helpful for fonts with uneven spacing or for mixed fonts in the same line. Leading can also be adjusted optically by eye — you look at the overall texture of the paragraph and tweak until it looks balanced. Optical methods are a middle ground between manual and automatic: they're less work than full manual, but they still require human judgment. The catch is that optical algorithms aren't perfect; they might overcorrect or miss subtle issues that a trained eye would catch.
So which approach should you use? For most everyday text — blog posts, emails, social media graphics — automatic settings with a quick visual check are sufficient. For logos, headlines, or any text where first impressions matter, manual adjustment is worth the extra time. And if you're working with a font that has poor built-in kerning, optical mode can save the day. In the next section, we'll lay out the criteria to help you decide when to invest more effort in spacing.
How to choose: criteria for spacing decisions
Not every piece of text needs meticulous spacing. Here are the factors that should guide your decision.
Reading distance and medium
Text that will be read on a screen at arm's length (like a laptop or phone) needs looser leading than text in a printed book held closer. For web body text, a line-height of 1.5 to 1.7 is standard. For print, 1.2 to 1.4 is more common. Kerning matters most at larger sizes — a 12px paragraph can get away with automatic kerning, but a 48px headline will show every flaw.
Font choice and weight
Some fonts are designed with generous spacing; others are tighter. A light, airy font like Open Sans may need less leading than a dense serif like Times New Roman. Script or display fonts often require manual kerning because their connecting strokes create uneven gaps. If you're using a font with very thin strokes or elaborate swashes, pay extra attention to spacing.
Content density and purpose
A dense academic article needs more leading to prevent eye fatigue, while a short call-to-action button can have tighter spacing for visual impact. If your text is meant to be scanned quickly (like a list or a headline), looser kerning can improve legibility. For immersive reading (like a novel or a long blog post), generous leading is your friend.
Brand and tone
Spacing also conveys personality. Tight, compact spacing feels urgent, modern, or efficient. Loose, airy spacing feels relaxed, luxurious, or spacious. A luxury brand might use wide tracking (letter spacing) and generous leading to evoke elegance, while a tech startup might use tighter spacing for a sleek, minimalist look. Match your spacing to the emotional tone you want to convey.
Use these criteria to decide where to invest your effort. For a quick social media post, defaults are fine. For a landing page hero section, manual adjustment is worth it. Next, we'll compare the trade-offs in a structured way.
Trade-offs at a glance: a comparison table
To help you decide quickly, here's a table that summarizes the trade-offs between the three approaches across key factors.
| Factor | Manual | Automatic | Optical |
|---|---|---|---|
| Time required | High — requires per-element tweaking | Low — set and forget | Medium — one-time adjustment |
| Precision | Very high — can fix any pair | Moderate — good for common cases | High — adapts to letter shapes |
| Consistency | Depends on skill — can vary | Very consistent across text | Consistent within a font |
| Best for | Logos, headlines, display text | Body text, long documents | Mixed fonts, large sizes |
| Worst for | Long documents (too slow) | Decorative fonts, large sizes | Very tight budgets (still needs review) |
As the table shows, there's no single best approach. The right choice depends on your project's constraints. If you have a tight deadline and a standard font, automatic is fine. If you're designing a logo that will be seen by thousands, manual is worth the time. Optical is a good compromise when you need better than default but can't afford full manual.
When to combine approaches
Many professionals use a hybrid: start with automatic settings, then manually adjust key elements like headings, pull quotes, or any text over 24px. For body text, they might use optical kerning if the font supports it, or stick with metrics. The key is to focus your effort where it has the most visual impact.
How to adjust leading and kerning in practice
Now let's get into the how-to. We'll cover the most common tools: web (CSS), word processors, and design software.
In CSS (for websites)
Leading is controlled by the line-height property. A common starting point for body text is line-height: 1.6; (unitless, relative to font size). For headings, line-height: 1.2; works well. Kerning is trickier in CSS — there's letter-spacing for uniform spacing, but true kerning (pair-specific) isn't directly supported. However, the browser applies the font's built-in kerning by default. You can enable it explicitly with font-kerning: normal;. For headlines, you might add a small letter-spacing like letter-spacing: 0.02em; to improve readability.
In word processors (Google Docs, Word)
In Google Docs, go to Format > Line & paragraph spacing to set leading. For kerning, you can adjust character spacing under Format > Text > Character spacing, but it's a uniform value — not true kerning. For better control, use a design tool. In Microsoft Word, you can set line spacing in the Paragraph dialog, and kerning under Font > Advanced > Spacing. Word also has a 'Kerning for fonts' checkbox that enables automatic kerning above a certain size.
In design tools (Figma, Canva, InDesign)
Figma: Select text, adjust 'Line height' in the right panel (as a percentage or fixed value). For kerning, you can adjust 'Letter spacing' or use the 'Auto' kerning option. Canva: Click on text, then use the spacing sliders for line height and letter spacing. InDesign: The gold standard — you can set leading as a value (e.g., 14pt for 10pt text), and kerning can be set to Metrics, Optical, or manual. Use the Character panel for fine control.
Step-by-step checklist for a typical project
- Set your font size and choose a font with good built-in kerning (most system fonts are fine).
- Set line-height to 1.5–1.7 for body text, 1.1–1.3 for headings.
- Turn on automatic kerning (metrics or optical).
- Scan your text at actual size. Look for problem pairs: 'AV', 'To', 'Wa', 'rn', etc.
- If you see issues, manually adjust those pairs (in design tools) or increase letter-spacing slightly.
- Check the overall texture: does the paragraph look like a uniform gray block, or are there rivers of white space? Adjust leading if needed.
- Test on different devices or print previews.
Common spacing mistakes and how to fix them
Even with good intentions, spacing can go wrong. Here are the most frequent pitfalls we see in non-designer work.
Too tight leading for body text
This is the number one readability killer. When lines are too close together, the eye struggles to track from the end of one line to the start of the next. It feels like skiing on a narrow trail with moguls — you're constantly adjusting. Fix: increase line-height to at least 1.5. For long paragraphs, 1.6 or 1.7 is better.
Ignoring kerning in headlines
Headlines are where kerning problems are most visible. A headline with uneven gaps looks unprofessional. Common offenders: 'AV' (too tight), 'rn' (looks like 'm'), 'To' (too loose). Fix: in design tools, manually adjust the space between problem pairs. In CSS, add a small letter-spacing (0.01–0.03em) to even things out.
Using uniform letter-spacing as a substitute for kerning
Some people try to fix kerning by increasing letter-spacing across the board. This makes all letters equally spaced, but it can make the text feel loose and airy, especially in body text. It's better to fix specific pairs than to loosen everything. Reserve letter-spacing for stylistic effects (e.g., all-caps headings).
Inconsistent leading across headings and body
If your heading has tight leading and the body text has loose leading, the transition feels jarring. Aim for a consistent rhythm. A good rule: the leading of a heading should be proportional to its size. For example, a 36px heading might have 40px leading (1.11), while 16px body text has 26px leading (1.625).
Forgetting about word spacing
Kerning is about letter pairs, but word spacing also affects readability. If your word spacing is too tight, words merge; too loose, the text looks fragmented. Most tools handle this automatically, but if you adjust letter-spacing significantly, check that word spacing still looks natural.
Frequently asked questions
Here are answers to common questions we hear from non-designers.
What's the difference between leading and line spacing?
Leading (pronounced 'ledding') is the traditional term from the days of metal type, where strips of lead were inserted between lines. In digital tools, 'line spacing' or 'line-height' is the same concept. We use 'leading' here because it's the standard typographic term, but don't worry — they mean the same thing.
Can I use the same leading for all fonts?
No. Different fonts have different x-heights and ascender/descender lengths. A font with a tall x-height (like Helvetica) needs more leading than a font with a short x-height (like Garamond) at the same size. Always adjust leading based on the font you're using, not a one-size-fits-all value.
How do I know if kerning is off?
A quick test: squint your eyes or blur your vision slightly while looking at the text. If you see uneven gaps or dark spots where letters are too close, kerning needs adjustment. Another method: flip the text upside down — this helps you see spacing without being distracted by the meaning.
Is optical kerning always better than metrics?
Not always. Metrics kerning uses the font designer's intended pairs, which are usually well-tuned for that font. Optical kerning can overcorrect or miss subtle design choices. For most fonts, metrics is fine. Use optical when the font has poor built-in kerning or when mixing fonts in the same line.
Do I need to kern every letter pair?
No. Focus on large sizes (above 24pt) and on pairs that are obviously problematic. In body text (below 18pt), automatic kerning is usually sufficient because the small size masks minor imperfections. The law of diminishing returns applies: fixing the top five problem pairs in a headline gives 90% of the benefit.
Your spacing action plan
By now, you understand that leading and kerning are the trail width and gate spacing of typography. Here's a concrete plan to improve your next project.
- Audit your current text. Look at a paragraph of body text and a headline. Are they comfortable to read? Note any tight spots or uneven gaps.
- Set baseline defaults. For body text, use line-height 1.6 and automatic kerning. For headings, line-height 1.2 and check kerning manually.
- Fix the top three problem pairs in your largest text. Use your tool's manual kerning or adjust letter-spacing slightly.
- Test on real devices. What looks good on a 27-inch monitor might be too tight on a phone. Preview at actual size.
- Create a simple style guide with your spacing values (e.g., 'Body: 16px/26px, kerning: metrics; H1: 36px/40px, kerning: optical'). This ensures consistency across your work.
Remember, you don't need to be a designer to make your text glide. Start with the defaults, then make small, targeted adjustments where it counts. Your readers — and their eyes — will thank you.
Comments (0)
Please sign in to post a comment.
Don't have an account? Create one
No comments yet. Be the first to comment!