Studyfin Studyfin ✨ Sign up free

Web pages with HTML

Grade 10 · Coding · Free lesson

Hey there! I am Studyfin, your tutor. Today, we will learn how to use HTML to share important data with an audience!

When we want to display data to an audience, we use digital tools to make it clear. HTML is the coding language that builds the structure of web pages. By using HTML tags, we can organize numbers and facts so they are easy for anyone to read.

To communicate data clearly, we organize our content using specific HTML tags. The <h1> tag creates a bold main heading, while the <p> tag creates a paragraph for our explanations. Let us look at how these tags instantly format our text to guide the reader's eye.

<h1> <p>

We can also display structured data using HTML lists. An ordered list uses the <ol> tag to show steps in a process, while an unordered list uses <ul> for general points. This helps your audience analyze your data step-by-step without getting confused.

<ul> (Unordered List)
✏️ Worked example

Imagine you collected data on local recycling habits. You need to write the HTML code to display a clear title and a two-step list of your findings for your class.

  1. First, identify the main title of your data presentation. We will use the <h1> tag for our main heading: '<h1>Recycling Data Presentation</h1>'.
  2. Next, choose the right list type. Since we are listing a sequence of two main findings, we will use an ordered list with the <ol> tag.
  3. Write the first data point inside a list item <li> tag: '<li>60% of students recycle plastic bottles.</li>'.
  4. Write the second data point inside another list item <li> tag: '<li>Paper recycling increased by 15% this year.</li>'.
  5. Close your list using the '</ol>' tag to complete your structured data display.
Want the full interactive lesson — quiz, animations, and Finn cheering them on?

More Coding lessons