What is HTML? The Fundamentals
HTML stands for HyperText Markup Language. It’s the code that forms the foundation of web pages. While you don’t see the HTML itself when you browse the web, it tells the browser how to structure and display the content you see.
Think of HTML as the blueprint for a house. It defines the rooms (headings, paragraphs, images), where the furniture goes (content placement), and leaves the interior design (colors, fonts) to a different professional (CSS, which we’ll explore later).
Lesson 1: Building Blocks
Our first lesson covers the basic building blocks of HTML:
- Elements: These are the fundamental units of HTML, written with tags surrounded by angle brackets (
<and>). For example,<p>defines a paragraph,<h1>defines a heading, and<img>represents an image. Elements typically come in pairs, with an opening tag (<p>) and a closing tag (</p>) to define the element’s content. - Attributes: These are additional details you can provide for some elements. Imagine attributes like adding a size to an image element with
<img src="image.jpg" width="300">. Here, “src” is the attribute specifying the image source, and “width” defines the image width in pixels. - Document Structure: An HTML document has a basic structure:
<DOCTYPE html>: This declaration tells the browser it’s reading an HTML5 document.<html>: This tag is the root element of the HTML document.<head>: This section contains meta information about the page, like the title displayed on the browser tab. An important element here is<title>, which defines the page title.<body>: This section contains the content displayed on the webpage itself, including your paragraphs, headings, images, and more.
Let’s Code a Simple Page!
Here’s a basic HTML structure to get you started:
HTML
<!DOCTYPE html>
<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Welcome to my website!</h1>
<p>This is my first paragraph.</p>
</body>
</html>
This code creates a simple webpage with the title “My First Webpage” and displays the heading “Welcome to my website!” followed by a paragraph.