Skip to content

Instantly share code, notes, and snippets.

@whitingx
Forked from kevinSuttle/meta-tags.md
Created October 5, 2012 16:41
Show Gist options
  • Save whitingx/3840905 to your computer and use it in GitHub Desktop.
Save whitingx/3840905 to your computer and use it in GitHub Desktop.
Complete List of HTML Meta Tags

Copied from http://code.lancepollard.com/complete-list-of-html-meta-tags/

Basic HTML Meta Tags

<meta charset='UTF-8'>
<meta name='keywords' content='your, tags'>
<meta name='description' content='150 words'>
<meta name='subject' content='your website's subject'>
<meta name='copyright' content='company name'>
<meta name='language' content='ES'>
<meta name='robots' content='index,follow'>
<meta name='revised' content='Sunday, July 18th, 2010, 5:15 pm'>
<meta name='abstract' content=''>
<meta name='topic' content=''>
<meta name='summary' content=''>
<meta name='Classification' content='Business'>
<meta name='author' content='name, [email protected]'>
<meta name='designer' content=''>
<meta name='reply-to' content='[email protected]'>
<meta name='owner' content=''>
<meta name='url' content='http://www.websiteaddrress.com'>
<meta name='identifier-URL' content='http://www.websiteaddress.com'>
<meta name='directory' content='submission'>
<meta name='pagename' content='jQuery Tools, Tutorials and Resources - O'Reilly Media'>
<meta name='category' content=''>
<meta name='coverage' content='Worldwide'>
<meta name='distribution' content='Global'>
<meta name='rating' content='General'>
<meta name='revisit-after' content='7 days'>
<meta name='subtitle' content='This is my subtitle'>
<meta name='target' content='all'>
<meta name='HandheldFriendly' content='True'>
<meta name='MobileOptimized' content='320'>
<meta name='date' content='Sep. 27, 2010'>
<meta name='search_date' content='2010-09-27'>
<meta name='DC.title' content='Unstoppable Robot Ninja'>
<meta name='ResourceLoaderDynamicStyles' content=''>
<meta name='medium' content='blog'>
<meta name='syndication-source' content='https://mashable.com/2008/12/24/free-brand-monitoring-tools/'>
<meta name='original-source' content='https://mashable.com/2008/12/24/free-brand-monitoring-tools/'>
<meta name='verify-v1' content='dV1r/ZJJdDEI++fKJ6iDEl6o+TMNtSu0kv18ONeqM0I='>
<meta name='y_key' content='1e39c508e0d87750'>
<meta name='pageKey' content='guest-home'>
<meta itemprop='name' content='jQTouch'>
<meta http-equiv='Expires' content='0'>
<meta http-equiv='Pragma' content='no-cache'>
<meta http-equiv='Cache-Control' content='no-cache'>
<meta http-equiv='imagetoolbar' content='no'>
<meta http-equiv='x-dns-prefetch-control' content='off'>

OpenGraph Meta Tags

<meta name='og:title' content='The Rock'>
<meta name='og:type' content='movie'>
<meta name='og:url' content='http://www.imdb.com/title/tt0117500/'>
<meta name='og:image' content='http://ia.media-imdb.com/rock.jpg'>
<meta name='og:site_name' content='IMDb'>
<meta name='og:description' content='A group of U.S. Marines, under command of...'>

<meta name='fb:page_id' content='43929265776'>
<meta name='application-name' content='foursquare'>
<meta name='og:email' content='[email protected]'>
<meta name='og:phone_number' content='650-123-4567'>
<meta name='og:fax_number' content='+1-415-123-4567'>

<meta name='og:latitude' content='37.416343'>
<meta name='og:longitude' content='-122.153013'>
<meta name='og:street-address' content='1601 S California Ave'>
<meta name='og:locality' content='Palo Alto'>
<meta name='og:region' content='CA'>
<meta name='og:postal-code' content='94304'>
<meta name='og:country-name' content='USA'>

