SimpleTuts.com

Creating a Webpage & Basic HTML Tags

Learn How to Create Your First Webpage Using Basic HTML Tags

In this class, students will learn what a webpage is, how websites work, and how to create their very first HTML webpage using basic HTML tags.

Class Objective

Understand what a webpage is
Create the first HTML file
Use basic HTML tags to display content

What is a Website?

A website is a collection of webpages
Webpages are created using HTML
Browsers like Chrome, Edge, and Firefox display HTML files

What is HTML?

HTML stands for HyperText Markup Language
It is used to structure content on the web
HTML uses tags to display text, images, links, and more

HTML Document Structure

<!DOCTYPE html> – Defines the document as HTML5
<html> – Root element
<head> – Page information
<title> – Browser tab title
<body> – Visible webpage content

Creating the First Webpage

Step 1: Open Notepad or VS Code and create a file named index.html

Step 2: Write the following HTML code:


<!DOCTYPE html>
<html>
<head>
    <title>My First Webpage</title>
</head>
<body>

    <h1>My First Webpage</h1>
    <p>This is my first HTML page.</p>

</body>
</html>

Step 3: Save the file and open it in a web browser.

Basic HTML Tags

Headings


<h1>Main Heading</h1>
<h2>Sub Heading</h2>

Paragraph


<p>This is a paragraph.</p>

Line Break and Horizontal Line


This is line one<br>
This is line two

<hr>

Text Formatting Tags


<b>Bold Text</b><br>
<i>Italic Text</i><br>
<u>Underlined Text</u>

In-Class Practice Task

Set page title as Student Profile
Add a heading with your name
Write one paragraph about yourself
Use bold, italic, and underline text

Assignment

Create a file named profile.html
Add a main heading
Include at least two paragraphs
Add one horizontal line
Use proper HTML structure