diff --git a/docs/html/syntax-structure-html.md b/docs/html/syntax-structure-html.md
new file mode 100644
index 000000000..764c2f7df
--- /dev/null
+++ b/docs/html/syntax-structure-html.md
@@ -0,0 +1,95 @@
+---
+id: structure-and-syntax-html
+title: Introduction of structure and syntax
+sidebar_label: HTML structure and Syntax
+tags: [html, structure, syntax, web-development, front-end-development, web-design]
+description: In this tutorial, you will learn about HTML Structure and HTML Syntax
+---
+HTML (HyperText Markup Language) is the standard markup language for creating web pages. It describes the structure of a web page and consists of a series of elements. HTML elements tell the browser how to display the content.
+
+## HTML Syntax
+
+HTML syntax consists of a set of elements, tags, attributes, and their combinations. Here's a breakdown:
+
+1. **Elements** : HTML documents are built using elements, which are structured by HTML tags. Elements typically consist of an opening tag, content, and a closing tag.
+ ```html
+ Content goes here
+ ```
+2. **Tags**: Tags are keywords enclosed in angle brackets `<>` that define the structure and content of HTML elements. They can be categorized into two types:
+
+ + **Opening Tags** : They denote the beginning of an element and have the tag name wrapped in angle brackets.
+ ```html
+
+ ```
+ + **Closing Tags** : They denote the end of an element and have the tag name wrapped in angle brackets, preceded by a forward slash `/`.
+
+ ```html
+
+ ```
+ Some tags, like ``, ``, and ` `, are self-closing and do not require a separate closing tag.
+
+3. **Attributes** : HTML elements can have attributes that provide additional information about them. Attributes are added to the opening tag and are written as name-value pairs.
+ ```html
+
+ ```
+For example:
+ ```html
+
+ ```
+
+## HTML Structure
+
+HTML documents have a hierarchical structure consisting of various elements. Here's a breakdown of the structure:
+
+
+Here's a basic HTML structure:
+
+1. `` : Declares the document type and version of HTML.
+2. `` : The root element of the HTML document.
+3. `` : Contains meta-information about the document, such as character encoding, viewport settings, and title.
+4. `` : Specifies the character encoding of the document.
+5. `` : Sets the viewport properties for responsive design.
+6. `` : Defines the title of the document.
+7. `<body>` : Contains the visible content of the HTML document.
+8. `<header>`, `<main>`, `<footer>` : Semantic HTML5 elements for structuring the header, main content, and footer sections of the page.
+9. `<section>, <article>, <aside>`: Additional semantic HTML5 elements for organizing content within the main section of the page.
+
+
+``` html
+ <!DOCTYPE html>
+ <html lang="en">
+ <head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Your Page Title
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+### conclusion
+
+Together, HTML syntax and structure enable developers to craft web pages that are both functional and user-friendly, facilitating seamless navigation and interaction for visitors. Understanding and adhering to these principles is essential for creating well-structured, semantically meaningful, and standards-compliant web content.
+ ```
+
+## HTML Structure
+
+HTML documents have a hierarchical structure consisting of various elements. Here's a breakdown of the structure:
+
+
+Here's a basic HTML structure:
+
+1. `` : Declares the document type and version of HTML.
+2. `` : The root element of the HTML document.
+3. `` : Contains meta-information about the document, such as character encoding, viewport settings, and title.
+4. `` : Specifies the character encoding of the document.
+5. `` : Sets the viewport properties for responsive design.
+6. `