Meta Tags for beginners...

Meta Tags for beginners...

Many of us heard about this term meta tag in web development, but how many of us know about it well, how many of us know at least why it used for , how it affects things , what it does. If you were looking for this explanation, then you are at right place. You will be satisfied after reading this article.

What is Meta

meta means data about data. In our html document we provide this meta tag inside head tag(meta tag is self closing tag).

<head>
  <meta charset="UTF-8">
  <meta name="description" content="Free Web tutorials">
  <meta name="keywords" content="HTML, CSS, JavaScript">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

by definition of meta we can say that that it is data that tells web browser what web page is about ,helps in website SEO by defining keywords, by adding description, etc. I have given some examples with little bit explanation so that you can understand.

As same as other html tags it also have attributes.

as you can see in below code. it is having two attributes : name , content

<meta name="keywords" content="HTML, CSS, JavaScript">

in above examples we can see name= keywords and in content there are keywords. above example helps in SEO, there are also other meta tag attributes value we can give to improve SEO of our website which are description , author ,etc.

<meta name:"description" content:"website to learn web development. Become pro in web">

Screenshot 2022-07-16 183745.png in above image we can see lines after title are result of description meta tag.

note: if you dont provide meta tag in html , browser will display first two lines of your first article on in search result.

<meta charset="utf-8">

In above we are specifying character set that browser will use on webpage. We don't need to always put it , because it by default in HTML5, but it is good practice to put , if you want to use some other charset.

read this article to know more about character encoding w3.org/International/questions/qa-what-is-e..

  <meta http-equiv="refresh" content="2">

in above use of meta tag in every 2 seconds page will refresh.

So I think you got some Idea about what meta tag is. For summary I will tell that is tag which provides some information to browser which other tags cant provide directly. It helps in website SEO, character encoding , etc.

thanks for reading