Introduction to Basic HTML for Beginners (Age 12+)

Learn the fundamentals of HTML, perfect for beginners aged 12 and up, and start building your own web pages today!

PDF

Understanding Basic HTML

HTML, or HyperText Markup Language, is the standard language used to create web pages. It provides the structure of a webpage and is a foundational skill for anyone wanting to build a presence online. In this guide, we will go through the basics of HTML step by step.

Step 1: The Basic Structure of an HTML Document

Every HTML document follows a specific structure. Here’s a simple example:

<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
</head>
<body>
    <h1>Hello, World!</h1>
    <p>This is my first paragraph of text on my web page.</p>
</body>
</html>

The above code contains:

  • <!DOCTYPE html>: Declares the document type and version of HTML.
  • <html>: The root element that contains all the other HTML elements.
  • <head>: Contains meta-information about the document, like the title that appears on the browser tab.
  • <body>: Contains the content of the webpage that users will see, such as text and images.

Step 2: Adding Content to Your Web Page

Within the <body> tags, you can add various types of content:

  • <h1> to <h6>: Heading tags, where <h1> is the largest and <h6> is the smallest.
  • <p>: Paragraph tag for writing text.
  • <a>: Anchor tag to create hyperlinks.
  • <img>: Image tag to display images. (e.g., <img src='image.jpg' alt='Description'>)

Step 3: Saving Your HTML File

Once you've written your HTML code, you need to save the file with a .html extension. For example, you can name your file index.html.

Step 4: Viewing Your Web Page

To view your webpage, open the saved HTML file in a web browser (like Chrome or Firefox). You should see your content displayed just like it would appear on the internet.

Step 5: Next Steps

Now that you've created a basic HTML page, explore different HTML tags and attributes to personalize your website further. Websites like W3Schools offer great resources to learn more.

Happy coding!

Ask a followup question