Be able to create the content layer of a web page

Resources | Subject Notes | Information Communication Technology ICT

Creating the Content Layer of a Web Page

The content layer of a web page is where the actual information is displayed to the user. This includes text, images (though we won't use them in this example), lists, and tables. We'll explore how to structure this content using various HTML elements.

Text Formatting

The <p> element is used to define paragraphs of text. Paragraphs help break up large blocks of text, making the page easier to read.

<h2> and <h3> elements are used for headings. <h2> represents a main heading, and <h3> represents a subheading. Headings provide structure and organization to the content.

Lists

HTML provides two types of lists: unordered lists and ordered lists.

Unordered Lists

An unordered list is used to present a series of items where the order is not important. It is represented by the <ul> element. Each item in the list is enclosed in a <li> element.

  • Item 1
  • Item 2
  • Item 3

Ordered Lists

An ordered list is used to present a series of items where the order is important. It is represented by the <ol> element. Each item in the list is enclosed in an <li> element.

  1. First step
  2. Second step
  3. Third step

Tables

HTML tables are used to display data in rows and columns. A table is defined by the <table> element. The table structure is defined using elements like <thead> (table header), <tbody> (table body), <tr> (table row), and <th> (table header cell) and <td> (table data cell).

Suggested diagram: A simple table with a header row and data rows.
Name Age City
John Doe 30 New York
Jane Smith 25 London
Peter Jones 40 Paris

Mathematics

Mathematical expressions can be included using LaTeX notation. Inline mathematics is enclosed in $...$, and block mathematics is enclosed in $$...$$.

Example: $E = mc^2$ represents Einstein's famous equation.

$$ \int_a^b f(x) \, dx = F(b) - F(a) $$