Hi there and welcome to TheITStuff’s Tutorial series for HTML. This is the very first article in the HTML tutorial series and we will be learning what HTML is and what is the structure of an HTML document. We shall begin with the very basics and go on master HTML.
What is HTML ?
HTML is short for Hyper-Text Markup Language. HTML is used all over the internet to create and view web pages. HTML is the bare bone structure of any webpage. Even this webpage that you are seeing right is made with HTML. Like other programming languages, HTML doesn’t need to be compiled, you can write HTML code and the browser will automatically generate the webpage.
That’s all you need to know as of now, We will keep discussing important concepts as the tutorial progresses.
Things you will need
- A Text Editor (I am using Notepad++).
- A Web Browser (I am using Google Chrome).
The HTML Document Structure
We write HTML in a document, it is a file that contains HTML code. Just like you have your excel and word files that you store data in, HTML files contain data too. It can be said that the HTML document is a web page and vice versa. So here is the structure of an HTML document.
Now you might be wondering what on earth this is. So let us decode this. The first thing you see is <html>, this is a tag. HTML documents have a lot of tags in them. They have different meanings and are used for different purposes.
A tag open like this <tagname> and end like this </tagname> with a backslash.
You can see that there is an html tag on the first line and a similar one on the last line. The first tag is <html> and the last tag is </html>, This means that whatever comes inside of these tags is a part of the html tag.
Next we see the <head> tag. So an HTML document has 2 parts. The first is a head which contains information about the web page like its name and other meta information. The elements from the head tag are not displayed on the webpage.
The <body> tag is what is displayed in your browser. Everything you see on your web page is a part of the <body> tag.
Now let us quickly dive into writing some code. Copy the following code and paste it in your text editor.
<p>Welcome to TheITStuff’s HTML tutorial</p>
And save the file as all files and name it index.html. I am saving it in TheITStuff folder on my Desktop for convenience).
The only addition in this code you will see is that it has a <p> tag. The <p> tag is a paragraph tag, whatever you write inside it gets outputted on the webpage. Now click on the file you have created and open it with our browser(Google Chrome for me).
You can see that some text is visible on our webpage. This is success for us. We have successfully created a webpage.
HTML(Hyper Text Markup Language) is used to make web pages. The HTML document has 2 parts, Head and Body. Head contains meta information about the webpage and body contains the things that are displayed on the web page. Various tags are used in HTML to create and define various elements on a web page.
Once you are done with this you can move over to the next part of this tutorial. If you didn’t follow something, comment it down below.