HTML Practical Practice Sheet
Module 1: Basic Structure & Tags
- Create a basic HTML boilerplate.
- Use <title>, <h1> to <h6>, <p>, <br>, <hr> tags.
- Create a webpage with headings, paragraphs, and horizontal rules.
Module 2: Text Formatting Tags
- Use tags like <b>, <i>, <u>, <strong>, <em>, <mark>, <small>, <sub>, <sup>.
- Display a paragraph using at least 5 formatting tags.
Module 3: Lists
- Create an unordered list of fruits.
- Create an ordered list of your daily routine.
- Create a nested list (list inside list).
- Combine unordered and ordered lists to display a restaurant menu.
Module 4: Links and Anchors
- Add internal links to sections on the same page.
- Add external links to Google, YouTube.
- Add a downloadable link to a PDF/image.
- Add email and phone links.
Module 5: Images
- Insert an image with width, height, alt attributes.
- Link on the image.
- Caption using <figure> and <figcaption>.
Module 6: Tables
- Create a table showing student marks with <thead>, <tbody>, <tfoot>.
- Use of rowspan and colspan.
- Style the table using inline CSS.
Module 7: Forms
- Create a login form with username and password.
- Create a registration form with Name, Email, Phone, Gender, Hobbies, Country, File upload, and
Submit button.
- Use label and fieldset.
Module 8: Semantic HTML5
- Create a page layout using <header>, <nav>, <main>, <section>, <article>, <aside>, <footer>.
Module 9: Media Embedding
- Embed an audio file with controls.
- Embed a video file with controls.
- Embed a YouTube video using <iframe>.
Module 10: Mini HTML Projects
- Project 1: Personal Portfolio Page
- Project 2: Restaurant Menu Page
- Project 3: Feedback Form
Optional Challenge: Code Recreate
- Recreate the basic structure of a popular site homepage (like Wikipedia or Amazon) using only
HTML.