| Lesson Plan |
| Grade: |
Date: 01/12/2025 |
| Subject: Information Communication Technology ICT |
| Lesson Topic: Know and understand the function of an anchor |
Learning Objective/s:
- Describe the purpose of the anchor element and its role in web navigation.
- Identify and apply key attributes (href, target, id, download, rel) to create external, internal, email, and download links.
- Demonstrate best‑practice link text and security considerations when using anchors.
- Debug common anchor errors such as missing href, unencoded URLs, or unclosed tags.
|
Materials Needed:
- Computer with internet access
- Text editor (e.g., VS Code, Notepad++)
- Projector or interactive whiteboard
- Sample HTML template (anchors.html)
- Web browser for testing
- Handout of anchor syntax and attribute table
|
Introduction:
Begin with a quick demonstration of a broken link on a webpage to spark curiosity. Ask students how they navigate between pages and sections online, linking to prior knowledge of hyperlinks. Explain that today they will master the anchor tag, which enables those navigations, and outline the success criteria: they will create functional internal and external links and follow best‑practice guidelines.
|
Lesson Structure:
- Do‑now (5'): Students examine a sample webpage and note any non‑functional links; teacher records observations.
- Mini‑lecture (10'): Explain anchor syntax, key attributes, and link types with live coding examples.
- Guided practice (15'): Students create
anchors.html, add headings with id attributes, and build a navigation menu of internal anchors.
- Pair activity (10'): Add an external link that opens in a new tab and an email link, discussing
target and rel attributes.
- Testing & debugging (10'): View the page in a browser, test each link, and troubleshoot using the best‑practice checklist.
- Consolidation (5'): Whole‑class review of best practices and a quick exit quiz (e.g., Kahoot).
|
Conclusion:
Summarise that anchors are essential for navigation and must include appropriate attributes and clear link text. For the exit ticket, each student writes one internal and one external anchor code snippet on a sticky note. Homework: enhance a personal webpage by adding a navigation bar with internal anchors and a download link for a PDF.
|