---
# System prepended metadata

title: 'My Introduction to HTML: What I Have Learned So Far'

---

# My Introduction to HTML: What I Have Learned So Far

Getting introduced to HTML marked my first real step into web development. This week’s lectures focused on understanding how the web is structured and how content is created and organized using HTML (HyperText Markup Language). Rather than jumping straight into complex designs, the lessons emphasized mastering the fundamentals, which form the backbone of every web page.

HTML works by using **tags**, **elements**, and **attributes** to describe content. Tags are keywords written inside angle brackets, and they tell the browser what type of content is being displayed. When a tag is combined with its content and closing tag, it becomes an element. Attributes, on the other hand, provide additional information about elements. For example, links use the `href` attribute to specify where they should lead.

One of the first things I learned was the **basic structure of an HTML document**. Every web page starts with a document type declaration that tells the browser the version of HTML being used. This is followed by the root `html` element, which contains the `head` and `body`. The head holds information about the page such as the title and favicon, while the body contains everything that appears on the screen.

We also explored **headings and paragraphs**, which are essential for organizing content. Headings range from `h1` to `h6`, with `h1` being the most important. Paragraphs are created using the `p` tag and are used for regular text. To control layout and spacing, we learned how to use the `br` tag for line breaks and the `hr` tag to create horizontal lines that separate sections of content.

Another important concept covered was the difference between **block-level and inline elements**. Block elements, such as paragraphs and headings, take up the full width of a page and start on a new line. Inline elements, such as links and spans, only take up the space they need and remain on the same line as surrounding content. Understanding this difference helped clarify how content flows on a web page.

Links were another major topic. Using the anchor tag, I learned how to connect pages together and link to external websites. The `href` attribute defines the destination of the link, and special links such as `mailto` can be used to open an email client directly. Alongside links, we learned how to add images using the `img` tag, which is a self-closing element that relies on attributes like `src` and `alt`.

File organization was also emphasized. I learned the importance of **absolute and relative paths**, especially when linking images or pages within a project. Relative paths are particularly useful for navigating between files in the same project, while absolute paths point to full web addresses. Proper **file structuring**, such as separating images and HTML files into folders, makes projects easier to manage and maintain.

Lists were introduced as a way to group related items. Ordered lists are used when the order matters, unordered lists are used for general grouping, and description lists allow terms and definitions to be displayed together. These list types are commonly used in menus, content outlines, and documentation.

We also learned about **classes and IDs**, which are used to identify and group elements. Classes can be applied to multiple elements, while IDs are unique and used for specific elements. This concept is especially important for styling and page organization. Using these ideas, we were introduced to building a simple **navigation bar**, which helps users move between different pages of a website.

Overall, this introduction to HTML has helped me understand how web pages are structured and how different elements work together to create meaningful content. These foundational concepts are essential for moving forward into more advanced topics like CSS and JavaScript, and they have given me confidence in building basic web pages from scratch.
