I. HTML – The Structure of the Web Lesson 1: Introduction to HTML Objectives Understand what HTML is and its role in web development. Identify the basic structure of an HTML document. Lesson Content HTML = HyperText Markup Language. Basic structure: html Copy Edit My First Page

Hello World

contains metadata. contains visible content. Practice Task Create a file called index.html with your name as a heading and a short welcome paragraph. Mini-Quiz What does HTML stand for? Where does visible page content go? What is the purpose of ? Lesson 2: Basic Text Elements Objectives Format text using headings and paragraphs. Use emphasis and strong importance. Lesson Content Headings:

Paragraphs:

Bold: / Italic: / Practice Task Create a short biography using

for your name,

for your intro, and bold one important word. Mini-Quiz Which heading tag is largest? What’s the difference between and ? Lesson 3: Links & Navigation Objectives Add hyperlinks to your web page. Lesson Content html Copy Edit Visit Example About Us Internal vs external links. target="_blank" opens a link in a new tab. Practice Task Add a link to your favorite website and a link to another page on your site. Mini-Quiz What attribute sets the link’s destination? How do you make a link open in a new tab? Lesson 4: Images & Media Objectives Add images to your page with proper attributes. Lesson Content html Copy Edit Description of image Always use alt for accessibility. Can also embed videos: html Copy Edit Practice Task Add a photo of yourself to your profile page. Mini-Quiz What is the alt attribute for? Which tag is used for an image? Lesson 5: Lists Objectives Create ordered and unordered lists. Lesson Content html Copy Edit

  • HTML
  • CSS
  1. First
  2. Second
Practice Task Make a list of your top 3 favorite foods using
    . Mini-Quiz Which tag creates a bulleted list? Which tag creates numbered items? Lesson 6: Tables Objectives Create simple HTML tables. Lesson Content html Copy Edit
    NameAge
    Joe25
    = table header cell. Practice Task Make a table with 2 columns: subject name and teacher. Mini-Quiz What does represent? What’s the difference between and ? Lesson 7: Forms & Inputs Objectives Create forms for user input. Lesson Content html Copy Edit
    Input types: text, email, password, number. Practice Task Create a sign-up form with name, email, and submit button. Mini-Quiz Which tag wraps form elements? Which input type hides text when typed? Lesson 8: Semantic HTML Objectives Use semantic tags for better structure. Lesson Content
    ,