DEV Community

Cover image for HTML-101 #1. What is HTML & How the Web Works
Himanshu Bhatt
Himanshu Bhatt

Posted on

HTML-101 #1. What is HTML & How the Web Works

#webdev #beginners #tutorial #discuss

👋 Short Intro (Why I’m Writing This)

I’m currently learning HTML and decided to learn in public by documenting my journey.

This series is not written by an expert — it’s a beginner learning out loud, sharing:

  • what I understand,
  • what confuses me,
  • and what I learn along the way.

The goal is to build consistency, clarity, and invite discussion.

📌 What This Blog Covers

In this post, I’ll cover:

  • What HTML is and why it exists
  • What HTML can and cannot do in a website
  • Understanding HTML as the structure (skeleton) of the web
  • The roles of HTML, CSS, and JavaScript in a web application
  • What actually happens inside the browser when a page loads (DOM, CSS, JS)

📂 GitHub Repository

All my notes, examples, and practice code live here:

👉 GitHub Repo:

https://github.com/dmz-v-x/html-101

This repo is updated as I continue learning.

📚 Learning Notes

1. What HTML is and why it exists

Okay so first thing first what actually is HTML. So HTML stands for HyperText Markup Language (Nothing hyper about it). It is the standard language of web pages that defines the skeleton of a website.

It tells the browser, what exact content exists for the website, what type of content it is. How it is organized. That's it.

2. What HTML can and cannot do in a website

It defines Headings, create paragraphs, display images, we can build forms, and few other stuff.

It doesn't add any style (CSS, we'll see that later) or behavior/interactivity (JavaScript, we'll see this later too😜)

3. Understanding HTML as the structure (skeleton) of the web

Also if you're wondering what HTML actually looks like this is what it looks like:

<!DOCTYPE html>
<html>
<head>
  <title>My First Page</title>
</head>
<body>
  <h1>Hello World</h1>
  <p>This is my first webpage</p>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Don't worry if you don't get this right now we'll understand each and every word mentioned above in great detail in next blog.

Btw the above markup just tell show a big heading that says 'Hello World' and below it a paragraph that says 'This is my first webpage'

4. The roles of HTML, CSS, and JavaScript in a web application

Technology Role
HTML Structure (bones)
CSS Design (skin/clothes)
JavaScript Functionality (brain)

A website without CSS & JS still works, but looks plain.

5. What actually happens inside the browser when a page loads (DOM, CSS, JS)

So whenever you load a website, the browser first reads the HTML line by line. Converts it into a DOM (Document Object Model, don't worry about that now) just think of it as a tree structure that represents our HTML structure and tells at what position what things lies in our html page, how the page content will be displayed to the user.

Then browser downloads the linked CSS & JS apply respective styles and executes scripts to add interactivity. And then it displays the final page.

In simple terms, the browser flow looks like this:

HTML → DOM → CSS applied → JavaScript runs → Final page

⚠️ Challenges / Mistakes I Faced

While learning this, though i didn't face any major issue, but i did learn something new like:

  • Understanding how browsers actually load the html page.

If you faced any issues or have any questions, do let me know in the comments 🙂

💬 Feedback & Discussion

💡 I’d love your feedback!

If you notice:

  • something incorrect,
  • a better explanation,
  • or have suggestions to improve my understanding,

please comment below. I’m happy to learn and correct mistakes.

⭐ Support the Learning Journey

If you find these notes useful:

⭐ Consider giving the GitHub repo a star —

it really motivates me to keep learning and sharing publicly.

🐦 Stay Updated (Twitter / X)

I share learning updates, notes, and progress regularly.

👉 Follow me on Twitter/X:

https://x.com/_himanshubhatt1

🔜 What’s Next

In the next post, I’ll be covering:

👉 Structure of HTML

I’ll also continue updating the GitHub repo as I progress.

🙌 Final Thoughts

Thanks for reading!

If you’re also learning HTML, feel free to:

  • follow along,
  • share your experience,
  • or drop questions in the comments 👋

📘 Learning in public

📂 Repo: https://github.com/dmz-v-x/html-101
🐦 Twitter/X: https://x.com/_himanshubhatt1
💬 Feedback welcome — please comment if anything feels off
⭐ Star the repo if you find it useful

Top comments (0)