HTML Essentials
HTML Basics
The Skeleton of the Web
Every website you visit, from a simple blog to a complex news site, is built on a foundation of HTML. Think of HTML as the skeleton of a webpage. It provides the basic structure and holds all the content in place.
HTML, or HyperText Markup Language, provides the skeleton for your web content.
HTML isn't a programming language that performs complex logic. Instead, it's a markup language. It uses a system of tags to mark up text and tell the web browser, like Chrome or Firefox, how to display different pieces of content. For example, HTML tells the browser, "This is a heading," or "This is a paragraph."
Anatomy of a Webpage
Every HTML document follows a standard structure. This structure ensures that browsers can understand and render the page correctly. It's like a template that you fill in with your own content.
<!DOCTYPE html>
<html>
<head>
<!-- Information for the browser -->
</head>
<body>
<!-- Content for the user -->
</body>
</html>
Let's break down these parts:
<!DOCTYPE html>: This is the very first thing in your document. It tells the browser that the page is written in HTML5, the modern standard for HTML.<html></html>: This is the root element. Everything else on the page is nested inside it.<head></head>: This section contains information about the page, not the page content itself. Things like the page title (which appears in the browser tab) go here.<body></body>: This is where the magic happens. All the visible content of your webpage, like text, images, and links, goes inside the body.
Tags and Elements
HTML works by using tags to create elements. A tag is a keyword wrapped in angle brackets, like <p>. Most elements have an opening tag and a closing tag.
An element is made up of an opening tag, the content, and a closing tag.
The closing tag is identical to the opening tag, but it has a forward slash before the keyword, like </p>. Whatever content you put between these tags becomes that type of element.
<h1>This is a main heading.</h1>
<p>This is a paragraph of text.</p>
In the example above, the <h1> element creates a main heading, which browsers typically display in a large, bold font. The <p> element creates a standard paragraph.
By combining these basic building blocks, you can structure any document and create a complete webpage.
What is the primary role of HTML?
Which part of an HTML document contains metadata like the page title that appears in the browser tab?
That covers the absolute basics of what HTML is and how it works. You now know its purpose and the fundamental structure of every webpage.