{"id":13404624,"url":"https://github.com/joshbuchea/HEAD","last_synced_at":"2025-03-14T09:31:39.027Z","repository":{"id":37611992,"uuid":"56717493","full_name":"joshbuchea/HEAD","owner":"joshbuchea","description":"A simple guide to HTML \u003chead\u003e elements","archived":false,"fork":false,"pushed_at":"2024-06-21T17:54:29.000Z","size":659,"stargazers_count":29981,"open_issues_count":27,"forks_count":1913,"subscribers_count":695,"default_branch":"master","last_synced_at":"2024-10-14T18:24:34.796Z","etag":null,"topics":["favicon","frontend-development","head","html","html5","list","meta-tags","reference","seo","twitter-cards","web-development"],"latest_commit_sha":null,"homepage":"https://htmlhead.dev","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/joshbuchea.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null},"funding":{"github":["joshbuchea"]}},"created_at":"2016-04-20T20:05:37.000Z","updated_at":"2024-10-13T20:57:56.000Z","dependencies_parsed_at":"2023-01-31T20:01:14.066Z","dependency_job_id":"cfe7d79e-5743-4f9b-b415-054de6838ffb","html_url":"https://github.com/joshbuchea/HEAD","commit_stats":{"total_commits":280,"total_committers":69,"mean_commits":4.057971014492754,"dds":0.5178571428571428,"last_synced_commit":"73ccb795769740cc53d609d4c0f1505b08ba1f41"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbuchea%2FHEAD","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbuchea%2FHEAD/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbuchea%2FHEAD/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/joshbuchea%2FHEAD/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/joshbuchea","download_url":"https://codeload.github.com/joshbuchea/HEAD/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221454034,"owners_count":16824588,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["favicon","frontend-development","head","html","html5","list","meta-tags","reference","seo","twitter-cards","web-development"],"created_at":"2024-07-30T19:01:48.398Z","updated_at":"2024-10-25T19:30:57.196Z","avatar_url":"https://github.com/joshbuchea.png","language":null,"funding_links":["https://github.com/sponsors/joshbuchea"],"categories":["Others","miscellaneous","📝 **HTML Resources**","Head","Uncategorized","Development","前端开发框架及项目","线上代码分享网站","Shell","html5","Conceitos","Other Domains in CS","GraphQL","6. 在线工具","Web development ##","🌐 Web Development - Frontend","More"],"sub_categories":["Uncategorized","Programming","其他_文本生成、文本对话","vuepress","Server-rendered React","24.3 Web Sockets","Study Plan ###"],"readme":"# 🤯 HEAD\n\n\u003e A simple guide to HTML `\u003chead\u003e` elements\n\n[![Contributors](https://img.shields.io/github/contributors/joshbuchea/head.svg?style=for-the-badge)](https://github.com/joshbuchea/HEAD/graphs/contributors)\n[![CC0](https://img.shields.io/badge/license-CC0-green.svg?style=for-the-badge)](https://creativecommons.org/publicdomain/zero/1.0/)\n[![Follow @joshbuchea on Mastodon](https://img.shields.io/badge/Follow_@joshbuchea-purple?logo=mastodon\u0026logoColor=white\u0026style=for-the-badge)](https://hachyderm.io/@joshbuchea)\n\n## Table of Contents\n\n- [Recommended Minimum](#recommended-minimum)\n- [Elements](#elements)\n- [Meta](#meta)\n- [Link](#link)\n- [Icons](#icons)\n- [Social](#social)\n  - [Facebook Open Graph](#facebook-open-graph)\n  - [Twitter Card](#twitter-card)\n  - [Twitter Privacy](#twitter-privacy)\n  - [Schema.org](#schemaorg)\n  - [Pinterest](#pinterest)\n  - [Facebook Instant Articles](#facebook-instant-articles)\n  - [OEmbed](#oembed)\n  - [QQ/Wechat](#qqwechat)\n- [Browsers / Platforms](#browsers--platforms)\n  - [Apple iOS](#apple-ios)\n  - [Google Android](#google-android)\n  - [Google Chrome](#google-chrome)\n  - [Microsoft Internet Explorer](#microsoft-internet-explorer)\n- [Browsers (Chinese)](#browsers-chinese)\n  - [360 Browser](#360-browser)\n  - [QQ Mobile Browser](#qq-mobile-browser)\n  - [UC Mobile Browser](#uc-mobile-browser)\n- [App Links](#app-links)\n- [Other Resources](#other-resources)\n- [Related Projects](#related-projects)\n- [Other Formats](#other-formats)\n- [Translations](#-translations)\n- [Contributing](#-contributing)\n  - [Contributors](#contributors)\n- [Author](#-author)\n- [License](#-license)\n\n## Recommended Minimum\n\nBelow are the essential elements for any web document (websites/apps):\n\n```html\n\u003cmeta charset=\"utf-8\"\u003e\n\u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\"\u003e\n\u003c!--\n  The above 2 meta tags *must* come first in the \u003chead\u003e\n  to consistently ensure proper document rendering.\n  Any other head element should come *after* these tags.\n --\u003e\n\u003ctitle\u003ePage Title\u003c/title\u003e\n```\n\n`meta charset` - defines the encoding of the website, `utf-8` is the standard\n\n`meta name=\"viewport\"` - viewport settings related to mobile responsiveness\n\n`width=device-width` - use the physical width of the device (great for mobile!)\n\n`initial-scale=1` - the initial zoom, 1 means no zoom\n\n**[⬆ back to top](#table-of-contents)**\n\n## Elements\n\nValid `\u003chead\u003e` elements include `meta`, `link`, `title`, `style`, `script`, `noscript`, and `base`.\n\nThese elements provide information for how a document should be perceived, and rendered, by web technologies. e.g. browsers, search engines, bots, etc.\n\n```html\n\u003c!--\n  Set the character encoding for this document, so that\n  all characters within the UTF-8 space (such as emoji)\n  are rendered correctly.\n--\u003e\n\u003cmeta charset=\"utf-8\"\u003e\n\n\u003c!-- Set the document's title --\u003e\n\u003ctitle\u003ePage Title\u003c/title\u003e\n\n\u003c!-- Set the base URL for all relative URLs within the document --\u003e\n\u003cbase href=\"https://example.com/page.html\"\u003e\n\n\u003c!-- Link to an external CSS file --\u003e\n\u003clink rel=\"stylesheet\" href=\"styles.css\"\u003e\n\n\u003c!-- Used for adding in-document CSS --\u003e\n\u003cstyle\u003e\n  /* ... */\n\u003c/style\u003e\n\n\u003c!-- JavaScript \u0026 No-JavaScript tags --\u003e\n\u003cscript src=\"script.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  // function(s) go here\n\u003c/script\u003e\n\u003cnoscript\u003e\n  \u003c!-- No JS alternative --\u003e\n\u003c/noscript\u003e\n```\n\n**[⬆ back to top](#table-of-contents)**\n\n## Meta\n\n```html\n\u003c!--\n  The following 2 meta tags *must* come first in the \u003chead\u003e\n  to consistently ensure proper document rendering.\n  Any other head element should come *after* these tags.\n--\u003e\n\u003cmeta charset=\"utf-8\"\u003e\n\u003cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1\"\u003e\n\n\u003c!--\n  Allows control over where resources are loaded from.\n  Place as early in the \u003chead\u003e as possible, as the tag  \n  only applies to resources that are declared after it.\n--\u003e\n\u003cmeta http-equiv=\"Content-Security-Policy\" content=\"default-src 'self'\"\u003e\n\n\u003c!-- Name of web application (only should be used if the website is used as an app) --\u003e\n\u003cmeta name=\"application-name\" content=\"Application Name\"\u003e\n\n\u003c!-- Theme Color for Chrome, Firefox OS and Opera --\u003e\n\u003cmeta name=\"theme-color\" content=\"#4285f4\"\u003e\n\n\u003c!-- Short description of the document (limit to 150 characters) --\u003e\n\u003c!-- This content *may* be used as a part of search engine results. --\u003e\n\u003cmeta name=\"description\" content=\"A description of the page\"\u003e\n\n\u003c!-- Control the behavior of search engine crawling and indexing --\u003e\n\u003cmeta name=\"robots\" content=\"index,follow\"\u003e\u003c!-- All Search Engines --\u003e\n\u003cmeta name=\"googlebot\" content=\"index,follow\"\u003e\u003c!-- Google Specific --\u003e\n\n\u003c!-- Tells Google not to show the sitelinks search box --\u003e\n\u003cmeta name=\"google\" content=\"nositelinkssearchbox\"\u003e\n\n\u003c!-- Tells Google not to provide a translation for this document --\u003e\n\u003cmeta name=\"google\" content=\"notranslate\"\u003e\n\n\u003c!-- Verify website ownership --\u003e\n\u003cmeta name=\"google-site-verification\" content=\"verification_token\"\u003e\u003c!-- Google Search Console --\u003e\n\u003cmeta name=\"yandex-verification\" content=\"verification_token\"\u003e\u003c!-- Yandex Webmasters --\u003e\n\u003cmeta name=\"msvalidate.01\" content=\"verification_token\"\u003e\u003c!-- Bing Webmaster Center --\u003e\n\u003cmeta name=\"alexaVerifyID\" content=\"verification_token\"\u003e\u003c!-- Alexa Console --\u003e\n\u003cmeta name=\"p:domain_verify\" content=\"code_from_pinterest\"\u003e\u003c!-- Pinterest Console--\u003e\n\u003cmeta name=\"norton-safeweb-site-verification\" content=\"norton_code\"\u003e\u003c!-- Norton Safe Web --\u003e\n\n\u003c!-- Identify the software used to build the document (i.e. - WordPress, Dreamweaver) --\u003e\n\u003cmeta name=\"generator\" content=\"program\"\u003e\n\n\u003c!-- Short description of your document's subject --\u003e\n\u003cmeta name=\"subject\" content=\"your document's subject\"\u003e\n\n\u003c!-- Gives a general age rating based on the document's content --\u003e\n\u003cmeta name=\"rating\" content=\"General\"\u003e\n\n\u003c!-- Allows control over how referrer information is passed --\u003e\n\u003cmeta name=\"referrer\" content=\"no-referrer\"\u003e\n\n\u003c!-- Disable automatic detection and formatting of possible phone numbers --\u003e\n\u003cmeta name=\"format-detection\" content=\"telephone=no\"\u003e\n\n\u003c!-- Completely opt out of DNS prefetching by setting to \"off\" --\u003e\n\u003cmeta http-equiv=\"x-dns-prefetch-control\" content=\"off\"\u003e\n\n\u003c!-- Specifies the document to appear in a specific frame --\u003e\n\u003cmeta http-equiv=\"Window-Target\" content=\"_value\"\u003e\n\n\u003c!-- Geo tags --\u003e\n\u003cmeta name=\"ICBM\" content=\"latitude, longitude\"\u003e\n\u003cmeta name=\"geo.position\" content=\"latitude;longitude\"\u003e\n\u003cmeta name=\"geo.region\" content=\"country[-state]\"\u003e\u003c!-- Country code (ISO 3166-1): mandatory, state code (ISO 3166-2): optional; eg. content=\"US\" / content=\"US-NY\" --\u003e\n\u003cmeta name=\"geo.placename\" content=\"city/town\"\u003e\u003c!-- eg. content=\"New York City\" --\u003e\n\n\u003c!-- Web Monetization https://webmonetization.org/docs/getting-started --\u003e\n\u003cmeta name=\"monetization\" content=\"$paymentpointer.example\"\u003e\n```\n\n- 📖 [Meta tags that Google understands](https://support.google.com/webmasters/answer/79812?hl=en)\n- 📖 [WHATWG Wiki: MetaExtensions](https://wiki.whatwg.org/wiki/MetaExtensions)\n- 📖 [ICBM on Wikipedia](https://en.wikipedia.org/wiki/ICBM_address#Modern_use)\n- 📖 [Geotagging on Wikipedia](https://en.wikipedia.org/wiki/Geotagging#HTML_pages)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Link\n\n```html\n\u003c!-- Points to an external stylesheet --\u003e\n\u003clink rel=\"stylesheet\" href=\"https://example.com/styles.css\"\u003e\n\n\u003c!-- Helps prevent duplicate content issues --\u003e\n\u003clink rel=\"canonical\" href=\"https://example.com/article/?page=2\"\u003e\n\n\u003c!-- Links to an AMP HTML version of the current document --\u003e\n\u003clink rel=\"amphtml\" href=\"https://example.com/path/to/amp-version.html\"\u003e\n\n\u003c!-- Links to a JSON file that specifies \"installation\" credentials for the web applications --\u003e\n\u003clink rel=\"manifest\" href=\"manifest.json\"\u003e\n\n\u003c!-- Links to information about the author(s) of the document --\u003e\n\u003clink rel=\"author\" href=\"humans.txt\"\u003e\n\n\u003c!-- Refers to a copyright statement that applies to the link's context --\u003e\n\u003clink rel=\"license\" href=\"copyright.html\"\u003e\n\n\u003c!-- Gives a reference to a location in your document that may be in another language --\u003e\n\u003clink rel=\"alternate\" href=\"https://es.example.com/\" hreflang=\"es\"\u003e\n\n\u003c!-- Provides information about an author or another person --\u003e\n\u003clink rel=\"me\" href=\"https://google.com/profiles/thenextweb\" type=\"text/html\"\u003e\n\u003clink rel=\"me\" href=\"mailto:name@example.com\"\u003e\n\u003clink rel=\"me\" href=\"sms:+15035550125\"\u003e\n\n\u003c!-- Links to a document that describes a collection of records, documents, or other materials of historical interest --\u003e\n\u003clink rel=\"archives\" href=\"https://example.com/archives/\"\u003e\n\n\u003c!-- Links to top level resource in an hierarchical structure --\u003e\n\u003clink rel=\"index\" href=\"https://example.com/article/\"\u003e\n\n\u003c!-- Provides a self reference - useful when the document has multiple possible references --\u003e\n\u003clink rel=\"self\" type=\"application/atom+xml\" href=\"https://example.com/atom.xml\"\u003e\n\n\u003c!-- The first, last, previous, and next documents in a series of documents, respectively --\u003e\n\u003clink rel=\"first\" href=\"https://example.com/article/\"\u003e\n\u003clink rel=\"last\" href=\"https://example.com/article/?page=42\"\u003e\n\u003clink rel=\"prev\" href=\"https://example.com/article/?page=1\"\u003e\n\u003clink rel=\"next\" href=\"https://example.com/article/?page=3\"\u003e\n\n\u003c!-- Used when a 3rd party service is utilized to maintain a blog --\u003e\n\u003clink rel=\"EditURI\" href=\"https://example.com/xmlrpc.php?rsd\" type=\"application/rsd+xml\" title=\"RSD\"\u003e\n\n\u003c!-- Forms an automated comment when another WordPress blog links to your WordPress blog or post --\u003e\n\u003clink rel=\"pingback\" href=\"https://example.com/xmlrpc.php\"\u003e\n\n\u003c!-- Notifies a URL when you link to it on your document --\u003e\n\u003clink rel=\"webmention\" href=\"https://example.com/webmention\"\u003e\n\n\u003c!-- Enables posting to your own domain using a Micropub client --\u003e\n\u003clink rel=\"micropub\" href=\"https://example.com/micropub\"\u003e\n\n\u003c!-- Open Search --\u003e\n\u003clink rel=\"search\" href=\"/open-search.xml\" type=\"application/opensearchdescription+xml\" title=\"Search Title\"\u003e\n\n\u003c!-- Feeds --\u003e\n\u003clink rel=\"alternate\" href=\"https://feeds.feedburner.com/example\" type=\"application/rss+xml\" title=\"RSS\"\u003e\n\u003clink rel=\"alternate\" href=\"https://example.com/feed.atom\" type=\"application/atom+xml\" title=\"Atom 0.3\"\u003e\n\n\u003c!-- Prefetching, preloading, prebrowsing --\u003e\n\u003c!-- More info: https://css-tricks.com/prefetching-preloading-prebrowsing/ --\u003e\n\u003clink rel=\"dns-prefetch\" href=\"//example.com/\"\u003e\n\u003clink rel=\"preconnect\" href=\"https://www.example.com/\"\u003e\n\u003clink rel=\"prefetch\" href=\"https://www.example.com/\"\u003e\n\u003clink rel=\"prerender\" href=\"https://example.com/\"\u003e\n\u003clink rel=\"preload\" href=\"image.png\" as=\"image\"\u003e\n```\n\n- 📖 [Link Relations](https://www.iana.org/assignments/link-relations/link-relations.xhtml)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Icons\n\n```html\n\u003c!-- For IE 10 and below --\u003e\n\u003c!-- Place favicon.ico in the root directory - no tag necessary --\u003e\n\n\u003c!-- Icon in the highest resolution we need it for --\u003e\n\u003clink rel=\"icon\" sizes=\"192x192\" href=\"/path/to/icon.png\"\u003e\n\n\u003c!-- Apple Touch Icon (reuse 192px icon.png) --\u003e\n\u003clink rel=\"apple-touch-icon\" href=\"/path/to/apple-touch-icon.png\"\u003e\n\n\u003c!-- Safari Pinned Tab Icon --\u003e\n\u003clink rel=\"mask-icon\" href=\"/path/to/icon.svg\" color=\"blue\"\u003e\n```\n\n- 📖 [All About Favicons (And Touch Icons)](https://bitsofco.de/all-about-favicons-and-touch-icons/)\n- 📖 [Creating Pinned Tab Icons](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/pinnedTabs/pinnedTabs.html)\n- 📖 [Favicon Cheat Sheet](https://github.com/audreyr/favicon-cheat-sheet)\n- 📖 [Icons \u0026 Browser Colors](https://developers.google.com/web/fundamentals/design-and-ux/browser-customization/)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Social\n\n### Facebook Open Graph\n\u003e Most content is shared to Facebook as a URL, so it's important that you mark up your website with Open Graph tags to take control over how your content appears on Facebook. [More about Facebook Open Graph Markup](https://developers.facebook.com/docs/sharing/webmasters#markup) \n\n```html\n\u003cmeta property=\"fb:app_id\" content=\"123456789\"\u003e\n\u003cmeta property=\"og:url\" content=\"https://example.com/page.html\"\u003e\n\u003cmeta property=\"og:type\" content=\"website\"\u003e\n\u003cmeta property=\"og:title\" content=\"Content Title\"\u003e\n\u003cmeta property=\"og:image\" content=\"https://example.com/image.jpg\"\u003e\n\u003cmeta property=\"og:image:alt\" content=\"A description of what is in the image (not a caption)\"\u003e\n\u003cmeta property=\"og:description\" content=\"Description Here\"\u003e\n\u003cmeta property=\"og:site_name\" content=\"Site Name\"\u003e\n\u003cmeta property=\"og:locale\" content=\"en_US\"\u003e\n\u003cmeta property=\"article:author\" content=\"\"\u003e\n```\n\n- 📖 [Open Graph protocol](http://ogp.me/)\n- 🛠 Test your page with the [Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/)\n\n### Twitter Card\n\u003e With Twitter Cards, you can attach rich photos, videos and media experiences to Tweets, helping to drive traffic to your website. [More about Twitter Cards](https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards)\n\n```html\n\u003cmeta name=\"twitter:card\" content=\"summary\"\u003e\n\u003cmeta name=\"twitter:site\" content=\"@site_account\"\u003e\n\u003cmeta name=\"twitter:creator\" content=\"@individual_account\"\u003e\n\u003cmeta name=\"twitter:url\" content=\"https://example.com/page.html\"\u003e\n\u003cmeta name=\"twitter:title\" content=\"Content Title\"\u003e\n\u003cmeta name=\"twitter:description\" content=\"Content description less than 200 characters\"\u003e\n\u003cmeta name=\"twitter:image\" content=\"https://example.com/image.jpg\"\u003e\n\u003cmeta name=\"twitter:image:alt\" content=\"A text description of the image conveying the essential nature of an image to users who are visually impaired. Maximum 420 characters.\"\u003e\n```\n\n- 📖 [Getting started with cards — Twitter Developers](https://dev.twitter.com/cards/getting-started)\n- 🛠 Test your page with the [Twitter Card Validator](https://cards-dev.twitter.com/validator)\n\n### Twitter Privacy\nIf you embed tweets in your website, Twitter can use information from your site to tailor content and suggestions to Twitter users. [More about Twitter privacy options](https://dev.twitter.com/web/overview/privacy#what-privacy-options-do-website-publishers-have).\n```html\n\u003c!-- disallow Twitter from using your site's info for personalization purposes --\u003e\n\u003cmeta name=\"twitter:dnt\" content=\"on\"\u003e\n```\n\n### Schema.org\n\n```html\n\u003chtml lang=\"\" itemscope itemtype=\"https://schema.org/Article\"\u003e\n    \u003chead\u003e\n      \u003clink rel=\"author\" href=\"\"\u003e\n      \u003clink rel=\"publisher\" href=\"\"\u003e\n      \u003cmeta itemprop=\"name\" content=\"Content Title\"\u003e\n      \u003cmeta itemprop=\"description\" content=\"Content description less than 200 characters\"\u003e\n      \u003cmeta itemprop=\"image\" content=\"https://example.com/image.jpg\"\u003e\n```\n\n**Note:** These meta tags require the `itemscope` and `itemtype` attributes to be added to the `\u003chtml\u003e` tag.\n\n- 📖 [Getting Started - schema.org](https://schema.org/docs/gs.html)\n- 🛠 Test your page with the [Rich Results Test](https://search.google.com/test/rich-results)\n\n### Pinterest\n\nPinterest lets you prevent people from saving things from your website, according [to their help center](https://help.pinterest.com/en/business/article/prevent-saves-to-pinterest-from-your-site). The `description` is optional.\n\n```html\n\u003cmeta name=\"pinterest\" content=\"nopin\" description=\"Sorry, you can't save from my website!\"\u003e\n```\n\n### Facebook Instant Articles\n\n```html\n\u003cmeta charset=\"utf-8\"\u003e\n\u003cmeta property=\"op:markup_version\" content=\"v1.0\"\u003e\n\n\u003c!-- The URL of the web version of your article --\u003e\n\u003clink rel=\"canonical\" href=\"https://example.com/article.html\"\u003e\n\n\u003c!-- The style to be used for this article --\u003e\n\u003cmeta property=\"fb:article_style\" content=\"myarticlestyle\"\u003e\n```\n\n- 📖 [Creating Articles - Instant Articles](https://developers.facebook.com/docs/instant-articles/guides/articlecreate)\n- 📖 [Code Samples - Instant Articles](https://developers.facebook.com/docs/instant-articles/reference)\n\n### OEmbed\n\n```html\n\u003clink rel=\"alternate\" type=\"application/json+oembed\"\n  href=\"https://example.com/services/oembed?url=http%3A%2F%2Fexample.com%2Ffoo%2F\u0026amp;format=json\"\n  title=\"oEmbed Profile: JSON\"\u003e\n\u003clink rel=\"alternate\" type=\"text/xml+oembed\"\n  href=\"https://example.com/services/oembed?url=http%3A%2F%2Fexample.com%2Ffoo%2F\u0026amp;format=xml\"\n  title=\"oEmbed Profile: XML\"\u003e\n```\n\n- 📖 [oEmbed format](https://oembed.com/)\n\n### QQ/Wechat\n\nUsers share web pages to qq wechat will have a formatted message\n\n```html\n\u003cmeta itemprop=\"name\" content=\"share title\"\u003e\n\u003cmeta itemprop=\"image\" content=\"http://imgcache.qq.com/qqshow/ac/v4/global/logo.png\"\u003e\n\u003cmeta name=\"description\" itemprop=\"description\" content=\"share content\"\u003e\n```\n- 📖 [Code Format Docs](http://open.mobile.qq.com/api/mqq/index#api:setShareInfo)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Browsers / Platforms\n\n### Apple iOS\n\n```html\n\u003c!-- Smart App Banner --\u003e\n\u003cmeta name=\"apple-itunes-app\" content=\"app-id=APP_ID,affiliate-data=AFFILIATE_ID,app-argument=SOME_TEXT\"\u003e\n\n\u003c!-- Disable automatic detection and formatting of possible phone numbers --\u003e\n\u003cmeta name=\"format-detection\" content=\"telephone=no\"\u003e\n\n\u003c!-- Launch Icon (180x180px or larger) --\u003e\n\u003clink rel=\"apple-touch-icon\" href=\"/path/to/apple-touch-icon.png\"\u003e\n\n\u003c!-- Launch Screen Image --\u003e\n\u003clink rel=\"apple-touch-startup-image\" href=\"/path/to/launch.png\"\u003e\n\n\u003c!-- Launch Icon Title --\u003e\n\u003cmeta name=\"apple-mobile-web-app-title\" content=\"App Title\"\u003e\n\n\u003c!-- Enable standalone (full-screen) mode --\u003e\n\u003cmeta name=\"apple-mobile-web-app-capable\" content=\"yes\"\u003e\n\n\u003c!-- Status bar appearance (has no effect unless standalone mode is enabled) --\u003e\n\u003cmeta name=\"apple-mobile-web-app-status-bar-style\" content=\"black\"\u003e\n\n\u003c!-- iOS app deep linking --\u003e\n\u003cmeta name=\"apple-itunes-app\" content=\"app-id=APP-ID, app-argument=http/url-sample.com\"\u003e\n\u003clink rel=\"alternate\" href=\"ios-app://APP-ID/http/url-sample.com\"\u003e\n```\n\n- 📖 [Configuring Web Applications](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html)\n\n### Google Android\n\n```html\n\u003cmeta name=\"theme-color\" content=\"#E64545\"\u003e\n\n\u003c!-- Add to home screen --\u003e\n\u003cmeta name=\"mobile-web-app-capable\" content=\"yes\"\u003e\n\u003c!-- More info: https://developer.chrome.com/multidevice/android/installtohomescreen --\u003e\n\n\u003c!-- Android app deep linking --\u003e\n\u003cmeta name=\"google-play-app\" content=\"app-id=package-name\"\u003e\n\u003clink rel=\"alternate\" href=\"android-app://package-name/http/url-sample.com\"\u003e\n```\n\n### Google Chrome\n\n```html\n\u003clink rel=\"chrome-webstore-item\" href=\"https://chrome.google.com/webstore/detail/APP_ID\"\u003e\n\n\u003c!-- Disable translation prompt --\u003e\n\u003cmeta name=\"google\" content=\"notranslate\"\u003e\n```\n\n### Microsoft Internet Explorer\n\n```html\n\u003c!-- Force IE 8/9/10 to use its latest rendering engine --\u003e\n\u003cmeta http-equiv=\"x-ua-compatible\" content=\"ie=edge\"\u003e\n\n\u003c!-- Disable automatic detection and formatting of possible phone numbers by Skype Toolbar browser extension --\u003e\n\u003cmeta name=\"skype_toolbar\" content=\"skype_toolbar_parser_compatible\"\u003e\n\n\u003c!-- Windows Tiles --\u003e\n\u003cmeta name=\"msapplication-config\" content=\"/browserconfig.xml\"\u003e\n```\n\nMinimum required xml markup for `browserconfig.xml`:\n\n```xml\n\u003c?xml version=\"1.0\" encoding=\"utf-8\"?\u003e\n\u003cbrowserconfig\u003e\n   \u003cmsapplication\u003e\n     \u003ctile\u003e\n        \u003csquare70x70logo src=\"small.png\"/\u003e\n        \u003csquare150x150logo src=\"medium.png\"/\u003e\n        \u003cwide310x150logo src=\"wide.png\"/\u003e\n        \u003csquare310x310logo src=\"large.png\"/\u003e\n     \u003c/tile\u003e\n   \u003c/msapplication\u003e\n\u003c/browserconfig\u003e\n```\n\n- 📖 [Browser configuration schema reference](https://msdn.microsoft.com/en-us/library/dn320426.aspx)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Browsers (Chinese)\n\n### 360 Browser\n\n```html\n\u003c!-- Select rendering engine order --\u003e\n\u003cmeta name=\"renderer\" content=\"webkit|ie-comp|ie-stand\"\u003e\n```\n\n### QQ Mobile Browser\n\n```html\n\u003c!-- Locks the screen into the specified orientation --\u003e\n\u003cmeta name=\"x5-orientation\" content=\"landscape/portrait\"\u003e\n\n\u003c!-- Display this document in fullscreen --\u003e\n\u003cmeta name=\"x5-fullscreen\" content=\"true\"\u003e\n\n\u003c!-- Document will be displayed in \"application mode\" (fullscreen, etc.) --\u003e\n\u003cmeta name=\"x5-page-mode\" content=\"app\"\u003e\n```\n\n### UC Mobile Browser\n\n```html\n\u003c!-- Locks the screen into the specified orientation --\u003e\n\u003cmeta name=\"screen-orientation\" content=\"landscape/portrait\"\u003e\n\n\u003c!-- Display this document in fullscreen --\u003e\n\u003cmeta name=\"full-screen\" content=\"yes\"\u003e\n\n\u003c!-- UC browser will display images even if in \"text mode\" --\u003e\n\u003cmeta name=\"imagemode\" content=\"force\"\u003e\n\n\u003c!-- Document will be displayed in \"application mode\"(fullscreen, forbidding gesture, etc.) --\u003e\n\u003cmeta name=\"browsermode\" content=\"application\"\u003e\n\n\u003c!-- Disabled the UC browser's \"night mode\" for this document --\u003e\n\u003cmeta name=\"nightmode\" content=\"disable\"\u003e\n\n\u003c!-- Simplify the document to reduce data transfer --\u003e\n\u003cmeta name=\"layoutmode\" content=\"fitscreen\"\u003e\n\n\u003c!-- Disable the UC browser's feature of \"scaling font up when there are many words in this document\" --\u003e\n\u003cmeta name=\"wap-font-scale\" content=\"no\"\u003e\n```\n\n- 📖 [UC Browser Docs](https://www.uc.cn/download/UCBrowser_U3_API.doc)\n\n**[⬆ back to top](#table-of-contents)**\n\n## App Links\n\n```html\n\u003c!-- iOS --\u003e\n\u003cmeta property=\"al:ios:url\" content=\"applinks://docs\"\u003e\n\u003cmeta property=\"al:ios:app_store_id\" content=\"12345\"\u003e\n\u003cmeta property=\"al:ios:app_name\" content=\"App Links\"\u003e\n\n\u003c!-- Android --\u003e\n\u003cmeta property=\"al:android:url\" content=\"applinks://docs\"\u003e\n\u003cmeta property=\"al:android:app_name\" content=\"App Links\"\u003e\n\u003cmeta property=\"al:android:package\" content=\"org.applinks\"\u003e\n\n\u003c!-- Web fall back --\u003e\n\u003cmeta property=\"al:web:url\" content=\"https://applinks.org/documentation\"\u003e\n```\n\n- 📖 [App Links](https://developers.facebook.com/docs/applinks)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Other Resources\n\n- 📖 [HTML5 Boilerplate Docs: The HTML](https://github.com/h5bp/html5-boilerplate/blob/master/dist/doc/html.md)\n- 📖 [HTML5 Boilerplate Docs: Extend and customize](https://github.com/h5bp/html5-boilerplate/blob/master/dist/doc/extend.md)\n\n**[⬆ back to top](#table-of-contents)**\n\n## Related Projects\n\n- [Atom HTML Head Snippets](https://github.com/joshbuchea/atom-html-head-snippets) - Atom package for `HEAD` snippets\n- [Sublime Text HTML Head Snippets](https://github.com/marcobiedermann/sublime-head-snippets) - Sublime Text package for `HEAD` snippets\n- [head-it](https://github.com/hemanth/head-it) - CLI interface for `HEAD` snippets\n- [vue-head](https://github.com/ktquez/vue-head) - Manipulating the meta information of the `HEAD` tag for Vue.js\n\n**[⬆ back to top](#table-of-contents)**\n\n## Other Formats\n\n- 📄 [PDF](https://gitprint.com/joshbuchea/HEAD/blob/master/README.md)\n\n**[⬆ back to top](#table-of-contents)**\n\n## 🌐 Translations\n\n- 🇮🇩 [Bahasa](https://github.com/rijdz/HEAD)\n- 🇧🇷 [Brazilian Portuguese](https://github.com/Webschool-io/HEAD)\n- 🇨🇳 [Chinese (Simplified)](https://github.com/Amery2010/HEAD)\n- 🇩🇪 [German](https://github.com/Shidigital/HEAD)\n- 🇮🇹 [Italian](https://github.com/Fakkio/HEAD)\n- 🇯🇵 [Japanese](https://coliss.com/articles/build-websites/operation/work/collection-of-html-head-elements.html)\n- 🇰🇷 [Korean](https://github.com/Lutece/HEAD)\n- 🇷🇺 [Russian/Русский](https://github.com/Konfuze/HEAD)\n- 🇪🇸 [Spanish](https://github.com/alvaroadlf/HEAD)\n- 🇹🇷 [Turkish/Türkçe](https://github.com/mkg0/HEAD)\n\n**[⬆ back to top](#table-of-contents)**\n\n## 🤝 Contributing\n\n**Open an issue or a pull request to suggest changes or additions.**\n\n### Guide\n\nThe **HEAD** repository consists of two branches:\n\n#### 1. `master`\n\nThis branch consists of the `README.md` file that is reflected on the [htmlhead.dev](https://htmlhead.dev/) website. All changes to the content of the guide should be made in this file.\n\nPlease follow these steps for pull requests:\n\n{:.list-style-default}\n- Modify only one tag, or one related set of tags at a time\n- Use double quotes on attributes\n- Don't include a trailing slash in self-closing elements — the HTML5 spec says they're optional\n- Consider including a link to documentation that supports your change\n\n#### 2. `gh-pages`\n\nThis branch is responsible for the [htmlhead.dev](https://htmlhead.dev/) website. We use [Jekyll](https://jekyllrb.com/) to deploy the `README.md` markdown file to [GitHub Pages](https://pages.github.com/). All website related modifications should be made in this branch.\n\nYou may find it helpful to review the [Jekyll Docs](https://jekyllrb.com/docs/home/) and understand how Jekyll works before working in this branch.\n\n## 🌟 Contributors\n\nCheck out all the super awesome [contributors](https://github.com/joshbuchea/HEAD/graphs/contributors) 🤩\n\n## 👤 Author\n\n**Josh Buchea**\n\n- GitHub: [@joshbuchea](https://github.com/joshbuchea)\n- Mastodon: [@joshbuchea@hachyderm.io](https://hachyderm.io/@joshbuchea)\n\n## 💛 Support\n\nIf this project was helpful for you or your organization, please considering supporting my work directly:\n\n- 💛 [Sponsor me on GitHub](https://github.com/sponsors/joshbuchea)\n- ⭐️ [Star this project on GitHub](https://github.com/joshbuchea/HEAD)\n- 🐙 [Follow me on GitHub](https://github.com/joshbuchea)\n- 🐘 [Follow me on Mastodon](https://hachyderm.io/@joshbuchea)\n\nEverything helps, thanks! 🙏\n\n— Josh\n\n## 📝 License\n\n[![CC0](https://i.creativecommons.org/p/zero/1.0/88x31.png)](https://creativecommons.org/publicdomain/zero/1.0/)\n\n**[⬆ back to top](#table-of-contents)**\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoshbuchea%2FHEAD","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjoshbuchea%2FHEAD","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjoshbuchea%2FHEAD/lists"}