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.

  1. 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.

  1. 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.

  1. 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>).

Join Our Newsletter