diff --git a/SUMMARY.md b/SUMMARY.md
index dc740ed..adfa972 100644
--- a/SUMMARY.md
+++ b/SUMMARY.md
@@ -40,6 +40,9 @@
* [Docker Networking](DockerWU/dockernetworking.md)
* [Setup Docker Webservice](DockerWU/SettingUpDockerforWebServices.md)
* [Setup Docker OPenvpn, Tor, Cache](DockerWU/SetupDockerOVPNTORCACHE.md)
+* [Web Development]
+ * [Web Dev Manual](Webdev/Webdevmanual.md)
* [Future Projects](future-projects/README.md)
* [NIST Agregator](future-projects/nist-agregator.md)
* [DataViz For the Pacific](future-projects/dataviz-for-the-pacific.md)
+
diff --git a/Webdev/Webdevmanual.md b/Webdev/Webdevmanual.md
new file mode 100644
index 0000000..ca03dfb
--- /dev/null
+++ b/Webdev/Webdevmanual.md
@@ -0,0 +1,535 @@
+### :orange[HTML Learning Manual]
+
+Welcome to the exciting world of Web Development! This manual is designed to guide you through the fundamentals of HTML (HyperText Markup Language), the backbone of every webpage you see on the internet. Let's embark on this journey to understand how to structure content for the web.
+
+:blue[Step 1: Introduction to HTML]
+
+HTML is not a programming language; it's a **markup language**. This means HTML uses tags to structure content on a webpage. Think of it as the skeleton of a website, providing the basic framework upon which CSS (styling) and JavaScript (interactivity) are built.
+
+* **Purpose of HTML:** HTML is used to create the structure and content of web pages. It defines elements like headings, paragraphs, lists, links, images, and more.
+* **HTML Documents:** HTML documents are plain text files with an `.html` or `.htm` extension. These files are interpreted by web browsers to display web pages.
+* **Basic HTML Structure:** Every HTML document follows a basic structure. Let's look at the fundamental components:
+
+```html
+
+
+
+
+
+ Page Title
+
+
+ Hello, World!
+ This is a paragraph of text.
+
+
+```
+
+* **``:** This declaration defines the document type and version of HTML being used. `` is for HTML5, the latest standard.
+* **``:** The root element of an HTML page. It tells the browser that this is an HTML document. The `lang="en"` attribute specifies the language of the document as English.
+* **``:** Contains meta-information about the HTML document, such as the title, character set, and links to stylesheets and scripts. This information is not displayed on the webpage itself but is crucial for browser settings and SEO.
+ * **``:** Specifies the character encoding for the document, UTF-8 is widely used and supports most characters.
+ * **``:** Configures the viewport for responsive web design, ensuring the page scales correctly on different devices.
+ * **`Page Title`:** Sets the title that appears in the browser's title bar or tab.
+* **``:** Contains the visible content of the HTML document, such as text, images, links, and other media. This is what users see on the webpage.
+ * **`Hello, World!
`:** A level 1 heading, used for main titles. HTML provides headings from `` to `` (decreasing in importance).
+ * **`
This is a paragraph of text.
`:** Represents a paragraph of text.
+
+:blue[Step 2: HTML Elements and Tags]
+
+HTML documents are composed of **HTML elements**. An HTML element is defined by a **start tag**, some **content**, and an **end tag**.
+
+* **Tags:** Tags are keywords enclosed in angle brackets (`< >`).
+ * **Start Tag:** Marks the beginning of an element (e.g., ``).
+ * **End Tag:** Marks the end of an element and is the same as the start tag but with a forward slash before the element name (e.g., `
`).
+* **Elements:** An HTML element encompasses everything from the start tag to the end tag, including the content in between. For example, `Hello, World!
` is an `h1` element.
+* **Empty Elements (Self-Closing Tags):** Some elements do not have content and are called empty elements. These elements usually have a self-closing tag in XHTML, but in HTML5, they are simply written with a start tag. Examples include `
` (line break) and `![]()
` (image). While `
` or `![]()
` is valid in XHTML and older HTML, in HTML5, `
` and `![]()
` are preferred.
+
+**Common HTML Tags:**
+
+* **Headings:** `` to `` for different levels of headings.
+* **Paragraphs:** `
` for paragraphs of text.
+* **Links:** `` (anchor) for creating hyperlinks to other web pages or resources.
+ ```html
+ Visit Example
+ ```
+* **Images:** `![]()
` for embedding images.
+ ```html
+ 
+ ```
+ * `src` attribute specifies the path to the image.
+ * `alt` attribute provides alternative text for the image, important for accessibility and SEO.
+* **Lists:**
+ * **Unordered Lists:** `
` (unordered list) and `- ` (list item) for lists with bullet points.
+ ```html
+
+ - Item 1
+ - Item 2
+ - Item 3
+
+ ```
+ * **Ordered Lists:** `` (ordered list) and `- ` (list item) for numbered lists.
+ ```html
+
+ - First item
+ - Second item
+ - Third item
+
+ ```
+* **Divisions and Spans:**
+ * `` (division) is a block-level element used as a container to group other HTML elements. It's often used for layout and styling.
+ * `
` is an inline element used as a container for inline content. It's often used to style parts of text within a paragraph.
+
+:blue[Step 3: HTML Attributes]
+
+HTML attributes provide additional information about HTML elements. They are always specified in the **start tag** and usually come in name-value pairs like `name="value"`.
+
+* **Syntax:** `attribute="value"`
+* **Common Attributes:**
+ * **`id`:** Provides a unique identifier for an element within the HTML document. IDs are used by CSS and JavaScript to target specific elements.
+ ```html
+ This is an introductory paragraph.
+ ```
+ * **`class`:** Specifies one or more class names for an element. Classes are used by CSS to apply styles to multiple elements with the same class name.
+ ```html
+ This paragraph is highlighted.
+ ```
+ * **`style`:** Allows you to add inline CSS styles to an element.
+ ```html
+ This text is blue.
+ ```
+ **Note:** While inline styles are possible, it's generally better practice to use external CSS stylesheets for better organization and maintainability.
+ * **`src`:** Used with `![]()
` and `