Turning print into web content

If you've ever been annoyed by "garbage" characters or odd line breaks in website text, you can be sure no one has taken the time to make a proper transfer from print to web content.

I developed this cheat sheet to help my clients who want to take it on themselves to convert Microsoft Word documents into web-ready text.

HTML, the language of the web, does not handle symbols and special characters -- like em-dashes, degree symbols, and "curly" quotes -- very well. Often, these characters are rendered as garbage characters by web browsers. For example, you might see:

The chef?s assistant cooked the cr?me br?l?e at 400? F.

To minimize the problems caused by HTML’s limitations, follow these guidelines:

1. Turn off Auto-Formatting. When creating original web text In your word processor, turn off "smart quotes," automatic fractions, and similar "auto-formatting" options.

In older versions of Microsoft Word, these settings are found in the Tools menu under AutoCorrect Options. In Word 2007 and later, click on the Office button (in the upper left corner), then click on Word Options at the bottom of the window.

2. Avoid pasting Word text directly into a website content management tool. Word adds hidden formatting information that create huge problems. If your content manager's editor has a "paste text only" function, use that. If not, copy and paste your text into Notepad (on PCs), then copy and paste your text out of Notepad into your web pages. Once that's done, you can use your content manager's editing tool to create bold, italics, and other formating. 

3. Use special characters and symbols with caution. If  you must use accented characters, degree characters. registered trademark symbols, or other special characters, try some sample text on your site to see which characters reproduce properly. Many content management systems have editors that allow you to insert special symbols that will usually display correctly.

Be warned, however, not all browsers handle even correctly coded special characters, so avoid special characters if you can. See the chart below for some common substitutions for problemactic characters. 

4. Use true bullets. Create bulleted lists with Word's bullet tool rather than inserting bullet characters manually.

5. Follow web conventions:

  • Use left-aligned text, not justified or right-aligned
  • Create linespaces with the Enter key (not shift-Enter)
  • Put a linespace before and after each subhead
  • Use a linespace between each paragraph
  • Use a single space between sentences.

6. Common errors to avoid:

  • Don't use hyphenation to break a word over two lines. HTML doesn’t do hyphenation. (Turn off auto-hyphenation if you have it.)
  • Don't force line breaks by using the Enter key.
  • Don't indent the first line of paragraphs.
Chart of special character substitutions

Instead of . . . Use this Example
long (em) dash “ -- “ (two hyphens flanked by spaces) The leaves -- red, yellow, and green -- littered the ground.
degree symbol the word “degree(s)” Bake at 350 degrees F
“Curly” quotes "Straight" Quotes "Stop!"
“Curly“ apostrophes "Straight" apostrophes Won't you stay?
“True” fractions ( ½) standard numerals and the “/” character: 1/2, 2/3, etc.    Use hyphen with mixed numbers: 1-1/2
Ellipsis symbol Three periods with one space between each, and a space before and after. It’s . . . a baby!
Note: Most special characters can be avoided by following the instructions above for turning off “AutoFormat As You Type.”

Want to avoid the hassles of converting text? Contact me.

Return to list of services



Return to list of services

4 reasons to work
with Vercene Inc:

  1. You're in control.
  2. I help small staffs shine.
  3. Corporations are people, my friend.
  4. Compared to the cost of brand damage, my rates are a steal.

Let's connect 

Email: pkrantz@gmail.com

Tel: 515-321-3937

Address: 6118 Goodman Dr., Urbandale, IA  50322 (map)

Powerful Communications Blog

Follow me on Twitter

Facebook Funnies

Check  me out on LinkedIn and Manta