Skip to content

Latest commit

 

History

History
62 lines (45 loc) · 2.86 KB

unit-2-lesson-02.md

File metadata and controls

62 lines (45 loc) · 2.86 KB
Raw

Lesson 2.2: HTML w/ Attributes


Lesson Materials

📖 Upload as Material in Google Classroom:

📝 Upload as Assignment in Google Classroom (5 points):


Key Points

In this lesson, students will learn to use anchor and image tags, understanding their purposes and differences from other HTML tags. The lesson also touches on HTML lists, both ordered and unordered, followed by optional challenges to test their comprehension. The session concludes with an exit ticket to assess learning and a reminder to submit their work.

  • 👋 Welcome & Do Now (5) :

    • Welcome the students and have them log in to Google Classroom for today's lesson.
    • Instruct them to fork today's exercises from GitHub.
    • Present the problem: "This website about sloths is missing some information."
    • Instruct students to complete the following tasks in the index.html file:
      • Create an <h1> tag that says "Sloths!"
      • Create a <p> tag that says "Sloths are the slowest animal in the world. Womp, womp.".

  • 🔗 Anchor and Image Tags (10) :

    • Discuss the <a href...> and <img src...> tags.
    • Engage students with questions:
      • What do you think these tags are doing?
      • How do these tags look different from <p> tags and <h1> tags?
    • Explain anchor tags:
      • Create a clickable link that allows users to jump to different pages on the web.
    • Explain image tags:
      • Allow the insertion of images on web pages using the src attribute.
    • Show examples of anchor tags with different links and discuss the attributes.
    • Show an example of an image tag with the src attribute.

  • 💻 Coding Along (5) :

    • Open the code-along.html file and guide students through the tasks related to anchor and image tags.

  • 📄 Refresher: Lists (5) :

    • Recap lists in HTML: ordered and unordered.
    • Show examples of ordered and unordered lists using <ol> and <ul> tags with <li> (list item) tags.

  • 💻 Coding Solo (5) :

    • Open the code-solo.html file and have students complete tasks related to lists.
    • Challenges (If time permits)
      • Encourage students to test their knowledge with additional challenges related to HTML Links, HTML Images, and HTML Lists.

  • 👋 Exit Ticket & Closing (5)

    • Instruct students to complete the Exit Ticket for Lesson 2.2 - HTML Tags w/ Attributes in Google Classroom.
    • Remind them to press submit after completing the Exit Ticket.

Common Misconceptions

n/a

Additional Materials

n/a