Introduction
Welcome to the first lesson of our HTML course! HTML, which stands for HyperText Markup Language, is the foundational building block of all websites. Today, you’ll learn about the basic structure of a web page in HTML and get acquainted with fundamental tags such as <html>, <head>, <title>, and <body>.
The Basic Structure of a Web Page in HTML
An HTML web page typically starts with a DOCTYPE declaration to tell the web browser that this page uses HTML5:
<!DOCTYPE html>Following this, the basic structure of an HTML page is determined by several key tags:
The <html> Tag
This tag encloses the entire content of a web page, from start to finish. Everything you want to display on your web page is contained within this tag.
The <head> Tag
This section contains meta information about the web page, including the page’s title displayed on the browser’s title bar and links to CSS or JavaScript files. The <title> tag also resides in this section.
The <title> Tag
This tag defines the title of your web page, which is shown on the browser’s title bar and in search results.
The <body> Tag
This is where the main content of your web page goes, including text, images, videos, and more.
Practice: Creating a Simple Web Page
Let’s start by creating a simple web page with a title and a paragraph of text.
- Open a text editor (like Notepad or Visual Studio Code).
- Copy and paste the following code into your editor:
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
</head>
<body>
<h1>Welcome to My Web Page</h1>
<p>This is my first web page made with HTML. Nice to meet you!</p>
</body>
</html>- Save the file as “index.html”.
- Open this file with your web browser to see the simple web page you’ve just created.
Conclusion
Congratulations! You’ve learned about the basic structure of an HTML web page and how to use some fundamental tags. Continue practicing to become more proficient, and prepare for the next lesson, where we will explore more HTML tags and how they combine to create colorful and interactive web pages.
In the next lesson, you’ll learn about:
- Text formatting tags like
<h2>,<p>,<strong>, and<em>. - Working with lists using
<ul>,<ol>, and<li>tags. - How to insert images and links using the
<img>and<a>tags.
Keep practicing and exploring, as HTML is just the first step on your web development journey. You’ll soon see the power of combining HTML with CSS and JavaScript to create beautiful and functional websites.
If you have any questions along the way, don’t hesitate to seek help on online forums or reference authoritative documentation. The web development community is always eager to assist beginners.
Good luck, and stay tuned for more lessons to become a skilled web developer!