HTML Beginner Course

Learn HTML step by step with examples and exercises!

Lesson 1: Basic Structure of an HTML Document

Every HTML document has the following basic structure:

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
  </head>
  <body>
    Content goes here.
  </body>
</html>
        
Exercise: Create a basic HTML document with a title "My First Page" and a paragraph "Hello, World!".

Lesson 2: Headings and Paragraphs

Headings define the structure of your content, and paragraphs provide detailed text:

<h1>Main Heading</h1>
<p>This is a paragraph of text.</p>
        
Exercise: Add an h1 heading "Welcome to My Page" and a paragraph describing your favorite hobby.

Lesson 3: Links and Images

Links and images make your content more interactive:

<a href="https://www.example.com">Visit Example</a>
<img src="image.jpg" alt="Description of image">
        
Exercise: Add a link to your favorite website and an image of your favorite place.

Lesson 4: Lists

Lists are used to display related items:

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

<ol>
  <li>Step 1</li>
  <li>Step 2</li>
</ol>
        
Exercise: Create a list of your top three favorite movies.

Lesson 5: Tables

Tables organize data into rows and columns:

<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>30</td>
</tr>
</table>
    
Exercise: Create a table with three rows showing your favorite foods and their prices.

Lesson 6: Forms

Forms collect input from users:

<form action="/submit" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<button type="submit">Submit</button>
</form>
    
Exercise: Create a form asking for a user’s name and email, and include a submit button.

Additional Resources

For further learning, check out these links: