HTML meta tags are used to provide metadata about an HTML document. Metadata is information about the document that is not visible on the web page but is used by browsers, search engines, and other services to understand and manage the content.
I will talk about most commonly used meta tags :-
<meta charset=”utf-8″ />
Defines the character encoding for the HTML document. UTF-8 is a common encoding that supports many languages.
<meta name=”viewport” content=”width=device-width, initial-scale=1″ />
It controls the layout on mobile browsers. Ensures the page is responsive and scales correctly on different devices.
<meta name=”theme-color” content=”#000000″ />
It is used to specify the color of the browser’s toolbar or address bar when your website is viewed on mobile devices. This helps enhance the visual experience by integrating the site’s color scheme with the browser interface.
<meta name=”google-adsense-account” content=”ca-pub-yourId” />
Google AdSense provides a specific code snippet to place in the HTML of your web pages. This code includes JavaScript that loads ads on your site. But the first step is to verify that you own the website for which you want to publish ads on and hence this meta tag helps “Google AdSense” in verification.
<meta name=”description” content=”Balance karma serves content at your screen from different categories like coding, travel, karma etc” />
Provides a brief description of the page. Search engines often use this in search results hence be specific about what does your site serves.
Open graph specific meta tags
What is open graph? It is generally used for Facebook and other social media platforms to enhance how your content appears when shared. Includes properties like og:title, og:description, og:image, og:url, and og:type.
It basically show your website in cards’ format when you share a link somewhere like linkedin, facebook or any other social media platforms.
Twitter specific meta tags
Same like open graph, it provides information for Twitter cards, which are used to display rich media content in tweets. Includes properties like twitter:card, twitter:title, twitter:description, and twitter:image.
