How to Embed Text in HTML

Preparing text to be embedded into a web-ready file invovles adding text tags.

Underneath all the flashy code and scripts, the basis of HTML is merely a text document with several cues, known as tags, that tell browsers how to format the page layout and text style. Designers must use text tags to tell browsers how to handle the embedded text, though learning and applying them is simple: Tags are contained within a set of < > brackets, with the command to start a text style and turn it off bounding the block of text you wish to modify. To start a text command, locate it within a tag; to turn it off, locate it in the same tag with a backslash. For example, <b> starts bold-faced text and </b> ends it. In the previous sentence, "starts bold-faced text and" would be bolded.

Instructions

Tagging the Text

1. Type the text as it would normally appear in printed form in a word processor or text editor. Spell check it and prepare it for publishing. Once your text is letter-perfect, begin inserting text tags into the document.

2. Mark each paragraph's beginning with a <p> tag, and mark its end with a </p> tag. This tag inserts a blank line between paragraphs.

3. Force single-line breaks in lists using the line-break <br /> tag.

4. Add bold text by surrounding bold-faced type with <b> to turn on bolding and </b> to turn it off.

5. Underline text if necessary with the <u> and </u> tags.

6. Insert italics using <i> and </i> tags.

7. Change the font color with the <font color="XXXX"> tag, where XXXXXX is either a common color name, such as red or blue, or a hexadecimal number. Revert text to the original color with the </font> tag.

8. Enlarge or shrink text size using the <font size="X"> tag, where X is the number of changes in font size you want to be increased or decreased. Precede X with a + sign to increase font size, or a - to decrease it. Type reverts to normal characteristics with a </font> tag.

9. Strike out text using the <strike> and </strike> tags.

Embedding the Text

1. Open the HTML document into which you wish to embed text in a text editor or word processor. A basic text editor, such as Notepad or Wordpad, usually works better than a more sophisticated word processor.

2. Scroll down to the point in the HTML document into which you want to embed the text. Locate the portion of the HTML document where the text will be inserted, and insert an extra carriage return or two to clear space. These extra carriage returns won't be read by browsers and won't show up in a HTML document.

3. Highlight the text you tagged in the previous section, and copy it using the CRTL + C keys.

4. Place your cursor into the spot you want the text to appear in your HTML document and paste it using the CTRL + V keys.

5. Save your HTML with the embedded text by pressing the CTRL + S keys.

Tips & Warnings

• Some word processors will insert tags to format text as it is in your document. Choose the "Save as HTML" option in the save menu for automatic tagging, then cut and paste the body of this document into the HTML document to embed the text.

References

• Mountain Dragon: Text Tag Examples
• W3 Schools: HTML Text Tag Formatting

Resources

• Dev X: HTML Tag Quick Reference Guide