There’s one tweak you can make to your blog post formatting that makes a bigger difference than you’d expect.
It’s not font size, line height, or even paragraph spacing. It’s the margin above your headings.
Open a blog post on your site and look at how much space you have above an H2 or H3. In most cases, the gap above the heading looks roughly the same as the gap below it. That might feel balanced and natural, but it’s actually creating a readability problem that works against you.
When people read a blog post, they’re rarely going word by word — they scan first, looking for visual signals that tell them about the content. Headings are those signals, and they exist to tell the reader that one idea has finished and a new one is beginning, but when the space above a heading matches the space below it, that signal weakens.
The heading ends up sitting between two blocks of text instead of clearly belonging to the section it’s meant to introduce.
Readers don’t consciously notice this, but you do recognize that the post is harder to get through than it should be.
The fix? Add extra margin above all your headings.
A quick way to accomplish this is to give the container that holds your blog content a CSS class — something even like .blog-content.
Then, write some CSS to override the default margins, such as:
.blog-content h2 {margin-top:1.5em;}
This way, only H2 headings in your blog posts are affected (and not your headings site-wide).
It’ll look like too much the first time you preview it, but scan the post and you’ll notice how much easier it is to follow. The sections feel more distinct and the post feels easier to digest even though nothing about the words changed.
Design to Dollars Takeaway
Good spacing is rarely ever about making things look pretty. It’s about giving your reader’s eye the right cues at the right time. When your headings have room to breathe above them, your content becomes easier to scan, easier to follow, and easier to trust.
