RGB Web Tech

RGB Web Tech

Meta Canonical

Meta Canonical - RGB Web Tech, Boost SEO with the Canonical meta tag to prevent duplicate content issues, improve site rankings, and enhance search engine visibility effectively.

Comprehensive List of Essential Meta Tags

Updated on January 15, 2025 by RGB Web Tech

Comprehensive List of Essential Meta Tags

Introduction to HTML Meta Tags

HTML meta tags are essential elements placed inside the head section of an HTML document. They don’t influence the visible content on the webpage but deliver crucial metadata to web browsers, search engines, and other online services. These tags help with rendering, SEO, and social sharing by providing specific instructions or information.

Essential HTML Meta Tags

Below are some of the most commonly used basic meta tags that play a vital role in website performance and visibility:

1. Viewport Meta Tag

This tag controls the layout and scaling of the webpage on different screen sizes, especially mobile devices.

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

2. Title Tag

Defines the title of the webpage shown in browser tabs and search engine results.

<title>Your Page Title</title>

3. Meta Description Tag

Provides a summary of the page’s content. Often displayed below the title in search results.

<meta name="description" content="A brief description of the webpage.">

4. Charset Meta Tag

Specifies the character encoding, ensuring proper display of text.

<meta charset="UTF-8">

5. Author Meta Tag

Credits the content to its author or organization.

<meta name="author" content="Author Name or Company">

6. Robots Meta Tag

Gives instructions to search engine bots on whether to index or follow links on the page.

<meta name="robots" content="index, follow">

7. Canonical Tag

Helps prevent duplicate content issues by specifying the preferred URL.

<link rel="canonical" href="https://www.example.com/page-url">

Open Graph Meta Tags

Open Graph (OG) meta tags enhance how your content appears when shared on social media platforms such as Facebook, LinkedIn, and Pinterest.

Common Open Graph Tags:

<meta property="og:title" content="Title of Content"><meta property="og:description" content="Brief summary of the content"><meta property="og:image" content="URL to image"><meta property="og:url" content="Canonical URL of the page"><meta property="og:type" content="website"><meta property="og:site_name" content="Website Name"><meta property="og:locale" content="en_US">

These tags improve visibility, increase click-through rates, and make shared content more engaging.

Apple Meta Tags

Apple-specific meta tags are designed to optimize your webpage’s appearance and behavior on iOS devices.

Common Apple Meta Tags:

<meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-title" content="App Name"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="apple-touch-icon" href="/path/icon.png"><link rel="apple-touch-startup-image" href="/path/startup.png">

These tags enable full-screen display, customize icons, and improve user experience when your site is added to the home screen on Apple devices.

Internet Explorer Meta Tags

Although Internet Explorer (IE) is deprecated, some projects still require compatibility. IE-specific meta tags help ensure proper rendering.

Common IE Meta Tags:

<meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="msapplication-TileColor" content="#ffffff"><meta name="msapplication-TileImage" content="/path/icon.png"><meta name="msapplication-tooltip" content="Tooltip Text"><meta name="msapplication-task" content="name=Task;action-uri=task-url;icon-uri=icon.png">

Use these only when IE support is necessary; otherwise, modern web standards are preferred.

Facebook Meta Tags

Facebook utilizes Open Graph meta tags to format shared links. These are the same OG tags mentioned earlier, but optimized for the Facebook ecosystem.

Examples:

<meta property="og:title" content="Content Title"><meta property="og:description" content="Short Description"><meta property="og:image" content="https://example.com/image.jpg"><meta property="og:url" content="https://example.com/page"><meta property="og:type" content="article"><meta property="og:site_name" content="Website Name"><meta property="og:locale" content="en_US">

These tags ensure your content appears rich and informative when shared on Facebook.

Twitter Meta Tags (Twitter Cards)

Twitter Card meta tags let you customize how your content is displayed on Twitter.

Common Twitter Meta Tags:

<meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="Content Title"><meta name="twitter:description" content="Short description"><meta name="twitter:image" content="https://example.com/image.jpg"><meta name="twitter:url" content="https://example.com/page"><meta name="twitter:site" content="@websiteUsername"><meta name="twitter:creator" content="@creatorUsername">

