Tighten line spacing with this keyboard shortcut
This is a technique that I learned as a technical writer when I needed to format text in a variety of ways in Help documents and guides. I showed this trick to a client recently and she’d never heard of it, so I realized that it was worth sharing with those of you designing your websites yourself.
In printed and online materials, line spacing is the blank space that separates lines of text. That space is also known as leading, so named for the strip of lead typographers of old would use to separate one line of text from the other when setting type manually.
Why you’ll need to tighten line spacing
Your website style is preset with a specific amount of line spacing automatically added when text in a paragraph wraps to the next line. There are times when you need to create short lines of text (like a list without bullets or numbers). In these cases, you want to force short lines of text to be shown as a list without creating a bulleted or numbered list or creating a new paragraph for each line.
Examples of tight line spacing on websites
Here are some typical scenarios where short lines of text and tighter line spacing are called for:
A stacked list of contact information, such as your business address and phone number
A stacked list of event information, such as date, time, and location
A stacked list of services information, such as service location, options, and price
A stacked list of schedule information, such as days of the week or times
A stacked paragraph where the second line needs to be separated from the first for emphasis
I encounter at least one of these scenarios with almost every website I design.
The trick to tightening line spacing
When you want to create a break between paragraphs, you press the Enter or Return key. However, to create tighter line spacing, you create what’s called a line break. Do this by placing the cursor at the point where you want the break created then hold the Shift key while pressing Enter.
When you use this technique, preview the text on both a computer and a cellphone to make sure the line break looks good on both displays.
Now that you know how to tighten line spacing with this keyboard trick, you’ll probably find many ways that it will come in handy for making short lines of text look better or fit better on your website.
