HTML Β· Module 01 Β· Lesson 1 of 54

What is the Web & HTML?

What is HTML?

Imagine you are building a house. You need a wooden frame, support beams, and walls before you can paint it or add furniture. In the world of websites, HTML (HyperText Markup Language) is that wooden frame. It is the core skeleton that defines where everything goes.

HTML stands for HyperText Markup Language:

  • HyperText: This refers to links (hyperlinks) that connect webpages to one another.
  • Markup: This means marking up plain text with tags to tell the browser what kind of content it is (like a heading, a paragraph, or an image).
  • When a web browser loads a website, it reads the HTML code and turns it into a tree-like structure called the Document Object Model (DOM). This tree determines how the elements are nested inside each other.

    Why does it matter?

    Without HTML, the web would just be plain, unformatted text. Every single webpage you visitβ€”whether it's Google, YouTube, or Wikipediaβ€”relies on HTML to define its structure. Learning HTML is the absolute first step for anyone wanting to build websites, web apps, or even customize email templates.

    How to write it

    HTML uses tags to structure content. A tag is a keyword wrapped in angle brackets, like <h1>. Most elements need an opening tag to start the content and a closing tag (which has a slash /) to end it.

    Here is how you write a basic heading:

    <h1>Hello World</h1>
    
    In this example:
  • <h1> is the opening tag (stands for Heading 1).
  • Hello World is the content you want to display.
  • </h1> is the closing tag.
  • <html>
    <body>
    <h1> Hello World </h1>

    Common Mistakes

  • Forgetting the closing tag: If you forget the closing tag (like writing <h1>Hello World), the browser might get confused and treat everything after it as a heading!
  • Using backslashes instead of forward slashes: Closing tags always use a forward slash / (e.g., </h1>), not a backslash \\ (e.g., <\\h1>).
  • Quick Reference

  • <html> β€” The wrapper for the entire webpage document.
  • <body> β€” Contains all the visible content on the webpage.
  • <h1> to <h6> β€” Heading tags, with <h1> being the largest and most important.
  • Your Task
    Create an `<h1>` element that contains the text 'Hello World'. Make sure to write both the opening tag `<h1>` and the closing tag `</h1>`.
    index.html
    Type code above to start the lesson.
    Live Preview