Skip to content

HTML Exercises

These exercises cover everything from HTML tags through to document structure and forms. Work through them in order — each one builds on the last.

Exercise 1 — Your First Proper Page

Create a new file called about.html with the full HTML skeleton. Inside the body, build a simple "About Me" page that includes:

  • A <title> in the head that shows your name in the browser tab
  • One <h1> with your name
  • A <h2> called "What I know"
  • A paragraph underneath listing what you know so far
  • A <h2> called "What I am learning"
  • A paragraph describing what you are working on now

Open it in your browser. The tab should show your name.

Exercise 2 — Tags in Action

In a file called tags.html, demonstrate the following tags — each one used at least once with real content:

  • <h1> through <h3>
  • <p>
  • <strong> and <em> used inside a paragraph
  • <br> and <hr>
  • An unordered list <ul> with at least 4 items
  • An ordered list <ol> with at least 3 steps

Use the full HTML skeleton. Make the content about anything — a topic you enjoy, your learning journey, a recipe, anything real.

Create a file called gallery.html. On it:

  • Add a heading and a short paragraph introducing the page
  • Add at least two images (use images from your computer or any public URL)
  • Make each image a clickable link — clicking it should open a website of your choice in a new tab
  • Add a link at the bottom that goes back to about.html

Check: do both images show? Do the links open in a new tab? Does the back link work?

Exercise 4 — A Table

Create students.html. Build a table with the following columns:

Name Age Favourite Subject

Add at least five rows of made-up student data. Use the proper table structure — <table>, <thead>, <tbody>, <tr>, <th>, <td>.

Exercise 5 — A Form

Create register.html. Build a registration form that collects:

  • Full name (text)
  • Email address (email)
  • Age (number)
  • Gender (select: Male / Female)
  • A short message (textarea)
  • A checkbox: "I agree to the terms"
  • A submit button that says "Register"

Give every input a proper <label> with matching for and id. Use method="post" and action="/register" on the form.

Open it in your browser. Fill it in completely. Does every input work correctly?

← Showing the Updated List    Next: CSS Exercises →