HTML is the foundation of web development. It is used to:
Create websites
Design web pages
Display text, images, videos, and audio
Create forms and tables
Build navigation menus
Develop the structure for web applications
Features of HTML
Easy to learn
Platform independent
Supported by all modern browsers
Free and open standard
Integrates with CSS and JavaScript
Search engine friendly
What is a Web Page?
A web page is a document displayed in a web browser. Every web page is written using HTML.
Examples:
Home Page
About Us Page
Contact Page
Login Page
What is a Website?
A website is a collection of multiple web pages connected through hyperlinks.
Example:
GWAL NET
│
├── Home
├── Courses
├── Quiz
├── Blog
├── Contact
└── About
What is an HTML Tag?
An HTML tag tells the browser how to display content
Example:
Welcome to GWAL NET
Output:
Welcome to GWAL NET
Types of HTML Tags
1. Container Tags
These tags have both opening and closing tags.
Example:
This is a paragraph.
2. Empty Tags
These tags do not require a closing tag.
Examples:
Basic HTML Document Structure
My First Web Page
Welcome to GWAL NET
This is my first HTML page.
Explanation
→ Declares HTML5 document.
→ Root element.
→ Contains metadata.
→ Page title shown in browser tab.
<body> → Visible webpage content.
HTML File Extension
HTML files are saved with:
.html
or
.htm
Example:
index.html
about.html
contact.html
How to Run HTML
You can write HTML using:
Visual Studio Code
Notepad++
Sublime Text
Brackets
Steps:
Open a code editor.
Create a new file.
Save it as index.html.
Open the file in any web browser.
HTML Editors
Popular HTML editors include:
Visual Studio Code
Notepad++
Sublime Text
WebStorm
Atom (legacy)
Brackets
Advantages of HTML
Simple syntax
Free to use
Cross-platform
SEO friendly
Easy integration with CSS and JavaScript
Large community support
Limitations of HTML
Cannot create dynamic websites by itself
Cannot process data
Requires CSS for styling
Requires JavaScript for interactivity
Real-Life Example
When you visit a website like an online shopping site:
HTML creates the page structure.
CSS adds colors and layout.
JavaScript makes buttons, forms, and menus interactive.
Together, these technologies create a complete website.
Key Points to Remember
HTML stands for HyperText Markup Language.
HTML is used to create web pages.
HTML uses tags to structure content.
HTML5 is the current standard.
HTML works with CSS and JavaScript.
Chapter Summary
In this chapter, you learned:
What HTML is
Why HTML is important
HTML features
Web pages vs. websites
HTML history
HTML tags
Basic HTML document structure
HTML editors
Advantages and limitations
This foundation prepares you for creating your first web pages.
Practice Questions
What does HTML stand for?
What is the purpose of the <head> tag?
Which tag contains the visible content of a webpage?
What is the difference between a web page and a website?
Name any three HTML editors.
What is the purpose of <!DOCTYPE html>?
What is the difference between container tags and empty tags?
Which HTML tag is used to display the page title in the browser tab?
What file extension is commonly used for HTML files?
Why is HTML considered the foundation of web development?
</div>
<!-- Page Navigation Actions -->
<div class="buttons">
<div>
<div class="btn-disabled"></div>
</div>
<div>
</div>
<div>
<a class="btn" href="tutorial.php?id=7">
Next <i class="fa fa-arrow-right"></i>
</a>
</div>
</div>
</div>
</div>
<script>
const menuToggle = document.getElementById('menuToggle');
const sidebar = document.getElementById('sidebar');
const sidebarOverlay = document.getElementById('sidebarOverlay');
function toggleMenu() {
sidebar.classList.toggle('active');
sidebarOverlay.classList.toggle('active');
}
if (menuToggle && sidebarOverlay) {
menuToggle.addEventListener('click', toggleMenu);
sidebarOverlay.addEventListener('click', toggleMenu);
}
</script>
</body>
</html>