Today’s reader question is one I get often and maybe it’s something you’ve experienced yourself when you’ve written & published a new blog post.
Why does my blog post have big gaps between paragraphs?
The written word needs white space
When reading (whether that be physical printed material or digital print), we expect to see “gaps” or white space of a certain size in between words, sentences and paragraphs. These writing conventions are ingrained unconsciously from the time we learn to read as children.
When everything in writing looks as it should, we read freely and concentrate on what we are reading (this is what you want your readers to do).
When a piece of writing (e.g. your blog post) doesn’t look as it should because it has big gaps between paragraphs, the flow of reading is interrupted and the reader will either scan the page erratically, not really taking in what they’re reading or may even leave the page altogether.
To keep readers on your page, you need to make sure your writing looks as it’s expected to look.
Where do you write your articles?
Where you write your articles will impact how the finished article looks once published.
I write my articles directly into the post area on my WordPress websites – the visual tab is selected in my post editor.
This allows me to see approximately how my article looks. Other than colour and font styling (which I’ll only see once I publish my blog post), what you see as you type your post in the visual editor is an accurate representation of what the finished product will look like in terms of spacing.
Where the stumbling block comes in is when an article is written in word processing software like Microsoft Word, Google Docs or Pages and the text is then copied and pasted into the visual editor.
When I select the “text” tab this is what I should see for the words I’ve written for this article:
If I had written that same text into my word processing software of choice (I use Pages on my Mac) and then pasted it directly into the visual window of my post, it looks like this in the finished article:
And like this when I view it in the “text” window:
You can see that the pasted version, when published, has a heading that is styled differently and extra space between the paragraphs.
When you look at the two code views, you’ll see in the pasted version that around the heading there are the tags <b> </b> which just applies bold styling whereas in the directly typed version, the heading has the correct tags <h2> </h2> surrounding the heading text (which applies the styling defined in your website style sheet). You’ll also notice there are extra characters included between the paragraphs “ ” What this code does is insert an extra space into your writing and that code has come from your word processing software.
When you type in your word processing software, it’s creating hidden code that you don’t see, to style the text you’re typing. When you copy directly from your word processing software and paste that directly into the WordPress dashboard visual editor, the hidden styling comes across and conflicts/over-rides the styling of your website.
In the example I’ve shown, the extra styling is fairly easy to pick out and delete if necessary. Depending on how much you’ve styled the text in Word, you could see errors such as:
- embedded styles that alter the colour of the text,
- hyphen styling that WordPress doesn’t recognise (which will either disappear altogether or be replaced with an empty box,
- other characters (like an ampersand (&) may also be replaced with an empty bounded box,
- I’ve even seen an entire extra style sheet inserted in a blog post that impacted the styling of the website’s navigation on that blog post page.
How to paste text from your word processing software without the extra characters
To get rid of this extra styling, there is a handy little button located in the visual editor toolbar:
Do you see in the second row the two little clipboards with the “T” and “W”? If you don’t see the second row, just click on the “Show/Hide Kitchen Sink” button at the right end of the first row. When you click on either of those buttons, you’ll get an empty text box pop up where you can paste in your text.
I’ve found the “T” button works best – if you uncheck the box “keep line breaks”, all the styling added by the word processor will be stripped out and you’ll be left with plain text. All you need to do then is apply headings and add paragraph spaces where necessary.
I know adding the styling back in (when you’ve already typed it & styled it in Word) seems like extra work, but for the sake of having a finished blog post that’s easy for your visitor to read, and consistent with the rest of your site, I think it’s well worth it.