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
