Hello everyone and welcome back to another blog post. Today I wanted to share a basic tutorial in HTML which is a programming I’ve been learning. In this post ill explain how to create an HTML page which is the foundation of any website like this one. It’s a great place to start if you are new with coding so lets get started!
By the end of this tutorial, you’ll have a working web page that you can share with the world!
Step 1: Open a Text Editor
To get started, you’ll need a text editor. This can be any program that lets you type text and save it as a file. Some popular text editors include Notepad (for Windows), TextEdit (for Mac), and Sublime Text (for both Windows and Mac).
Open your text editor and create a new file. Save the file with the extension “.html” (for example, “my-first-web-page.html”).
Step 2: Create the HTML Structure
Every HTML document has a basic structure that you’ll need to follow. This structure consists of two main sections: the head section and the body section.
To begin, add the following line of code to your HTML file:
phpCopy code<!DOCTYPE html>
The above line tells the browser that you’re using HTML5, which is the latest version of HTML.
Next, add the html tag to define the beginning and end of your HTML document:
phpCopy code<html>
<!-- Your code goes here -->
</html>
Inside the html tag, create the head tag and the body tag:
phpCopy code<html>
<head>
<!-- Your head code goes here -->
</head>
<body>
<!-- Your body code goes here -->
</body>
</html>
The head section is where you’ll include information about your web page that’s not visible to the user, such as the title of the page. The body section is where you’ll include the visible content of your web page, such as text and images.
Step 3: Add a Title to Your Web Page
The title of your web page appears in the browser’s title bar and in search engine results. To add a title to your web page, add the title tag inside the head section:
phpCopy code<head>
<title>My First Web Page</title>
</head>
Replace “My First Web Page” with the title of your own web page.
Step 4: Add Content to Your Web Page
Now it’s time to add some content to your web page! Start by adding a heading using the h1 tag:
cssCopy code<body>
<h1>Welcome to My First Web Page</h1>
</body>
This creates a large heading that will be the main focus of your web page. You can change the text inside the h1 tag to whatever you’d like.
Next, add a paragraph of text using the p tag:
cssCopy code<body>
<h1>Welcome to My First Web Page</h1>
<p>This is my first web page, and I'm excited to learn more about HTML!</p>
</body>
This creates a block of text that appears below the heading. You can change the text inside the p tag to whatever you’d like.
Finally, add an image to your web page. Find an image online and save it to your computer. Then, add the img tag to your HTML code:
cssCopy code<body
I hope you all enjoyed this post and have a great day I’ll see you in the next one!