Lesson Plan Observation INTRODUCTION TO HTML

Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 3

Grade 12 – Jasmine Date and Time:

I. Objectives
a. The students should able to:
1. Understand html;
2. Familiarize the different basic tags and elements of html5; and
3. Familiarize html structure.
II. Subject Matter
a. Title: INTRODUCTION OF HTML
b. Materials: Notepad, Notepad++, Komodo Edit, Computers, Projector, Projector Screen,
PowerPoint presentation, Office Remote using Smartphone and Computer.

III. Lesson Proper


a. Pretest: Multiple choice
b. Recap: Discussion of previous lesson. “the previous lesson was the basic of
programming, how to do the process/steps, the use of algorithm, pseudocode, and
flowchart.
c. Motivation: let learners watch a video which is about “Web development for beginners:
What does a web developer do? Video link: Web development for beginners: What does
a web developer do? - YouTube or Importance of Web Development and Design -
YouTube or 5 Basic Concepts of Web programming - YouTube
d. Lesson Proper: Discussion
1. The teacher will introduce the new topic which is called “Introduction to
HTML.”
2. The learners will learn on what sort of program they are going to use in
creating their first html program.
3. The learners will learn about What is HTML is and what are its Basic elements
and tags such as <html>, <head>, <title>, <body> as example.
4. During discussion students can also use the example on the PowerPoint and
test if they could run the given examples themselves a sort way for them to
familiarize the function of the given elements in the lesson.
5. I have also Included some Exercises for them to try.
6. HTML Basic Exercises ( choose 1 or 2 )

1. Create a webpage that prints your name to the screen. [See solution]
2. Create a webpage that prints the numbers 1 - 10 to the screen. [See
solution]
3. Create a webpage and set its title to "This is a webpage". [See solution]
4. Create a webpage that prints the message "When was this webpage
created? Check page's title for the answer." to the screen, and set the
title of the page to the current date.[See solution]

e. Generalization:
We have discussed what is Hyper Text Markup Language and how to create simple
webpage. HTML documents are files that end with a .html or .htm extension. You can view
the output using any web browser like Google Chrome, Safari and Mozilla Firefox. After our
discussion, you understand what is element and tag in html and also, we have syntax to
follow in creating webpage. Now according to what you have learned from this lesson list
down the steps in creating webpage on the ¼ or ½ sheet paper;
f. Application:
1. Directions: Read and answer the following questions carefully in two to three
sentences each number.
a. What do you think are the importance of knowing HTML?
b. How will you use the knowledge you acquired about HTML?
2. Option 1:They will also be given time to test what they have learned and
create any simple program they wish to create. By letting them do so, they will
be able to understand and try it out for themselves on how each element or
tag functions.
3. Option 2: Based on the Given exercises they are allowed to Tinker the
structure itself to see results

IV. Evaluation
a. Posttest : Directions: Select the letter that corresponds to the correct answer.
1. It is an additional characteristics or properties of the element.
a. Attributes b. Tag c. Selector d. Value
2. The one who created HTML
a. John Web
b. John Berners-Lee
c. Tim Berners-Lee
d. Tim Web
3. It is always be enclosed in quotation marks.
a. Body b. Attributes value c. Tag d. Title
4. Tags that holds the content of document.
a. <body> … </body>
b. <html> … </html>
c. <title> … </title>
d. <head> … </head>
5. Tags that contains meta information
a. <body> … </body>
b. <html> … </html>
c. <title> … </title>
d. <head> … </head>

Directions: Write the structure of html and html documents on the space provided below.
V. Assignment:

a. Create a webpage that prints any text of your choosing to the screen, do not include a
head section in the code. [See solution]
b. Repeat exercise #1, but this time include a head section in the code. [See solution]

Submitted by:

Edeson John M. Cabanes


Teacher I

Observed by:

______________________
Master Teacher II

You might also like