Introduction of meta tags
Invisible meta tags allow both search engines and website users to understand details about your page. In a nutshell, they are crucial for SEO since they make it easier for search engines to comprehend the subject matter of your material.
Why are meta tags important?
Search engines and website users who find your site in the SERP might learn more about it thanks to meta tags. They may be enhanced to draw attention to the most crucial parts of your content and elevate your website in search results.
Most Important meta tags with examples
Your primary and most significant anchor is the title tag. A well-written one could enhance clicks and traffic, which affect rankings to some extent.
<title>The Code Hubs</title>
Meta Description Tags
Meta description conjointly resides within the of a webpage and is often (though positively not always) displayed during a SERP snipping together with a title and page uniform resource locator. The keywords from the search question are bolded on the SERP if your description includes them. This causes you to stand out and lets the searcher apprehend specifically what they’ll expect to check on your website.
<meta name="description" content="TheCodeHubs is the best way to Browse and Learn Programming. TheCodeHubs provides strategic business solutions and develop. Best Blog Website."/>
Heading Tags (H1-H6)
Heading tags are HTML elements that separate headings and subheadings from other forms of text in your article (e.g., paragraph text). While H2-H6 tags are considered not as important to search engines, proper usage of the H1 tag has been emphasized in many industry studies.
<h1>Main Title</h1> <h2>Sub Title</h2>
Image Alt Attributes
To explain the contents of a picture, the image alt property is applied to the image element. Visitors get an alternative text message if a specific image cannot be loaded (or if the images are disabled). A page may be served for appropriate search queries if search engines can better grasp the substance of the pictures and how they fit with the rest of the content, according to Google.
<img width="167" height="60" src="https://www.thecodehubs.com/wp-content/uploads/2021/05/header_logo.png" class="custom-logo" alt="The Code Hubs">
Links on your website that go to other websites are known as external or outbound links. A nofollow property tells search engine bots not to follow the link and not to pass any link equity when added to a link.
<a href="www.example.com" rel="nofollow">example</a>
Robots Meta Tag
A page-level robot meta tag with no index attribute instructs the search engines not to index any page. According to the nofollow property, no links on the page should be followed.
<meta name="robots" content="noindex" /> <meta name="googlebot" content="noindex" /> <meta name="googlebot-news" content="noindex" /> <meta name="slurp" content="noindex" /> <meta name="msnbot" content="noindex" />
Canonical Link Tag
The canonical link tag is a way of telling search engines which version of a page you consider the main one and would like to be indexed by search engines and found by people.
<link rel="canonical" href="https://www.thecodehubs.com/" />
A specific method for arranging the data on each of your web pages in a way that search engines can understand is called schema markup.
<div itemscope itemtype="https://schema.org/Article"> <span itemprop="name">Marketing from the code hubs Blog</span> <span itemprop="author">the codehubs/span></div>
Social Media Meta Tags
Facebook first offered Open Graph to provide users choice over how a page would appear when shared on social media. LinkedIn now acknowledges it as well. Similar improvements are provided by Twitter cards, which are exclusive to Twitter.
<meta property="og:title" content="The code hubs Article" /> <meta property="og:type" content="website" /> <meta property="og:image" content="https://www.thecodehubs.com/wp-content/uploads/2021/05/header_logo.png" /> <meta property="og:url" content="https://www.thecodehubs.com/" />
Viewport Meta Tag
You may specify how a page will be resized and displayed on any device using the viewport meta element. wherever “initial scale=1” can manufacture a 1:1 magnitude relation between CSS pixels and device-independent pixels whereas taking screen orientation into consideration, “width=device-width” can build the page up to the dimension of the screen in device-independent pixels.
<meta name="viewport" content="width=device-width, initial-scale=1"/>