Usually, people land up on websites through search engines. Wouldn’t it be beneficial if they get an idea beforehand what the page is all about, when was it published and who published it. This would not only help them to land into a better website but would also give them an idea what to expect from the same. And all these things are achieved from the HTML meta tags.


What are HTML Meta Tags?

The Wikipedia defines an HTML meta tag as a special tag that provides information about a web page. Unlike normal HTML tags, meta tags do not affect how the page is displayed.Instead, they provide information such as who created the page, how often it is updated, what page is about and which keywords represents the page content.

All the search engines use this information when building their indices. It also does some of the browser work such as refreshing the page, determining and setting the width, default zoom, and other web page properties. What’s even more about them is, they have a lot of value in SEO and determines the search engine ranking of a web page.


A general meta tag looks like this,

<meta name=” ” content=” ”/>


These meta tags have few attributes in it that are scanned by the search engine bots to process the information about the page. The name attribute is more like the handler for a particular meta tag. The content is the value of that meta tag. Since these tags do not display on the web page, you can stuff them with the information you think is valuable for your website.


Some of the most used HTML meta tags.

Many meta tags have been developed with the time and obviously not all of them don’t contribute to your website rankings. Different meta tags do different things upon call. Let us check the most useful and standard HTML meta tags.  


  • Title tag: The title tag is a special kind of tag and is probably the most important meta tag in your page. It specifies the title of the web page document. Apart from notifying the search engines, it also represents the tabs of the modern browsers while multiple tabs are open simultaneously.

The format for the title tag is,

<title>Devstreak Homepage</title>


  • Description tag: The description meta tag is much like the subject of the document. It describes what your web page is about and what it is offering the readers.

The format for the description meta tag is,

<meta name="description" content="This is where you put your site’s summary"/>


  • Viewport tag: This meta tag determines the viewport area. It gathers the data about the screen size and generally used for creating the fluidic or responsive design layouts. Also read, why does responsive website design matters.

The format for the viewport meta tag is,

<meta name="viewport" content="width=device-width, initial-scale=1">


  • Http-equiv tag: Using these tags you can add a particular type of values to your website, such as adding cookie expiration date, remove the cache after the visitor leaves your website, automatically refresh the page, do not allow to display your website in a frame. You can find more details about them from page. You can assign http-equiv meta tag using
<meta http-equiv=”refresh” content=”30”/>


Other information HTML meta tags provide

Apart from providing information to a search engine, these meta tags can provide other secondary data such as the author information using the author meta tag. You can also supply your contact details through the contact meta tag. To own the copyright of the page or article, you can implement a copyright meta tag that tells the copyright information.

You can also set the redirection to another page or link through it. Even more that you can do with them is prevent or disable the browser’s default actions such as dialing a number placed after ‘tel’ in link tags.


Why are they so important?

As you know the power of HTML meta tags and what they do, you can provide information for your users and for the search engines bots too. But HTML meta tags are important when we talk about the social meta tags. Social Media is obviously a great place for content discovery, but often the metadata created for search is not enough to encourage people to click through therefore it is best to use the meta tags each social platform provides.


The Facebook’s Open Graph very well supports the meta tags that enables people to share the content (or the excerpt) to their Facebook profile. The Open Graph allows you to specify metadata to optimize how the content appears when it is shared. The added benefit of using this data is that you can obtain some interesting data about the users checking out your content via Facebook Insights. If you don’t use the Open Graph tags then, Facebook will switch to the default metadata.

Twitter, the other popular social networking website, rather a traffic ground for most of the online businesses, also supports the use of the meta tags in Twitter cards. It works almost the same way like the Open graph. The other benefit you get is, it makes your shared card a little bit distinguished, so it looks unique from the other cards.   


Meta tags play a significant role in SEO as well. If you are running a blog or a content based website, then you must be familiar with the term Search engine optimization. The meta tags are required for gathering the information about what that page consists. The search engines process these meta tags and compare them with what actual content the readers see to verify what it has been ranked for. For SEO, the title, description, and keywords meta tags would work. Even if meta tags do not hold much value to page ranking, their importance is still present as the search engine robots validate their relativity to your content and site niche.



HTML meta tags are very important tags in HTML especially when are you are creating a content based website. They provide information to search engines, Social media shares, Website Analytics, SERP rankings and such others. They also let visitors to know beforehand what can they expect from your website, which increases the trust factor. They also help in setting up the screen sizes and initial zoom. Make sure you use them wisely and avoid the meta tags such as refresh and robots.


What do you think about the meta tags? Do share your comments and thoughts with us.

Share on Facebook Tweet on Twitter Post on Google+ Buffer