Physical Address
304 North Cardinal St.
Dorchester Center, MA 02124
If the internet is a giant library of information, think of HTML as the fundamental language used to write the books on the shelves. Whether you are browsing a news site, checking your email, or watching a video, HTML is working behind the scenes to make it all happen.
But what exactly is it? Let’s break it down.
Table of Contents
The Definition
HTML stands for HyperText Markup Language. To understand that, let’s look at the pieces:
- HyperText: This refers to the way web pages are linked together. When you click a link and are redirected to another page, you are using “hypertext.”
- Markup Language: HTML isn’t a programming language that performs complex calculations. Instead, it is a markup language. You use it to “mark up” your content to tell the browser what each part of your document is – like saying, “This is a heading,” “This is a paragraph,” or “This is an image.”
How HTML Works: The Tag System
HTML uses tags to define elements on a page. Think of tags as containers that tell the browser how to interpret the text or media inside them.
A standard tag looks like this:
<tagname>Content goes here</tagname>Most HTML elements have an opening tag and a closing tag (which includes a forward slash /). Here are the elements you’ll see on almost every website:
| Element | Tag | Purpose |
| Heading | <h1> to <h6> | Defines titles and subheadings. |
| Paragraph | <p> | Defines a block of text. |
| Link | <a> | Creates a clickable hyperlink. |
| Image | <img> | Embeds an image onto the page. |
| List | <ul> / <ol> | Creates bulleted or numbered lists. |
The Anatomy of a Web Page
Every valid HTML document follows a standard structure. It looks something like this:
<!DOCTYPE html>
<html>
<head>
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is a paragraph of text on my page.</p>
</body>
</html><!DOCTYPE html>: Tells the browser you are using modern HTML5.<html>: The root element that wraps all the content.<head>: Contains “behind the scenes” info, like the page title and links to styling files.<body>: Contains everything you actually see on the screen.
HTML vs. The Rest of the Web
It’s important to remember that HTML doesn’t work alone. It is one of many tools used in front-end web development. Think of a website like a house:
- HTML (The Structure): The bricks, beams, and studs. It determines where the walls, doors, and windows are.
- CSS (The Style): The paint, wallpaper, furniture, and decorations. It makes the house look good.
- JavaScript (The Interaction): The electrical system and smart-home features. It makes the house “do” things, like turning on lights or controlling the thermostat.
HTML provides the skeleton upon which the rest of the web is built. Without it, the internet as we know it simply wouldn’t exist!
Where Do You Write HTML? (HTML Editors)
You don’t need special, expensive software to write HTML. Because it is just plain text, you can technically write it in any text editor, such as Notepad (on Windows) or TextEdit (on Mac). However, most developers use a specialized code editor to make the process faster and easier.
Code editors provide features like syntax highlighting (which color-codes your tags to make them easier to read), auto-completion (suggesting tags as you type), and error detection. Some of the most popular free editors include:
- Visual Studio Code (VS Code): Currently the industry standard, known for its massive library of extensions.
- Sublime Text: A lightweight, incredibly fast editor that is a favorite among minimalist developers.
- Atom: A customizable, open-source editor that is great for beginners.
Understanding HTML Files
Once you have written your code, how do you turn it into a webpage? It’s all about the file extension.
To save your work as an HTML file, you must name your document with the .html extension (e.g., index.html or about-me.html). When you save a file this way, your computer knows that it isn’t just a regular text document—it’s a web document.
When you double-click that file, your default web browser (like Chrome, Safari, or Firefox) will automatically open it. The browser acts as a translator: it reads the “markup” instructions inside your file and renders the visual page you intended. This means you can create a website on your local computer, open it in your browser, and see your changes instantly without ever needing to upload it to the internet!
The Importance of the index.html File
You will often see the main file of a website named index.html. This is a universal convention in web development. When a web server receives a request for a website, it is programmed to look for a file named “index” first. Think of it as the “home base” or the front door of your website. If you don’t have an index.html file, the server won’t know which page to show the visitor first!
