Formatting Tags

Adding formatting such as bold, italics, paragraphs and breaks.

Adding Paragraphs

The paragraph tag <p> marks a section of text as a paragraph.
Each paragraph is by default left justified and has a line break and space following the paragraph.

1. Add an opening paragraph tag <p> at the beginning of the first paragraph.

Each opening paragraph tag, <p>, needs a closing paragraph tag </p> at the end of the paragraph text.

2. Add a closing paragraph tag </p> after the sentence about the Postdamer Platz.

Notice: Any line breaks made in the code will not display in the browser unless there is a paragraph tag or break tag.

The break tag <br /> creates a line break at the place it is inserted.

The line break tag is a special case in that there is no opening and closing tag,
instead is combined into one tag with a space before the slash, <br />.

3. Add a break tag <br /> after an appropriate sentence. Preview the results in the browser.

Adding Headings

A heading is defined in XHTML as h1, h2, h3, h4, h5 and h6. H1 is the largest and h6 is the smallest, being that they flow in a logical order of hierarchy. If you follow the practices of logically adding headings in order, then your page will not only look professional but it will also be helpful to those with disabilities who use external devices to navigate on the internet.

1. Type the first level heading opening <h1> and closing tags </h1>.
2. In between the opening and closing h1 tags, type an appropriate heading, i.e. Visiting Berlin.

The text will be formatted as a heading by appearing in a larger and bolder font.

Adding Emphasis and Strong Tags

Individual words or phrases can be either bolded or italicized if need in an HTML document.

The emphasis tag <em> italicizes the text it surrounds and also vocally emphasizes the text when read by a screen reader such as JAWS. Use Italics sparingly as they are often difficult to read onscreen.

The strong tag <strong> bolds the text it surrounds and is also emphasized vocally when read by a screen reader.

1. Select some text you would like to emphasize and place an opening emphasis tag <em> before the text and a closing tag </em> after the text.

2. Select some text you would like to bold and place an opening strong tag <strong> before the text and a closing tag </strong> after the text.

3. Preview the results in the browser and notice what is italicized and what is bolded.

Adding a Second Level Heading

In HTML there are six levels of headings that can be used throughout a web document, but remember the order of the headings should be logical and follow a hierarchal pattern.

1. Type an appropriate heading, i.e. Places to Visit, surrounded by an opening heading 2 tag <h2> and followed by a closing heading 2 tag </h2>.

Previous Lesson: Previewing In a Browser Table of Contents Next Lesson: Creating Lists in HTML