HTML Structure

HTML Structure:
A simple HTML Document:
<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset=“UTF-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
<title>First Webpage</title>
</head>
<body>
<p>Hello World</p>
</body>
</html>
Here is the Step by Step Explanation:
The Declaration:
It starts with <!DOCTYPE html> at the very beginning.
This tells the browser that this is an HTML document and it should follow the latest HTML5 standards.
- The Root Element:
Next comes the <html> tag.
It’s like a container that holds everything else on the page.
It has a closing tag at the end, </html>, to mark where the document ends.
- The Head Section:
Inside the <html>, you’ll find the <head> section.
This part contains information about the page that’s not visible to the user directly, but it’s important for the browser and search engines.
It includes things like:
The page title (using the <title> tag):
This is what appears in the browser tab or window title bar.
Metadata (using <meta> tags):
These provide extra information about the page, like its description, author, keywords, and character encoding.
Links to external files (using <link> tags):
These can link to stylesheets (CSS) for styling, scripts (JavaScript) for interactivity, and other resources.
- The Body Section:
After the <head>, comes the <body> section.
This is where you put all the content that you want to display on the page, such as:
Headings (using <h1> to <h6> tags):
These create different levels of headings to structure your content.
Paragraphs (using <p> tags):
These define blocks of text.
Images (using <img> tags):
These embed images into the page.
Closing Tags:
Remember that most HTML elements need both opening and closing tags to define their boundaries.
The closing tag has a forward slash before the element name (e.g., </body>, </head>, </html>).