<meta property='fb:admins' content='987654321'>
<meta property='og:type' content='game.achievement'>
<meta property='og:points' content='POINTS_FOR_ACHIEVEMENT'>

<meta property='og:video' content='http://example.com/awesome.swf'>
<meta property='og:video:height' content='640'>
<meta property='og:video:width' content='385'>
<meta property='og:video:type' content='application/x-shockwave-flash'>
<meta property='og:video' content='http://example.com/html5.mp4'>
<meta property='og:video:type' content='video/mp4'>
<meta property='og:video' content='http://example.com/fallback.vid'>
<meta property='og:video:type' content='text/html'>

<meta property='og:audio' content='http://example.com/amazing.mp3'>
<meta property='og:audio:title' content='Amazing Song'>
<meta property='og:audio:artist' content='Amazing Band'>
<meta property='og:audio:album' content='Amazing Album'>
<meta property='og:audio:type' content='application/mp3'>

Create Custom Meta Tags

Use custom meta tags to store data that you need in Javascript, instead of hard-coding that data into your Javascript. I store my Google Analytics code in meta tags. Here's some examples:

<meta name='google-analytics' content='1-AHFKALJ'>
<meta name='disqus' content='abcdefg'>
<meta name='uservoice' content='asdfasdf'>
<meta name='mixpanel' content='asdfasdf'>

Company/Service Meta Tags

ClaimID

<meta name='microid' content='mailto+http:sha1:e6058ed7fca4a1921cq91d7f1f3b8736cd3cc1g7'>
<meta name='readability-verification' content='E7aEHvVQpWc8VHDqKvaB2Z58hek2EAv2HuLuegv7'>
<meta name='google-site-verification' content='4SMIedO1X4IkYrYuhEC2VuovdQM36Xxb0btUjElqQyg'>
<meta name='ICBM' content='40.746990, -73.980537'>
<meta name='generator' content='WordPress 3.3.1'>
<meta name='norton-safeweb-site-verification' content='tz8iotmk-pkhui406y41y5bfmfxdwmaa4a-yc0hm6r0fga7s6j0j27qmgqkmc7oovihzghbzhbdjk-uiyrz438nxsjdbj3fggwgl8oq2nf4ko8gi7j4z7t78kegbidl4'>

Apple Meta Tags

<meta name="apple-mobile-web-app-title" content="My App"> <!-- New in iOS6 -->
<meta name='apple-mobile-web-app-capable' content='yes'>
<meta name='apple-touch-fullscreen' content='yes'>
<meta name='apple-mobile-web-app-status-bar-style' content='black'>
<meta name='format-detection' content='telephone=no'>
<meta name='viewport' content='width=device-width; content='width = 320; initial-scale=1.0; maximum-scale=1.0; user-scalable=yes; target-densitydpi=160dpi'>

<link href='/apple-touch-icon.png' rel='apple-touch-icon' type='image/png'>
<link href='touch-icon-ipad.png' rel='apple-touch-icon' sizes='72x72'>
<link href='touch-icon-iphone4.png' rel='apple-touch-icon' sizes='114x114'>
<link href='/startup.png' rel='apple-touch-startup-image'>

<link href='http://github.com/images/touch-icon-iphone4.png' sizes='114x114' rel='apple-touch-icon-precomposed'>
<link href='http://github.com/images/touch-icon-ipad.png' sizes='72x72' rel='apple-touch-icon-precomposed'>
<link href='http://github.com/images/apple-touch-icon-57x57.png' sizes='57x57' rel='apple-touch-icon-precomposed'>

Internet Explorer Meta Tags

