An Introduction to HTML

I have been waiting for long to start with my HTML tutorials. Finally i am beginning with my very first HTML Tutorial. This is going to be a beginner level tutorial so even if you have no past knowledge of coding, you can understand this with ease. And if you are already an expert then this may help you to revise your basics. So lets begin !

My view of learning any language is to learn by examples, so i would present a simple example below. This example will help us to understand the HTML language.

Explanation of the Example above :

  • The DOCTYPE declaration defines the document type of your web page
  • The text between <html> and </html> is where our html code will reside
  • The text between <body> and </body> is the actual content of our page
  • The text between <h1> and </h1> is first level heading.
  • The text between <p> and </p> is displayed simply as paragraph

What is HTML ?

  • HTML stands for Hyper Text Markup Language
  • Since it is a markup language, it consists of several markup tags.
  • The tags will help to describe content of our document.

What are HTML Tags ?

  • As mentioned before, HTML has markup tags.
  • Markup tags are also referred to as HTML tags.
  • HTML tags are simply keywords along with angle brackets.
  • Most of the HTML tags are paired. Eg: <p> and </p>
  • The first one is start tag and next one is end tag.
  • The end tag is same as start tag, just that it has a forward slash in front of tag name.
  • Start tag and End tag are also referred to as opening and closing tags

What are HTML Elements ?

Do not get confused with Tags and Elements. Even though they both are used to describe the same thing, they are actually different in nature and definition.

HTML element is the content between start tag (opening tag) and the end tag (closing tag).

For eg: <p> This statement is the element </p>

How to see the output of our code?

  • Just copy paste the code given at the top of this post into a text editor such as notepad.
  • Then click File > Save as
  • Select save as type as “all files”
  • Name your file as “test.html”
  • .html is the extension of HTML web pages.
  • And save your file (preferably save it on your desktop)
  • Just open the file and you will see your output, i.e the webpage on your web browser.

Below is the screenshot of how it would look like in your web browser.

Next HTML Tutorial: Adding Hyperlinks in HTML

Leave a Reply