Hackernoon logoBasic HTML Tags Classification by@armand-dongmo

Basic HTML Tags Classification

Author profile picture

@armand-dongmoArmand Dongmo

An HTML tag is a special word or letter surrounded by angle brackets, < and >. HTML tags are the hidden keywords within a web page that define how your web browser must format and display the content. Most tags must have two parts, an opening and a closing part.
For example, <html> is the opening tag and </html> is the closing tag. Note that the closing tag has the same text as the opening tag, but has an additional forward-slash ( / ) character in some cases Imagine HTML tag as a house which has a door through which you can enter and come out.
Every content on a web page or browser is embedded inside an HTML tag.

HTML Tags Can Be of Two Types
1. Paired Tags
Paired tags have an opening and closing tag. The opening tag is similar to the single tag
, and the closing has first slash
, between them, write some content (text, images or something else) and for this, they are called containers.
Attachment of tags (descriptors, containers) are allowed.
2. Singular Tags
A tag is set to be a singular tag when there is no closing tag for that or Tag is said to be singular tag when there is no companion tag.
For example, we have only one tag which doesn’t require any closing tag and it must always be a single tag, that is why it’s called singular tag Singular Tags are also called:
Example: <br />, <hr />

3. Meta Tags
Meta Tags are those tags which are used in the
section of the website, which provides relative data about the web-page to the search engine.
For example, we use meta keywords for a single page of our website if you right-click on this web page and view source, then you will see in the header section there are meta tags used, which carry Meta title, Meta keywords, and Meta description.
That keywords and description are used for the search engine to know what the page is about.

Division of Tags Based On Their Usage
Tags can be differentiated based on the purpose of usage. There are four types

1. Formatting Tags
These are HTML tags of words or letters to control font size
, underline a part of a text
, making a text bold
Others such as tables, div, span tags are used for layout and formatting of content.

2. Page Structure tags
Description, title, head, body etc are part of the page structure tags.
They are part of the basic HTML page and does not directly affect the formatting of text or image.

3. Control Tags
Form tags, Script tags, Radio buttons etc are part of the control tags.
These tags are used to manage content or mange external scripts or libraries (JQuery, Bootstrap)

4. Interactive Tags
All form tags like input text box, drop-down list, radio buttons etc are used for interaction with a user.
These tags can be formatted by using style properties.

Importance and Uses of Html Tags
Html tags are the first signs to show you that you are working with a web page browser.
Html tag is used to identify different parts of the page in a semantically consistent way, meaning that without these tags the page would just be raw text and it will be difficult to include images.
This is because there would be no way for the browser to tell the difference between the regular text on the page and the code that identifies the source of the image on the webserver.
Tags also give you a way to tell the browser how to style various page through CSS like giving colour and other arrangements.
Html tags are also important in that they help to create a structured document by using paragraph, character formatting, links and lists.
The acts as a house to embed text, images, multimedia (such as video and audio), and links to other documents and the web pages. This affects the behaviour and design of the web page.
Imagine a house without paint, just empty cement bricks or moulded or a human being who is naked ground. CSS now come to play with the design of the web browser of painting it, wearing it a dress.
Because it is a house that has the paint not paint having a house, a human being has dresses, not dresses that have a human being.


The Noonification banner

Subscribe to get your daily round-up of top tech stories!