Subject: ICT
Grade Level: Grade 8
Objective: Introduction to HTML
Learning within and across curriculum:
- Within:
1) Mathematics - Understanding HTML tags can be likened to mathematical symbols
that give instructions for the computer to follow, much like how mathematical
operators dictate calculations.
2) Language Arts - HTML involves creating structured text, similar to writing
paragraphs and organizing ideas in a coherent manner in a written composition.
3) Science - HTML coding requires logical thinking and problem-solving skills, much
like the process of conducting scientific experiments and analyzing data.
- Across:
1) History - Studying the evolution of HTML can be compared to tracing the
development of written language and communication systems throughout history.
2) Physical Education - Creating a website using HTML can be linked to designing
fitness programs and tracking progress online to promote physical health and
wellness.
3) Home Economics - Utilizing HTML for recipe websites can relate to sharing
cooking techniques and nutritional information to promote healthy eating habits.
Review Motivation:
[Teaching Strategy: Role-Playing]
[Instructional Materials: Chart paper, markers]
Engaging Activity 1 - Role-playing as different HTML tags in a skit to understand
their functions.
Engaging Activity 2 - Brainstorming session to create a collaborative HTML webpage
layout using sticky notes.
Engaging Activity 3 - Interactive quiz game on HTML basics using flashcards.
Activity 1: HTML Tag Adventure
[Teaching Strategy: Project-Based Learning]
Materials - Paper, markers, laptops/tablets (optional)
Significance - Understanding the basic HTML tags through a creative storytelling
activity.
Instructions 1) Students will create a short story using HTML tags to format the text.
2) Each group will present their stories to the class.
3) Rubric
- Content and Creativity - 15 pts.
- Correct Tag Usage - 10 pts.
- Presentation - 10 pts.
Assessment Questions:
1) What is the purpose of the <h1> tag in HTML?
2) How can you emphasize text using the <em> tag?
3) Explain the role of the <a> tag in creating hyperlinks.
Activity 2: Webpage Design Challenge
[Teaching Strategy: Cooperative Learning]
Materials - Chart paper, colored pens, magazines for cut-outs
Significance - Applying HTML knowledge to design a visually appealing webpage
layout.
Instructions 1) Groups will design a webpage layout on chart paper using HTML elements.
2) Include headings, paragraphs, images, and links in the design.
3) Rubric
- Layout and Organization - 15 pts.
- Visual Appeal - 10 pts.
- HTML Element Usage - 10 pts.
Assessment Questions:
1) How can you insert an image using HTML?
2) Describe the importance of using headings in HTML.
3) What is the function of the <a> tag in creating links?
Inclusive Activity 3: HTML Tag Charades
[Teaching Strategy: Experiential Learning]
Materials - None
Significance - Reinforcing HTML tag recognition through movement and gestures.
Instructions 1) Students will take turns acting out HTML tags without speaking.
2) The rest of the class will guess the tag being portrayed.
3) Rubric
- Tag Recognition - 10 pts.
- Participation - 10 pts.
- Creativity - 10 pts.
Assessment Questions:
1) What does the <p> tag represent in HTML?
2) How can you create a line break using HTML?
3) Explain the purpose of the <img> tag in HTML.
ANALYSIS:
Activity 1 - Students demonstrated a good understanding of HTML tags through
creative storytelling.
Activity 2 - Groups effectively applied HTML elements to design visually appealing
webpage layouts.
Activity 3 - Students actively engaged in identifying HTML tags through charades.
ABSTRACTION:
Introduction to HTML involves learning the essential tags and structures used in
coding websites. Recognizing patterns in HTML syntax can deepen students'
understanding of creating and formatting content for the web. Reading materials
such as "HTML for Beginners" and "Mastering HTML Tags" can further reinforce the
concepts taught in class.
APPLICATION:
[Teaching Strategy: Inquiry-Based Learning]
Task 1 - Students will create a simple webpage using HTML to showcase their
interests or hobbies.
Task 2 - Students will analyze and modify an existing webpage source code to
understand how HTML elements work together.
ASSESSMENT:
[Teaching Strategy: Flipped Classroom]
[Instructional Materials: Computers/laptops]
Question 1 - What is the purpose of the <div> tag in HTML and how can it be styled
using CSS?
Question 2 - Explain the difference between <ol> and <ul> tags in HTML and provide
examples of when to use each.
Question 3 - How can you embed a video from an external source into an HTML
webpage?
H.O.T.S.:
Question 1 - How would you optimize an HTML webpage for mobile responsiveness
while maintaining its design integrity?
Answer 1 - Optimizing for mobile responsiveness involves using media queries in
CSS to adjust layout and font sizes based on screen size, ensuring a seamless user
experience across devices.
Question 2 - Discuss the significance of semantic HTML elements in improving
website accessibility and search engine optimization.
Answer 2 - Semantic HTML elements provide meaning to the content structure,
making it easier for assistive technologies to interpret and improving the website's
visibility in search engine results.
Question 3 - Analyze the impact of HTML5 on multimedia integration and interactive
features in modern web development.
Answer 3 - HTML5 introduced native support for audio, video, and canvas elements,
enabling seamless multimedia integration and interactive functionalities without
relying on plugins like Flash.
Assignment:
1) Create a one-page HTML document that includes headings, paragraphs, images,
and links. Provide a brief explanation of each HTML tag used.
2) Conduct research on the history of HTML and its evolution over time. Write a short
essay discussing the significance of HTML in shaping the modern internet
landscape.