First program in HTML

In this article, we will show you how to make your first website using HTML.

To start, we first need a text editor available. on Windows, macOS, and most Linux distributions, there is an inbuilt text editor available, but for more advanced editing, we can download Notepad++, Visual Studio Code, or Sublime Text. Links for their downloads can be found here.

Now that we have a text editor installed, we can proceed to programming in HTML.

The first thing that we need to do is to add the html tags at the top and the bottom. A tag pair is composed of an opening tag (<example>) and a closing tag (</example>). Inside, we need to add head and body tags inside the head tag. The final result will look like this:

The html tags tell browsers that HTML code is coming. the head tags contain scripting code that the rest of the HTML may need, and the body tags contain the html that makes up the actual website. Save the file as a Hyper Text Markup Language file and open it in a browser. You should get this result:

The reason nothing shows up is because we did not mention anything inside of the body tags. Let us add a title. To add a title (or header), we use the h1 tags. We put the tags inside of the body tags like this:

We can also add a title to our website by using the title tags which we can put inside of the head tags:

Save the file and reload the webpage. You should now see a result like this:

Note the "Demo" name at the top of the browser window. That was from our title tag in the HTML file.

Congratulations! You just made your first website using HTML. Note that you will not be able to view this on another device because this is currently on your local computer (the exception is if you use replit). However, in a future tutorial, we will show you how to host your website.

Challenge 1: Add some more text and content to this website by using more h1 tags. Note that apart from h1, there is also h2, h3, h4, h5, and h6 tags. The difference is that each tag is smaller than the previous one.