Basic HTML Structure

Yaser Rahmati | یاسر رحمتی

Doctype Declaration

  • Every HTML document starts with a declaration. It tells the browser what version of HTML you're using.

<!DOCTYPE html>

HTML Element

  • The <html> tag wraps all content of the page. It signifies the start of the HTML document.

<html>
</html>

Head Section

  • The <head> section contains meta-information about the document. This data is not displayed on the web page.

  • Key parts inside the <head> tag:

    • Title Tag: Defines the title of the document displayed in the browser tab.

    • Meta Tags: Provide metadata like charset and author.

    • Link Tag: Used to link external resources like CSS files.

<head>
    <title>My First Web Page</title>
    <meta charset="UTF-8">
    <meta name="description" content="Basic HTML structure">
    <meta name="author" content="Yaser Rahmati">
</head>

Body Section

  • The <body> tag contains the visible content of the webpage. All text, images, links, and elements the user will see are placed here.

<body>
    <h1>Welcome to My First Web Page</h1>
    <p>This is a paragraph of text.</p>
</body>

Closing the HTML Document

  • After the body, close the <html> tag to signify the end of the document.

</html>

Full Example of Basic HTML Structure

<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
    <meta charset="UTF-8">
    <meta name="description" content="Basic HTML structure">
    <meta name="author" content="Yaser Rahmati">
</head>
<body>
    <h1>Welcome to My First Web Page</h1>
    <p>This is a paragraph of text.</p>
</body>
</html>

This structure forms the foundation of any HTML page!

Keywords

HTML, Hypertext Markup Language, Tags, Elements, Attributes, Head, Body, Paragraph, Heading, Title, Meta, Link, Image, Anchor, Hyperlink, List, Table, Form, Input, Button, CSS, Class, ID, Inline, Block, Div, Span, Script, Styles, Font, Color, Background, Margin, Padding, Border, Doctype, HTML5, Video, Audio, Canvas, SVG

External Links

🌐 Personal Website 📄 Resume 🎥 Video Archive 💼 Finance Blog 🔐 Network & Security Notebook 🎬 Aparat Channel

PreviousWhat is HTML?NextHeadings and Paragraphs

Last updated