Using these tags helps generate visually rich tweets and increases engagement.

Structured Data Markup (JSON-LD)

Structured data provides detailed context about your content, helping search engines display rich results.

Example Using JSON-LD:

<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "headline": "Your Article Title", "description": "A short summary of the article.", "datePublished": "2025-05-22", "author": { "@type": "Person", "name": "Author Name" }, "publisher": { "@type": "Organization", "name": "Publisher Name", "logo": { "@type": "ImageObject", "url": "https://example.com/logo.png" } } } </script>

Structured data complements meta tags by enhancing visibility in Google search results, enabling features like knowledge panels, rich snippets, and voice search integration.

Conclusion:

HTML meta tags are a fundamental part of web development, providing vital information to browsers, search engines, and social media platforms. Whether you're focusing on SEO, mobile responsiveness, or social sharing, using the right meta tags in your HTML document's head section is key to maximizing visibility and user experience.

Written by RGB Web Tech

SEO Checklist - Boost Your Website Ranking

Enhance your website performance with our Complete SEO Checklist. This detailed guide covers essential aspects like On-Page SEO, Off-Page SEO, Technical SEO, Backlink Building, Mobile Optimization etc. Follow our step-by-step SEO Checklist to improve search rankings, boost organic traffic, and achieve sustainable online growth. Start optimizing today!

Canonical Meta Tag

Updated on January 15, 2025 by RGB Web Tech

Canonical Meta Tag

How to use Meta Canonical Tag on your website? Google, Bing and Yahoo support using the canonical tag in your source.

What could be the problem? You have a website page with the following fictitious URL :

1. www.yourdomainname.com/page-id=123?/size12/~dyn987

The content of this page is also available on the following page :

2. https://www.rgbwebtech.com/about-us.php

The URL from item a) is often the result of a CMS system with a search engine unfriendly URL. The URL from item b) is friendly for the search engines, it is readable and crawlable. However, there is just 1 problem: you have double content. Two different URL but with the same content. One links to a and the other links to b. This is where you leak PageRank.

rel="canonical"

This addition in your source makes search engines understand the main page if you have double content. By guiding the search engine to the most important page your PageRank will be set on the right page. This is better for your ranking and results.

In our example shown below the page from item a) will be redirected to the right page by adding the following text in your source which is found in the head part of your webpage :

<link rel="canonical" href="https://www.rgbwebtech.com/about-us.php" />

The page mentioned in the canonical link will be indexed in the database of the search engines. The search engine will also give this page the highest priority. The canonical link will work as a hint for the search engines, which means the canonical link could not be followed or indexed by a search engine.

Why should you use the rel="canonical" meta tag?

The rel=canonical isn't a real meta tag but it is more an HTML description. By adding the rel=canonical tag you inform the spiders which page is the main page if you have double content. This doesn't mean that the spiders will not pay attention or punish you for having the other page. That story is a myth.

How do you add the rel="canonical" meta tag?

The rel=canonical can be added in the source of your webpage :

<link rel="canonical" href="https://www.rgbwebtech.com/seo-checklist/page/canonical-meta-tag" />

The URL of a canonical link can be a relative link. However, we advise you to use absolute links to prevent problems. The canonical link can only link to a page with the same domain name.

Where should you add meta tags?

You may add meta tags to all of your webpages, so not only in the first index page. Make sure that on every page relevant meta tags are added. Add keywords and phrases that are relevant and correspond to the text and the language on that specific page. It might be a lot of work to add specific meta tags to each page but you will notice in time that it works!

You can also try Profile Creation Sites List and Directory Submission Site List for creating quality backlinks.

We have created a Technical SEO Checklist for SEO Professionals. You can check that also.

If this article is helpful for you, please share it on your social media handles Because sharing is caring!

Written by RGB Web Tech

SEO Checklist - Boost Your Website Ranking

Enhance your website performance with our Complete SEO Checklist. This detailed guide covers essential aspects like On-Page SEO, Off-Page SEO, Technical SEO, Backlink Building, Mobile Optimization etc. Follow our step-by-step SEO Checklist to improve search rankings, boost organic traffic, and achieve sustainable online growth. Start optimizing today!