How to Code HTML

by

HTML (Hypertext Markup Language) is a fundamental building block of the World Wide Web(WWW), serving as the backbone for creating static web pages.

Previous Topic – Before getting started, You should have knowledge of HTML Introduction

It is a markup language that structures the content of web documents in a proper format and allows them to be displayed on web browsers.

To use the power of HTML, you only need two required tools: a text editor and a web browser. Here, we will the basic steps to code in HTML.

Steps to code HTML

Step 1: Set Up Your Environment

Make sure you have already installed a text editor or code editor on your system.

You can use any one of the popular editors like Visual Studio Code, Sublime Text, Notepad++, and Atom.

Step 2: Create a New Folder

First of all, Create a new folder in anywhere your system.

Suppose that you have created a folder with the name ‘html-webpage‘

Step 3: Create a New HTML File

Now, Open the ‘html-webpage‘ folder in your text editor and then create a new file named ‘index.html within this folder.

Step 3: Write HTML Basic Code

Now, write HTML code with some basic HTML elements work together to create the structure and content of a web page. They provide essential information to browsers, search engines, and users to display & index web page in a proper format.

File Name – index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Your Page Title</title>
</head>
<body>
    <!-- Your content goes here -->
</body>
</html>

Steps to write code:

  • First of all, At the top of the page, Use <!DOCTYPE html>  to declare HTML5.
  • Declare the <html> as  the root element to wrap your entire content.
  • Declare <head>, to include metadata such as character encoding and title.
  • Specify character encoding with <meta charset="UTF-8">.
  • Write your page title using <title></title>.
  • Declare <body> Include metadata to add all visible content.
  • Write comment <!-- Your content goes here --> to mark where your content should be inserted.
  • At last, Close the HTML document with </html>.

Step 4: Add Content

Now, You can add content with the <body> tag to display on the web browser.

This is your initial time to learn HTML. So, You can add content using two basic element such as <h1></h1> & <p></p>. So, Write a heading of the content within the <h1> taga and a description within the <p>.

File Name – index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>HTML Basic Page</title>
</head>
<body>
    <!-- Your content goes here -->
    <h1>HTML Basic Page</p>
    <p>This is the html basic page.</p>
</body>
</html>

Step 5: Save and View

Now, Save index.html file by pressing ctrl + s keys of your system keyboard or you can use the editor saving option.

Step 6: Preview Your Page

Now, Open index.html file in your web page  to display the content.

Suggestion

That’s the basic process for coding in HTML. As you become more proficient, you can explore more advanced HTML features, CSS for styling, and JavaScript for interactivity to create more dynamic and engaging web pages.

We’ve shared a simple steps with you to code HTML. You’re now familiar with HTML and understand why it’s important to learn.

If you found this tutorial helpful, please share it with your friends so they can learn too

Next Topic – Now, You should learn HTML Tags