Website Meta
This is a collection of meta tags and image assets to simplify adding meta data to Websites.
This repo includes two sets of icons. One utilizes the version of the Live Nation logo that has no Fanman, the other does have the Fanman. If you need to create alternate icons, the provided Sketch file will expedite that.
Download the Sketch Favicon Exporter »
Meta Tags
<title>Website title</title>
<meta name="description" content="Web page description." />
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Website" />
<meta property="og:title" content="Web page title" />
<meta property="og:description" content="Web page description." />
<meta property="og:url" content="https://www.example.com" />
<meta property="og:image" content="open-graph-logo-1200x1200.png" />
<meta property="og:image:alt" content="Image description" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@example" />
<meta name="twitter:title" content="Web page title" />
<meta name="twitter:description" content="Web page description." />
<meta name="twitter:image" content="twitter-card-logo-1024x512.png" />
<meta name="twitter:image:alt" content="Image description" />
<meta name="msapplication-TileColor" content="#e21836" />
<meta name="msapplication-TileImage" content="ms-icon-144x144.png" />
<meta name="theme-color" content="#ffffff" />
<link rel="mask-icon" href="safari-pinned-tab.svg" color="#e21836" />
<link rel="apple-touch-icon" sizes="180x180" href="apple-icon-180x180.png" />
<link rel="apple-touch-icon" sizes="152x152" href="apple-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="144x144" href="apple-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="120x120" href="apple-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="114x114" href="apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="76x76" href="apple-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="72x72" href="apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="60x60" href="apple-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="57x57" href="apple-icon-57x57.png" />
<link rel="icon" type="image/png" sizes="192x192" href="android-icon-192x192.png" />
<link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
<link rel="shortcut icon" href="favicon.ico" />
Optional Meta Tags
<meta property="fb:app_id" content="" />
<meta name="apple-itunes-app" content="" />
<meta name="apple-itunes-app" content="" />
<meta property="al:ios:app_store_id" content="" />
<meta property="al:ios:app_name" content="" />
<meta property="al:web:url" content="https://www.example.com" />
<meta property="al:android:url" content="" />
<meta property="al:android:app_name" content="" />
<meta property="al:android:package" content="" />
<meta name="twitter:app:country" content="US" />
<meta name="twitter:app:name:iphone" content="" />
<meta name="twitter:app:id:iphone" content="" />
<meta name="twitter:app:url:iphone" content="" />
<meta name="twitter:app:name:ipad" content="" />
<meta name="twitter:app:id:ipad" content="" />
<meta name="twitter:app:url:ipad" content="" />
<meta name="twitter:app:name:googleplay" content="" />
<meta name="twitter:app:id:googleplay" content="" />
<meta name="twitter:app:url:googleplay" content="" />
File Size Optimization
If you need to generate new icons, make sure to run the PNG
s through ImageOptim to reduce their file size, and minimize the SVG
file with SVGOMG.
ICO Generation
The one icon that Sketch is not able to export is the favicon.ico
. To create that, upload the favicon-32x32.png
to Favicon.cc.
Credits
The original Sketch Favicon Exporter was created by Frederik Jacques.
License
The Sketch Favicon Exporter and the sample HTML snippets are licensed under MIT. Live Nation, the Live Nation logo, and the Fanman graphic are all trademarks of Live Nation Worldwide, Inc.