—HTML Series · Post 01: HTML Foundations
HTML Foundations
You've heard the acronym. You've maybe even Googled it at 1am. Let's strip away the intimidation and talk about what HTML really is — no gatekeeping, no jargon spirals, just the truth.
Real Talk: What HTML Actually Is
HTML stands for HyperText Markup Language. Let's immediately make that less intimidating by translating it into human:
HyperText = text that can link to other text. That's it. When you click a link on a website and it takes you somewhere new? That's "hypertext" doing its thing. It's been around since the 1990s. Not new. Not complex. Just… clickable text.
Markup Language = a system of labels that you wrap around your content to tell the browser what that content is. "This is a heading." "This is a paragraph." "This is an image." You're literally labeling things.
That's the whole thing. HTML is a labeling system for content. You take words, images, and links — and you wrap them in labels so a web browser knows how to display them.
Imagine you're organizing a bookshelf. You're not writing the books — you're deciding which shelf they go on, which ones face outward, and which ones get grouped together. HTML is the organizing. The content already exists. You're giving it structure.
If you've ever made a to-do list, organized files into folders, or written an outline for a school paper — you already understand the core concept behind HTML. You've been "marking up" information your whole life. You just didn't call it that.
It's Not a Programming Language (And That's Fine)
Let's address the elephant in the room, because someone on the internet is going to say it to you eventually:
"HTML isn't a real programming language."
They're technically right. HTML doesn't do math. It doesn't make decisions. It doesn't loop through data or respond to logic. Programming languages like JavaScript and Python do those things. HTML does not.
HTML is a markup language — it describes structure, not behavior. And here's what the gatekeepers won't tell you: that doesn't make it less important. It makes it foundational.
Every website you've ever visited — Google, Instagram, Amazon, your favorite blog, that weird recipe site with 47 pop-ups — all of them are built on HTML at their core. Literally every single one. The fanciest React app in the world? It renders HTML in the browser. The most complex web application on the planet? HTML underneath.
So when someone says "HTML isn't a real language," what they really mean is "I don't understand what foundations are." Smile. Keep learning. You're building the thing that makes everything else possible.
Nobody ever looked at the foundation of a house and said "that's not real construction." The foundation is literally what holds everything up. That's HTML.
How Websites Actually Get Built
A website is made of three core technologies, and they each have a specific job. Think of building a house:
Right now, we're focused on HTML — the foundation that CSS and JavaScript build on top of. You wouldn't hang curtains in a house that doesn't have walls yet. Structure first. Always.
Here's a quick peek at how the three layers look in code — don't worry about understanding the CSS or JavaScript parts right now. Just notice how they're three separate layers, each with its own job. HTML comes first.
<!-- HTML: the structure -->
<button>Sign Up</button>/* CSS: the style */
button {
background: #c94277;
color: white;
padding: 12px 24px;
border-radius: 8px;
}// JavaScript: the behavior
button.addEventListener('click', () => {
alert('Welcome to CodeHerWay!');
});What Your Browser Does With HTML
When you type a URL into Chrome, Safari, Firefox, or whatever browser you use — here's what actually happens behind the scenes:
All of this happens in milliseconds. But the critical thing to notice: HTML is always first. It's the document the browser reads before anything else. Without it, there's nothing for CSS to style and nothing for JavaScript to interact with.
Fun fact: you can see the raw HTML of any website. Right-click on any page and select "View Page Source." That wall of code? That's the HTML. Every website's code is visible to everyone. The web was built on openness.
Why Beginners Get Overwhelmed (And How to Stop)
Let's be honest about something. Learning to code — even just HTML — can feel overwhelming. And there are real reasons for that. Let's name them so they lose their power:
1. The "Wall of Code" Effect
You open a tutorial and see 30 lines of code and your brain goes: "I will never understand this."
2. Unfamiliar Syntax
Angle brackets, forward slashes, attributes, tags — it feels like a foreign language because it literally is one.
3. The Comparison Trap
You see someone on Twitter posting a full website they built and think "I'm so behind."
4. Tutorial Overload
There are 10,000 HTML tutorials online and they all teach slightly differently. It's paralyzing.
"I don't get it" doesn't mean you're bad at this. It means your brain is building new neural pathways. That uncomfortable, foggy feeling? That's literally what learning feels like. It's not a sign to stop — it's a sign that something new is forming. Stay in the fog. It clears.
Your First HTML Page — Yes, Right Now
Enough theory. Let's build something. This is the simplest possible HTML page — and it's a real, legitimate webpage:
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Hello, world. I'm learning HTML.</h1>
<p>This is my first webpage and I built it myself.</p>
</body>
</html>Let's walk through every single line so nothing is mysterious:
Notice the pattern: almost everything comes in pairs. <h1> opens, </h1> closes. The forward slash means "this is the end." Content goes between the opening and closing tag. That's the entire concept.
Plain? Absolutely. Ugly? Kind of. But it's real. That is a genuine, functioning webpage. Every complex site you admire started from something exactly like this. The styling comes later with CSS — right now, you built the bones. And the bones work.
How to Actually Create This File
In VS Code, type ! and press Tab. It auto-generates a complete HTML starter template. Try typing it manually a few times first so you understand what every line does — then use the shortcut. Understand first, optimize later.
I'm going to tell you something that most "learn to code" content won't: I didn't understand HTML the first time I tried to learn it.
I remember staring at angle brackets feeling like I was reading hieroglyphics. I remember closing a tab on a tutorial 4 minutes in because it already felt like too much. I remember thinking "maybe coding just isn't for me" — which is one of the most dangerous sentences a beginner can say to herself.
It was for me. It just wasn't for me yet. I needed time. I needed a second attempt. I needed someone to explain it in a way that didn't make me feel like I was already supposed to know it.
So if you're reading this and the code examples feel weird and foreign — good. They're supposed to feel that way right now. You're not behind. You're at the beginning. And the beginning is the hardest part, not because the material is hard, but because your brain hasn't built the pattern recognition yet.
It will. Give it a few posts. Give it a few practice sessions. Give it a few moments of "oh wait, I actually get that." They're coming. I promise.
🏆 Mini Build: Your "Hello World" Page
Create your first HTML file from absolute scratch. Don't copy-paste — type every character. Your page should include:
Bonus: Change the text inside the <h1> and refresh the browser. Watch it update. That immediate feedback loop? That's one of the best things about web development. You change code. You see results. Instantly.
What's Coming Next
In the next post, we're going to break down the building blocks of HTML — tags, elements, and attributes. You'll learn the three words that everything in HTML is built from, and you'll start to see the patterns that make HTML predictable instead of mysterious.
You've already taken the hardest step: starting. Everything from here is building on what you just learned.
Before you move on, check in with yourself. Are you comparing yourself to anyone right now? Are you judging how fast you're going? Let that go. The only person you need to be ahead of is who you were before you opened this page. And you're already ahead.
