Copying and Pasting from Word to the Web

Advice: do not copy and paste directly from Word

It is not suggested to do a direct copy and paste from a Word document (.docx) file to a Web Content builder (like My Studies, Edublogs, etc).

There are various tools and ways to get around this issue, and this guide will cover My Studies as an example, but the theory and practice are the same for Edublogs, and other web-content creation tools.

I don’t need the why, just tell me how!

Why?

Microsoft Word has a lot of built-in formatting ‘code’ contained within it, that confuses Website builders because it so closely resembles html (Hypertext Markup Language) which is the code the entire world-wide-web is built upon.

Extraneous and embarrassing code

If one copies (Ctrl-C on windows or CMD-C on Mac) text directly from a Word document:

My studies (and other editors) may ask you if you wish to keep formatting or remove it.

If you choose Keep Formatting rather than removing it, the text will actually contain a large amount of ‘code’ that is invisible to you, but not to the internet.

Here’s what this looks like in the content editor window… Not bad right?

Lets click on the “Source Code” button in the editor menu and see what it looks like.

Here’s the source code:

What an absolute mess! This will really play-havoc with the announcement when it gets sent to students through their mobile phones, or tablets.. And for that matter things like Chrome Books, etc will ALSO have a problem ‘reading’ this code.

If you choose “Remove Formatting” when first pasting, or use the remove-formatting button in the menu

The source code ‘looks’ a bit better, but there’s still extraneous code in the sample. This can STILL cause problems.

Best Practice for Copying and Pasting into My Studies

This will take a bit longer, but will ensure the students looking at the entry have a better experience.

Copy the Word text into your computer’s clipboard with Ctrl-C on Windows or Cmd-C on a Mac, or right-click and choose Copy from the drop-down menu.

Go to the Content Editor window and click on the Source Code Button.

Paste (right-click paste or Ctrl-V on Windows, Cmd-V on Mac) in the blank window, and click Save

Now you will, admittedly need to FORMAT the text manually.

Re-arrange the text by headline – sub-heading and paragraph (body) text first.

Then Select the headline and make it a heading

Select the sub-title and choose sub-heading 1

And for the bulleted list… Select the text in the editor, and click on the Bulleted-list button.

Even not knowing about html code, a viewer can see (from the source code) that there’s a lot less confusing stuff happening in the window.

One can now run the ‘Accessibility Checker’ on the text in the editor.

Good Accessibility!

Now you can submit, and know that your students will all have an equally successful time reading the text online and on their devices.