Setting Up Your First HTML Page
Write your first HTML code using a simple text editor.
Setting Up Your First HTML Page is a free HTML for Kids lesson on CoddyKit — lesson 4 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the HTML for Kids learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
1
Setting Up Your First HTML Page
Welcome to the most exciting part of learning HTML! Today, we’ll create your first HTML page from scratch. Get ready to see your code come to life!
2
Tools You Need
To create an HTML page, you only need two things:
- A Text Editor: Examples include Notepad (Windows), TextEdit (Mac), or any other editor like VS Code.
- A Web Browser: Chrome, Firefox, or any browser to view your page.
Let’s start coding!
3
Step 1: Open Your Text Editor
1. Open your text editor (like Notepad or VS Code).
2. Save a new file as index.html. Make sure to include the .html extension!
Now we’re ready to add some HTML code!
4
Step 2: Write the Basic Structure
Every HTML page needs a basic structure. Type the following code into your file:
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<!-- Content goes here -->
</body>
</html>5
Step 3: Add a Heading
Inside the <body> tag, add a heading to your page:
<h1>Welcome to My First Web Page!</h1>
6
Step 4: Add a Paragraph
Below the heading, add a paragraph describing your page:
<p>This is my first web page, and I’m learning HTML. It’s so much fun!</p>
7
Step 5: Save and Open Your Page
1. Save the file after writing your code.
2. Open your browser.
3. Drag and drop the index.html file into the browser window.
Voila! Your first web page is live!
8
Your Complete HTML Page
Here’s what your final code should look like:
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body>
<h1>Welcome to My First Web Page!</h1>
<p>This is my first web page, and I’m learning HTML. It’s so much fun!</p>
</body>
</html>
9
<!DOCTYPE html>
<html>
<head>
<title>My Awesome Page</title>
</head>
<body>
<h1>Hello, World!</h1>
</body>
</html>
10
Great Job!
Congratulations on creating your first HTML page! You’ve learned how to set up the basic structure, add a heading, and write a paragraph. In the next lesson, we’ll learn how to add more exciting elements like images and links to your page. Keep up the great work!
Frequently asked questions
Is the “Setting Up Your First HTML Page” lesson free?
Yes — the full text of “Setting Up Your First HTML Page” is free to read here on the web, and the HTML for Kids course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the HTML for Kids course, upgrade to CoddyKit PRO.
What will I learn in “Setting Up Your First HTML Page”?
Write your first HTML code using a simple text editor. You practise HTML for Kids with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start HTML for Kids?
No prior experience is required. HTML for Kids on CoddyKit is structured for beginners through advanced learners; this is — lesson 4 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “Setting Up Your First HTML Page” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this HTML for Kids lesson?
Yes. Every HTML for Kids lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.
All lessons in this course
- What is HTML?
- HTML Structure: The Building Blocks
- HTML Tags and Elements
- Setting Up Your First HTML Page