<meta http-equiv='Page-Enter' content='RevealTrans(Duration=2.0,Transition=2)'>
<meta http-equiv='Page-Exit' content='RevealTrans(Duration=3.0,Transition=12)'>
<meta name='mssmarttagspreventparsing' content='true'>
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/>
<meta name='msapplication-starturl' content='http://blog.reybango.com/about/'>
<meta name='msapplication-window' content='width=800;height=600'>
<meta name='msapplication-navbutton-color' content='red'>
<meta name='application-name' content='Rey Bango Front-end Developer'>
<meta name='msapplication-tooltip' content='Launch Rey Bango's Blog'>
<meta name='msapplication-task' content='name=About;action-uri=/about/;icon-uri=/images/about.ico'>
<meta name='msapplication-task' content='name=The Big List;action-uri=/the-big-list-of-javascript-css-and-html-development-tools-libraries-projects-and-books/;icon-uri=/images/list_links.ico'>
<meta name='msapplication-task' content='name=jQuery Posts;action-uri=/category/jquery/;icon-uri=/images/jquery.ico'>
<meta name='msapplication-task' content='name=Start Developing;action-uri=/category/javascript/;icon-uri=/images/script.ico'>
<meta name='msvalidate.01' content='6E3AD52DC176461A3C81DD6E98003BC9'>
<meta http-equiv='cleartype' content='on'>

Google Meta Tags

<meta name="news_keywords" content="World Cup, Brazil 2014, Spain vs Netherlands, soccer, football">

TweetMeme Meta Tags

<meta name='tweetmeme-title' content='Retweet Button Explained'>

Blog Catalog Meta Tags

<meta name='blogcatalog'>

Rails Meta Tags

<meta name='csrf-param' content='authenticity_token'>
<meta name='csrf-token' content='/bZVwvomkAnwAI1Qd37lFeewvpOIiackk9121fFwWwc='>

HTML Link Tags

<link rel='alternate' type='application/rss+xml' title='RSS' href='http://feeds.feedburner.com/martini'>
<link rel='alternate' type='application/atom+xml' title='Atom 0.3' href='https://example.com/feed.atom'>
<link rel='shortcut icon' type='image/ico' href='/favicon.ico'>
<link rel='fluid-icon' type='image/png' href='/fluid-icon.png'>
<link rel='me' type='text/html' href='http://google.com/profiles/thenextweb'>
<link rel='shortlink' href='http://blog.unto.net/?p=353'>
<link rel='archives' title='May 2003' href='http://blog.unto.net/2003/05/'>
<link rel='index' title='DeWitt Clinton' href='http://blog.unto.net/'>
<link rel='start' title='Pattern Recognition 1' href='http://blog.unto.net/photos/pattern_recognition_1_about/'>
<link rel='bookmark'title='Styleguide' href='http://paulrobertlloyd.com/about/styleguide/'>
<link rel='search' href='/search.xml' type='application/opensearchdescription+xml' title='Viatropos'>

<link rel='self' type='application/atom+xml' href='http://www.syfyportal.com/atomFeed.php?page=3'>
<link rel='first' href='http://www.syfyportal.com/atomFeed.php'>
<link rel='next' href='http://www.syfyportal.com/atomFeed.php?page=4'>
<link rel='previous' href='http://www.syfyportal.com/atomFeed.php?page=2'>
<link rel='last' href='http://www.syfyportal.com/atomFeed.php?page=147'>

<link rel='canonical' href='http://smallbiztrends.com/2010/06/9-things-to-do-before-entering-social-media.html'>
<link rel='EditURI' type='application/rsd+xml' title='RSD' href='http://smallbiztrends.com/xmlrpc.php?rsd'>
<link rel='pingback' href='http://smallbiztrends.com/xmlrpc.php'>
<link rel='stylesheet' media='only screen and (max-device-width: 480px)' href='http://wordpress.org/style/iphone.css' type='text/css'>
<link rel='wlwmanifest' href='http://www.example.com/wp-includes/wlwmanifest.xml' type='application/wlwmanifest+xml'>
## Other Resources

