In this lesson, we scratch the surface of HTML forms. While the Mozilla eBook provides great detail on forms, I prefer to focus on the basics and circle back around to the more advanced concepts later once the students encounter forms required for a development project.

• Web Design Syllabus

Teacher Activities

• Check Learning Journals
• Pre-teach vocab (input / controls / widgets / submit)
• Demonstrate web form examples (stripe, airbnb, orbitz)

Student Activities

• Participate in class discussion
• Read Your first HTML form and take Outline Notes
• Open VS Code
  1. Read Active learning: Implementing our form HTML
  2. Download the starter code
  3. Follow the steps to write your code
  4. Show me your web page!*
• Read How to structure an HTML form and take Outline Notes
• Open VS Code
  1. Read Active learning: building a form structure and ask questions
  2. Download the starter code
  3. Follow the steps to write your code
  4. Show me your web page!*

Extend

Using the image below as a guide, code the Pizza Form