If you’re just starting your journey in web development, learning how to create a simple “Hello World” page using HTML is the perfect first step. HTML (HyperText Markup Language) is the standard language used to create web pages. This basic “Hello World” example will help you understand the building blocks of a webpage and how HTML works.
In this guide, we’ll walk you through the simple steps to create your first HTML page. Whether you’re a beginner or someone looking to refresh your knowledge, this tutorial is beginner-friendly, easy to follow, and a great introduction to front-end development.
What is HTML?
HTML stands for HyperText Markup Language. It is the foundation of any webpage and is used to define the structure of web content. It tells the browser what to display and how to display it.
Some common elements in HTML include:
- <html> – the root element
- <head> – contains meta information about the webpage
- <body> – contains the content visible on the page
If you’re looking to get into web development, learning HTML is your first step before exploring CSS, JavaScript, and advanced frameworks.
Why Start with a “Hello World” Page?
The “Hello World” page is like a welcome message to the world of coding. It’s a simple exercise that helps you:
- Understand how an HTML file is structured
- Get familiar with HTML tags
- Gain confidence to build more complex pages later
This is often the first HTML page created by every new developer. Let’s learn how to do it.
Full Stack Developer Course Online
Start Your Web Journey with Just One Line Hello World in HTML!
Tools You Need
To write and run your first HTML code, you don’t need any special tools. Just these two:
- A text editor – like Notepad (Windows), TextEdit (Mac), or VS Code.
- A web browser – like Google Chrome, Firefox, or Safari.
Step-by-Step Guide to Create a “Hello World” HTML Page
Follow these steps to create your first webpage:
Step 1: Open Your Text Editor
Open any simple text editor. For beginners, Notepad or VS Code is ideal.
Step 2: Write the HTML Code
Copy and paste the following beginner HTML code example into your text editor:
html
Copy & Edit
<!DOCTYPE html>
<html>
<head>
<title>Hello World Page</title>
</head>
<body>
<h1>Hello, World!</h1>
</body>
</html>
Explanation of the Code:
- <!DOCTYPE html>: Declares the HTML version.
- <html>: The root element of your page.
- <head>: Contains metadata like title and links.
- <title>: Sets the title shown on the browser tab.
- <body>: Contains everything that will be displayed on the screen.
- <h1>: A heading tag used to display “Hello, World!” in bold and large font.
This code gives you the basic HTML structure needed to start.
Step 3: Save the File
Now save the file with an .html extension. For example, save it as:
CopyEdit
hello-world.html
Make sure you choose “All Files” in the “Save as type” dropdown (if you’re using Notepad).
Step 4: Open the HTML File in a Browser
Locate the saved file and double-click it. Your default browser will open and you will see:
Hello, World!
Congratulations! You’ve just created your first HTML page.
What’s Next?
Now that you’ve created a simple web page, you can explore more HTML tags like:
- <p> for paragraphs
- <a> for hyperlinks
- <img> for images
- <ul> and <li> for lists
This is the stepping stone to learning front-end development. With a solid grasp of HTML, you’re ready to build full websites, style them with CSS, and add interactivity using JavaScript.
Learn Full Stack Development with Pay After Placement
If you’re serious about becoming a web developer and want to take your skills beyond HTML, Sharpener offers a Full Stack Development Course that covers
- HTML, CSS, JavaScript
- React, Node.js, MongoDB
- Real-world projects and live mentorship
What makes Sharpener special? You only pay after you get placed in a job. That means you can start learning now and focus on building skills without worrying about fees.
Zero upfront payment
Job-focused training
Designed for beginners and career switchers
Join Sharpener’s Full Stack Course Now and launch your developer career confidently!
Conclusion
Creating a “Hello World” page using HTML is a small but powerful first step into the world of web development. This simple exercise gives you hands-on experience and sets the foundation for building websites and web applications.