- [HTML5 Boilerplate explanations and suggestions of header tags](http://html5boilerplate.com/docs/head-Tips/)
- [Dublic Core Meta Tags](http://www.seoconsultants.com/meta-tags/dublin/)
- [Apple Meta Tags](http://developer.apple.com/safari/library/documentation/appleapplications/reference/safarihtmlref/articles/metatags.html)
- [OpenGraph Meta Tags](http://opengraphprotocol.org/)
- [Link Tag Meaning](http://intertwingly.net/wiki/pie/LinkTagMeaning)
- [Google Chrome HTML5 Tags](http://www.html5rocks.com/)
@AbdelrahmanMegahed
Copy link

Thanks!

@thisAmiqo
Copy link

wow thats great ! :)

@boehs
Copy link

boehs commented Jan 4, 2022

For what it's worth, most of the "Basic HTML Meta Tags" have no uses.

  • Only use rating if it's content is adult
  • Always use viewport
  • Always use charset
  • You should use theme-color
  • author is rarely needed but perhaps include it
  • I have never seen an instance where copyright is used
  • Always use description
  • robots, googlebot, google, google-site-verification are a few others worth looking into

The others are not needed, unless you are optimizing for some niche site that is the only site in the whole wide world to use them, or leaving goodies for people who snoop in your html (perhaps designer and reply-to)

This does not apply to the other tag groups here, especially OpenGraph Meta Tags and HTML Link Tags

@nusagates
Copy link

Thanks. Great info!

@mdhgtushar
Copy link

thanks!

@faniabdo99
Copy link

Very appreciated efforts man, Thanks

@Xayrulloh
Copy link

thanks bro

@BernhardTuft
Copy link

Thanks to all the contributors!

@watat83
Copy link

watat83 commented Oct 6, 2022

Thanks a lot for this great resource. It has helped build a robust SEO system. I just want to point out that after researching deeply into the Open Graph protocol, I noticed that some of the tags do not use name=** but property=**. I hope someone find this helpful

<meta property='og:type' content='movie'>
<meta property='og:url' content='http://www.imdb.com/title/tt0117500/'>
<meta property='og:image' content='http://ia.media-imdb.com/rock.jpg'>
<meta property='og:site_name' content='IMDb'>
<meta property='og:description' content='A group of U.S. Marines, under command of...'>

<meta property='og:email' content='[email protected]'>
<meta property='og:phone_number' content='650-123-4567'>
<meta property='og:fax_number' content='+1-415-123-4567'>

<meta property='og:latitude' content='37.416343'>
<meta property='og:longitude' content='-122.153013'>
<meta property='og:street-address' content='1601 S California Ave'>
<meta property='og:locality' content='Palo Alto'>
<meta property='og:region' content='CA'>
<meta property='og:postal-code' content='94304'>
<meta property='og:country-name' content='USA'>```

@adahgeorge
Copy link

So useful

@ShayanTheNerd
Copy link

Thanks for this awesome list.
BTW it's:
<meta name='description' content='155 to 160 characters'>
characters not words

@danieldanielecki
Copy link

Hi!, can u add the meta tag for Twitter, Im trying to create a meta using metatags.io but when I try to post to twitter it doesnt work. i use this https://cards-dev.twitter.com/validator to validate meta data of website

The official tags for Twitter are here, as of today those are:

  • twitter:card (useful)
  • twitter:site (useful)
  • twitter:site:id (could be useful)
  • twitter:creator (useful)
  • twitter:creator:id (could be useful)
  • twitter:description (useful)
  • twitter:title (useful)
  • twitter:image (useful)
  • twitter:image:alt (useful)
  • twitter:player (rarely useful)
  • twitter:player:width (rarely useful)
  • twitter:player:height (rarely useful)
  • twitter:player:stream (rarely useful)
  • twitter:app:name:iphone (rarely useful)
  • twitter:app:id:iphone (rarely useful)
  • twitter:app:url:iphone (rarely useful)
  • twitter:app:name:ipad (rarely useful)
  • twitter:app:id:ipad (rarely useful)
  • twitter:app:url:ipad (rarely useful)
  • twitter:app:name:googleplay (rarely useful)
  • twitter:app:id:googleplay (rarely useful)
  • twitter:app:url:googleplay (rarely useful)

Sometimes in the Internet you can also find twitter:domain and twitter:url, but those seem to be deprecated.

@plumkewe
Copy link

Thanks! 👍

@Uditmehra631
Copy link

Recently Google has updated their metatag verification method. The “verify-v1” meta tag, has been replaced with “google-site-verification”. The presence of this meta tag in the header section of your website is required for all new submissions to Google Webmaster Tools.

@MahdiMashayekhi-AI
Copy link

Thank you so much!
These are very useful.

@PatrickRockhill
Copy link

PatrickRockhill commented Jul 4, 2023

Don't forget the sometimes useful:
meta http-equiv="refresh" content="##; url=wherever"

@muhammedmahmutoglu
Copy link

Thanks

@Janith-Umeda
Copy link

Janith-Umeda commented Jan 30, 2024

Thanks! very useful collection. You should update the meta-tags.md with new suggestions that commenters ware introduced :).

@Emmanuelikyughul
Copy link

thanks for the hep

@hc0503
Copy link

hc0503 commented Feb 7, 2024

thanks, very helpful.

@AppiChudilko
Copy link

AppiChudilko commented Feb 27, 2024

For Microsoft's platform integration:

<meta name="msapplication-TileColor" content="#000000">
<meta name="msapplication-TileImage" content="https://unitedofweb.com/client/images/logo/svg/logo.svg">

@shikhar-sharma1703
Copy link

how to add itemprop tags in nextjs app router?

@Uditmehra631
Copy link

how to add itemprop tags in nextjs app router?

To add itemprop tags in a Next.js application using the App Router (introduced in Next.js 13), you will need to follow these steps:

  1. Ensure you're using Next.js 13 or later: This feature is part of the new App Router, so make sure your project is updated.

  2. Add itemprop tags to your components: You can directly add itemprop attributes to your JSX elements within your components.

Here's an example of how you can do it:

Step-by-Step Guide:

  1. Set up your Next.js project: Make sure you have a Next.js project set up and you're using the App Router. Your folder structure should include an app directory.

  2. Create a page: In the app directory, create a new page or use an existing one. For example, if you want to create a page at /about, you would create a file at app/about/page.tsx (or .js if you're using JavaScript).

  3. Add itemprop tags in your component: Modify the page component to include itemprop attributes.

// app/about/page.tsx

import React from 'react';

const AboutPage = () => {
  return (
    <div>
      <h1 itemProp="name">About Us</h1>
      <p itemProp="description">
        We are a company dedicated to providing the best services to our customers.
      </p>
      <div itemProp="address" itemScope itemType="http://schema.org/PostalAddress">
        <span itemProp="streetAddress">123 Main Street</span>, 
        <span itemProp="addressLocality">Anytown</span>, 
        <span itemProp="addressRegion">CA</span>
        <span itemProp="postalCode">12345</span>
      </div>
    </div>
  );
};

export default AboutPage;
  1. Ensure proper metadata in the head: You may also want to ensure proper SEO metadata using the <Head> component in the same file or a _app.js or _document.js file if you're using custom document structure.
// app/about/page.tsx

import React from 'react';
import Head from 'next/head';

const AboutPage = () => {
  return (
    <>
      <Head>
        <title>About Us - My Company</title>
        <meta name="description" content="Learn more about My Company, our mission, and our values." />
      </Head>
      <div>
        <h1 itemProp="name">About Us</h1>
        <p itemProp="description">
          We are a company dedicated to providing the best services to our customers.
        </p>
        <div itemProp="address" itemScope itemType="http://schema.org/PostalAddress">
          <span itemProp="streetAddress">123 Main Street</span>, 
          <span itemProp="addressLocality">Anytown</span>, 
          <span itemProp="addressRegion">CA</span>
          <span itemProp="postalCode">12345</span>
        </div>
      </div>
    </>
  );
};

export default AboutPage;

Notes:

  • Ensure you have all necessary packages installed.
  • The itemProp, itemScope, and itemType attributes are part of the schema.org microdata vocabulary, which helps search engines understand the content of your pages better.

By following these steps, you can effectively add itemprop tags in your Next.js app using the App Router. This will help with SEO and provide structured data to search engines.

@RaviCoderWallah
Copy link

Thanks !

@Radioactivity1010
Copy link

this is very good list. thankyou very much.

@shubhamMonubiti
Copy link

wow its awesome .

@milanlizriadi
Copy link

Didin't know it was this much.

@Kohlyde
Copy link

Kohlyde commented Jan 30, 2025

For what it's worth, most of the "Basic HTML Meta Tags" have no uses.

* Only use `rating` if it's `content` is `adult`

* Always use `viewport`

* Always use `charset`

* You should use `theme-color`

* `author` is rarely needed but perhaps include it

* I have never seen an instance where `copyright` is used

* Always use `description`

* `robots`, `googlebot`, `google`, `google-site-verification` are a few others worth looking into

The others are not needed, unless you are optimizing for some niche site that is the only site in the whole wide world to use them, or leaving goodies for people who snoop in your html (perhaps designer and reply-to)

This does not apply to the other tag groups here, especially OpenGraph Meta Tags and HTML Link Tags

I'm doing this for years you know and understand the depths of data converted, complex stuff in the etl chair, all that good stuff I said that to myself that none of those tags have any usagesn however, if a person goes from being someone that's nobody to a public figure let's say or let's say 200 years from now your type of personality and the kind of work you did is very interesting to a large group of people researching if you're caring for your work to the surface to be examined. be you know projects to be passed on in meaningful way at least in a historical museum type way you never know what it can be used for that's why the additional there. have then there just in case. I've been a data analyst for quite awhile and I've already asked myself the other day what is the heart of AI now and like 20 years ago when I was in college? now what is that scope of what that looks like now. Well to me i find out that it's not what it used to be i mean we have language models now and even gaping like the total neural linguistics programming i'm sorry natural language processing and building that neural network seems like a you know overwhelming thing everyday but like I think that we're missing the point of what AI is supposed to be this should be completely called something different because what AI is is like it's the machine that must be human who wants to emulate human intelligence we're not doing that right now, sadly. we've got a rocket ship that has it's kind of like a ship without a rudder, a three-year old that has ADHD and a nasty case of dementia. The programmer in me has prototypes that I I'm seeing slowly cone to life. lifelong compainion models. lifetime models, imagine you get an AI when you're young and you have to raise it too it's like having a dog but before you know you start getting value out of that no it anticipates your movement and also knows when it needs to back off it thinks ahead for you without being annoying I'm sorry Sir I didn't mean to break the silennce back it's your mom's birthday tomorrow or whatever you know crap like that reality is it's I think that humanity is lost part of something that the machine can get back to us I'm talking experience given to them and to training and mentoring from us before you know it you spent your entire life with this program that's grown with you over the years and now stands in place for you when you're dead and gone. It can speak for you years to come. This to me is artificial intelligence this is this is knowledge repository that my great great grand kids can listen to, Dorthi and asking Dorthi questions about me. completely free on GitHub until GitHub is gone...

@luizlealdev
Copy link

Great!

@BodenAxel
Copy link

BodenAxel commented Feb 12, 2025

That’s a comprehensive list of meta tags! Are you looking to optimize a website for SEO, social media sharing, or mobile performance? Let me know what you need help with, and I can suggest the most relevant tags. Dissertation writing can be overwhelming, and my friend was really struggling with it. He found the UKWritings dissertation help service and decided to use https://ukwritings.com/dissertation-help it. The writer provided a well-researched, structured, and original dissertation help that met all academic standards. He was really happy with the final result. If you need your dissertation help, this service is highly recommended!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment