Learn The Basic Fundamentals of HTML Tags | Start Creating And Designing Your Web Site By Yourself

To build a responsive website, you have to be familiar with the basic fundamentals of html tags. If you are scared of coding, I will tell you that it is very simple to learn and you will enjoy it.

 I assure you that this tutorials will be self explanatory with examples and videos attached to it, for your better understanding. 


HTML Tags: Understanding What Is HTML?

The acronyms HTML stand for Hyper Text Markup Language. It is the standard markup language for creating a web page. In addition, it is the foundation when it comes to web development.

It describes the structure of  web pages using markup and it element are represented by tags. I urge you to calm down and learn the html Tags line by line.

What is HTML Text Editors?

HTML codes are written using html text editor. In this article, I will explain what is html text editor and also recommends some text editor you will use.

 HTML text editor is software for editing Html codes. This html text editor understands html tags

Web pages can be created and modify using html text editor. However, they are many free text editors that you can use to edit html codes, some of them are notepad, notepad++, sublime etc.

 I suggest as a beginner, you should start with simple text editor which is notepad. But if you want to use sublime, you can click here to DOWNLOAD SUBLIME TEXT 3 EDITOR

Easy way to Access Notepad In Your Laptop

Follow the steps below to access notepad in your laptop or system.

  •         Click on window symbol on your laptop ( the window symbol is located at the left bottom corner of your screen)
  •        Type notepad

Definition of html tags

In this section, I will advise you to switch on your laptop, open your notepad (following the steps above) and be ready to create your first web page.

HTML tags is the root of all html documents. However, it acts as a house or a container for all other html elements (except <!DOCTYPE> tag).


The html opening tag written as <html> is used for every html document to tell the browser that this is html document.

Note: Every open tag <html> must be closed </html> for proper functioning of the web page. That means any tag you opened, you must close it as well.

In this section, we shall use the following tags, as we proceed you will learn more. 

  •         <!DOCTYPE> define the type of the document.

  •         <html> tag: it Is used at the start of every html document and it must be closed at the end of every html documents. Example <html> </html>. It defines the html documents.

  •        The <head> tag: it gives the information about the document. <head> tag contain <title>, <link>, <meta>.

I will explain them one after the other. 
  •    The <title> tag describes the title of the document. That means, the name of your web page goes here.
  •    The <link> tag linked your external file if any. 
  •    The <meta> tag is used for search engine optimization.

Note:  Content in the <head> tag will not be displayed on the web browser; they are use for better functionality of the web page.

  •         The <body> tag defines the document’s body. Only the content inside the <body> tag are seen on your web browser. The <body> tags contain many other tags; we will look at them one by one.

o   <h1>  to <h6> use for heading
o   <p> define the paragraph
o   <br> skip to the next line
o   <b> make text bold
o   <i> make text to be in italic form
o   <address> is used when writing address
o   <!—comment--> is used to describe the work of a particular code and it is ignored by the compiler.

How to use the html tags

In this section, you will learn how to create your first html document using the html tags mention above. I advise you to practice it with your laptop. When you open your html text editor (type the following codes).

<!DOCTYPE html>



            <title>Page Title</title>



<h1> My first page</h1>

<p>This is a paragraph</p>


Note: Every opening tag has a closing tag ( eg <title>…</title>, the first one <title> is called opening tag and the second one </title> is called closing tag). Also take note of the arrangement. 

To see what you have done, save the work with extension .html (example, index.html).
Open the saved (index.html) work with your browser (chrome browser or any other browser).

Congratulation, you just create your first html page.


No comments:

Powered by Blogger.