Why You Should Not Copy and Paste from Word
In order to format the text in Word, i.e. make it bold, underline etc. some special code is required for the software to format the text like this.
The user cannot see this code, it is “behind the scenes”. The code used is not standard HTML but Microsoft Word coding that will not be interpreted by many popular browsers (including Microsoft Internet Explorer!).
When you copy and paste content from Word into a website content manager that code can be copied over with the content (behind the scenes) and inserted onto the web page too.
It may look OK on some browsers, or even in the content manager, but behind the scenes there is some non-standard code that will break the website and it may not display correctly.
Therefore content must never be directly copied and pasted from Word to the content manager at all.
I always say in order to get the best code and layout for your content managed page you should format the content within the content manager itself.
So do not rely on copying the content and format from Word, just paste into the editor plain text and then format it.
A little tip to do this is open up your favorite Text editor (Notepad, Notepad++, Textpad etc.) then copy the content from Word into the text editor. Text editors do not have formatting like Word, they can only show plain text, so when you copy and paste all the formatting code behind the scenes is stripped out and you are left with plain text only.
You may need to re-enter line breaks, but line breaks usually copy across OK.
Once you have the text in the editor as plain text, then you can copy and paste this text into the content manager.
The copied text is plain text so no non-standard code will be copied across. All your formatting in Word will be stripped out, so you then need to use the content manager to re-format the content such as any headings, bold text, hyperlinks etc. and re-insert any images.
An Easier Way
Many website content manager systems (like Joomla and WordPress for example) use page editors that include a “Paste from Word” and a “Paste as Plain Text” button.
Using these buttons will make it easier to copy your text across.
Using the “Paste as Plain Text” button will allow you to paste your content from Word into the editor as plain text, i.e. you will get the same result as above but skip the need to use a text editor.
The “Paste from Word” button tries to help one step further. This button allows you to paste your Word content but tries to keep the Word formatting by changing the Microsoft code to HTML. This is the preferred method if it works.
Summary
So in summary, first try the Paste from Word button if you have it, and if that fails try the Paste as Plain Text button.
If you have neither of these buttons use a text editor to copy and paste Word content into first.
What Copying and Pasting from MS Word Does to Your Blog
It seems like an innocent enough action: copy from Word and paste into your blog. But if you’ve ever taken a look at the HTML of that freshly pasted content, you’ll notice a lot of excessive, non-productive code (aka “junk code” or “bloated code”).
Take a look at this example…
Here’s a screenshot of a few paragraphs typed into MS Word. As you can see, the formatting is pretty simple. There’s a header, some basic paragraph text, and a secondary subheader to accentuate text. On the top there is the VISUAL VIEW, below that you can see the TEXT VIEW which reveals a lot of bloated (un-necessary) Code.
Why You Should Care: SEO Impacts
It’s pretty easy to see that the second HTML screenshot is a lot easier to read. The interesting thing here is… the second version isn’t just easier for people to read, but it’s a lot easier for search engines to read too!
So, if you want to do everything you can to improve blog post SEO, you’ll want to remove the excess bloat code too. (Or be careful not to add it in the first place! More on that below.)
Why You Should Care: User Experience (UX)
Have you ever made a few minor edits to your blog (say, deleting an extra paragraph space) only to have that small gesture make a huge impact on your paragraph style? Maybe the entire font size of that paragraph just changed. Or perhaps the alignment is thrown off. And no matter how many times you try to adjust the font size or paragraph alignment, things just won’t change!
A lot of those challenges are attributable to the bloat code that was copied from your word processor. Along with all of that junk code came a lot of inline styles, or code that instructs your web browser how to present your content. So when you try to force even more inline styles into an already crowded space, things can get messy pretty quickly. (You should also know that inline styles will override the global CSS styles that your website uses. These global CSS styles are important because they reinforce a consistent look-and-feel across your site as well as overall brand alignment.)
After much fumbling around with the WYSIWYG editor, you may be able to force things into getting “close enough.” And sometimes, “close enough” is what’s saving you from pulling out your hair or from having an Office Space moment with your laptop.
But, when you leave the junk code in place along with those paragraphs that just won’t resize, you’re at risk of compromising your website visitors’ overall user experience (UX). A blog post with odd text sizes and off-brand styles will distract your site visitors from their primary experience. Additionally, these style issues can reflect poorly on your overall brand by painting a picture of unprofessionalism.