HTML Course 4. Text and basic content

HTML Course 4: Text and Basic Content

In this module we explore how to structure and mark up text in HTML. You will learn about
paragraphs, headings, lists, inline semantics, quotations, and other foundational elements that
help you present written content meaningfully.

1. Headings

Headings <h1> through <h6> define document structure and
outline hierarchy. Use them in descending order to create a logical outline.


Site Title

Introduction

Background

2. Paragraphs and Line Breaks

The <p> element groups sentences into paragraphs. To force a line break
without starting a new paragraph, use <br>.

This is the first sentence of a paragraph. This is the second sentence.

Line one.
Line two on the next line.

3. Inline Text Semantics

Inline elements convey meaning or presentation within text. Use semantic tags to improve
accessibility and search engine understanding.

Tag	Meaning
<strong>	Strong importance (typically bold)
<em>	Emphasis (typically italic)
<mark>	Highlighted text
<small>	Fine print or side comment
<del>	Deleted text
<ins>	Inserted text
<sub>	Subscript
<sup>	Superscript
<abbr title=’…’></abbr>	Abbreviation with expansion in the title attribute
<cite>	Reference to a creative work
<code>	Inline code snippet
<kbd>	Keyboard input

Example demonstrating several inline semantics:


  To install the package, run npm install my-package in your terminal.
  Use Ctrl+C to copy.
  The term HTML is used widely.
  Warning: This action is irreversible.

4. Lists

Lists organize items sequentially or semantically. There are three types:

Unordered list (<ul>) for bullet lists.
Ordered list (<ol>) for numbered items.
Definition list (<dl>) for key–value pairs.

Examples:



  Apple
  Banana
  Cherry




  Preheat oven
  Mix ingredients
  Bake for 20 minutes




  HTML
  HyperText Markup Language
  CSS
  Cascading Style Sheets

5. Quotations

For inline quotes, use <q>. For longer block quotes, use
<blockquote> and optionally cite the source via the
cite attribute or a nested <footer>.

As the author said, Knowledge is power.

Two roads diverged in a yellow wood,
And sorry I could not travel both

— Robert Frost, The Road Not Taken

6. Other Basic Content

<hr>: Thematic break or section divider.
Example:
```
Section above

Section below
      
```
<address>: Contact information.
```
  John Doe

  john@example.com

      
```

Character entities: Special symbols.

Less than: &lt; , Greater than: &gt;, Ampersand: &amp;

<time>: Dates or times with machine-readable datetime.
```
June 15, 2023
      
```

Best Practices

Use semantic elements to convey meaning instead of relying on styling tags.
Keep a logical hierarchy of headings for accessibility and SEO.
Avoid overusing <br>; prefer grouping content in paragraphs.
Always provide title or cite attributes when needed for context.

With these text and basic content elements, you can create well-structured, accessible,
and semantically rich HTML pages. Experiment with combinations to see how they affect
document flow and meaning.

HTML Course 4. Text and basic content