0% found this document useful (0 votes)
7 views

HTML Tables

The document outlines a lesson plan focused on teaching HTML tables, including their structure and syntax. It emphasizes the importance of tables in organizing data on webpages and includes activities for students to practice creating tables. Success criteria and a rubric for evaluating table creation are also provided.

Uploaded by

Anas Hamdi
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views

HTML Tables

The document outlines a lesson plan focused on teaching HTML tables, including their structure and syntax. It emphasizes the importance of tables in organizing data on webpages and includes activities for students to practice creating tables. Success criteria and a rubric for evaluating table creation are also provided.

Uploaded by

Anas Hamdi
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 15

HTML

Tables
• To revisit the basic structure of the
HTML webpage.
LESSON • To learn the syntax to add tables in
webpage.
OBJECTIVES • To use and analyze the importance
of adding tables in a webpage.

26-01-2025 HTML- Tables 2


Starter:
• How do the information is organized on websites?

• Why do you think tables are used on websites?

Share your ideas in class point:

26-01-2025 HTML- Tables 3


HTML-TABLES
HTML tables allow web
developers to arrange data
into rows and columns.

Define an HTML Table

A table in HTML consists of


table cells inside rows and
columns
26-01-2025 HTML- Tables 4
MUST TASK
CREATE TABLE <table>
<tr>
<th>Company</th>
<th>Contact</th> Create first row of the table
<th>Country</th> <tr> table row (heading)
</tr> <th> table heading

Defines <tr>
table
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td> <td>data

<td>Germany</td> cell

</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
</table>
Mini Plenary:
Exchange with a partner and review each other’s
tables.

Prompt: “Did your partner include all the


necessary tags? Is the table organized correctly?”

Write a positive feedback for


your partner: ☺

26-01-2025 HTML- Tables 6


Activity:

1 2 3
Make a table of: Make table as Count number of
4 rows X 3 columns sample given below: rows and columns in
your timetable and
Put emoji is each create a timetable of
cell. your class.

26-01-2025 HTML- Tables 7


Plenary
Class Reflection & Sharing

Gallery Walk: Students will display their HTML code on their screens.
Teacher will walk around to observe, or screens can be projected onto
the board for discussion.

26-01-2025 HTML- Tables 8


HOME
LEARNING
• Make a table of:
• 2 rows X 2 columns
• Put Image in each cell.

26-01-2025 HTML- Tables 9


Success Criteria:
• I can create the basic
structure of the HTML
webpage.
• I know the syntax to add
tables in webpage.
• I can use and analyze the
importance of adding tables
in a webpage.

26-01-2025 HTML- Tables 10


RUBRIC:
Understanding of Computers in Learning

I can create the basic structure of the HTML webpage.

I know the syntax to add tables in webpage.

I can use and analyze the importance of adding tables in a webpage.

Target Questions:
1. Identify the different elements of an HTML table, such as <table>, <tr>, <th>, and <td>? What is the purpose of each?
2. What attributes can be applied to tables and their elements (like border, cellpadding), and how do they affect the
appearance of the table?

26-01-2025 HTML- Tables 11


Thank you

HTML- Tables 26-01-2025 12


Rubric:
Criteria 2 : Proficient 1 : Developing
• The HTML table is correctly structured.
• elements properly used. The table structure is incomplete or
Table Structure
• Rows and columns are aligned and incorrect.
organized.
• The table content is well-aligned,
• The table content is misaligned,
formatted, and easy to read.
Content Alignment difficult to read.
• Proper use of table attributes like borders,
& Presentation • Attributes like borders or headers
cell padding, and headers is
are missing or incorrectly used.
demonstrated.

26-01-2025 HTML- Tables 15

You might also like