Robot
/
HEAD
mirror of https://github.com/joshbuchea/HEAD.git
2
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #178 from joshbuchea/editorial_review 

editorial review of document
This commit is contained in:
Scott O'Hara 2017-10-30 07:20:22 -04:00 committed by GitHub
parent 83fa989f35 a982afd6f1
commit ffb2be195b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 61 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
README.md
View File

@ -46,9 +46,14 @@ Below are the essential tags for basic, minimalist websites:
```html ```html
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <!-- † -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <!--
The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags.
† Use the content="ie-edge" tag if your project must support Internet Explorer prior to version 11.
-->
<title>Page Title</title> <title>Page Title</title>
``` ```
@ -59,26 +64,31 @@ Below are the essential tags for basic, minimalist websites:
Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `noscript`, and `base`. Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `noscript`, and `base`.
``` html ``` html
<!-- Charset --> <!-- Meta tags provide information for how a document should be perceived, and rendered, by other technologies. e.g. bots, search engines, browsers, etc. -->
<meta charset="utf-8"> <meta charset="utf-8">
<!-- Document Title --> <!-- Set the document's title -->
<title>Page Title</title> <title>Page Title</title>
<!-- Base URL to use for all relative URLs contained within the document --> <!-- Base URL to use for all relative URLs contained within the document -->
<base href="http://example.com/page.html"> <base href="http://example.com/page.html">
<!-- External CSS --> <!-- Link to external CSS file -->
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<!-- In-document CSS --> <!-- Used for adding in-document CSS -->
<style> <style>
/* ... */ /* ... */
</style> </style>
<!-- JavaScript --> <!-- JavaScript & No-JavaScript tags -->
<script src="script.js"></script> <script src="script.js"></script>
<noscript><!--no JS alternative--></noscript> <script>
// function(s) go here
</script>
<noscript>
<!-- No JS alternative -->
</noscript>
``` ```
**[⬆ back to top](#table-of-contents)** **[⬆ back to top](#table-of-contents)**
@ -86,7 +96,7 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
## Meta ## Meta
``` html ``` html
<meta charset="utf-8"> <!-- set character encoding for the document --> <meta charset="utf-8"> <!-- Set character encoding for the document -->
<meta http-equiv="x-ua-compatible" content="ie=edge"> <meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
@ -94,12 +104,12 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
<!-- Allows control over where resources are loaded from --> <!-- Allows control over where resources are loaded from -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'"> <meta http-equiv="Content-Security-Policy" content="default-src 'self'">
<!-- Place as early in the document as possible --> <!-- Place as early in the document as possible -->
<!-- Only applies to content below this tag --> <!-- Only applies to resources below this tag -->
<!-- Name of web application (only should be used if the website is used as an app) --> <!-- Name of web application (only should be used if the website is used as an app) -->
<meta name="application-name" content="Application Name"> <meta name="application-name" content="Application Name">
<!-- Short description of the page (limit to 150 characters) --> <!-- Short description of the document (limit to 150 characters) -->
<!-- In *some* situations this description is used as a part of the snippet shown in the search results. --> <!-- In *some* situations this description is used as a part of the snippet shown in the search results. -->
<meta name="description" content="A description of the page"> <meta name="description" content="A description of the page">
@ -110,10 +120,10 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
<!-- Tells Google not to show the sitelinks search box --> <!-- Tells Google not to show the sitelinks search box -->
<meta name="google" content="nositelinkssearchbox"> <meta name="google" content="nositelinkssearchbox">
<!-- Tells Google not to provide a translation for this page --> <!-- Tells Google not to provide a translation for this document -->
<meta name="google" content="notranslate"> <meta name="google" content="notranslate">
<!-- Verify ownership --> <!-- Verify website ownership -->
<meta name="google-site-verification" content="verification_token"><!-- Google Search Console --> <meta name="google-site-verification" content="verification_token"><!-- Google Search Console -->
<meta name="yandex-verification" content="verification_token"><!-- Yandex Webmasters --> <meta name="yandex-verification" content="verification_token"><!-- Yandex Webmasters -->
<meta name="msvalidate.01" content="verification_token"><!-- Bing Webmaster Center --> <meta name="msvalidate.01" content="verification_token"><!-- Bing Webmaster Center -->
@ -121,13 +131,13 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
<meta name="p:domain_verify" content="code_from_pinterest"><!-- Pinterest Console--> <meta name="p:domain_verify" content="code_from_pinterest"><!-- Pinterest Console-->
<meta name="norton-safeweb-site-verification" content="norton_code"><!-- Norton Safe Web --> <meta name="norton-safeweb-site-verification" content="norton_code"><!-- Norton Safe Web -->
<!-- Used to name software used to build the website (i.e. - WordPress, Dreamweaver) --> <!-- Identify the software used to build the document (i.e. - WordPress, Dreamweaver) -->
<meta name="generator" content="program"> <meta name="generator" content="program">
<!-- Short description of your site's subject --> <!-- Short description of your document's subject -->
<meta name="subject" content="your website's subject"> <meta name="subject" content="your document's subject">
<!-- Gives a general age rating based on sites content --> <!-- Gives a general age rating based on the document's content -->
<meta name="rating" content="General"> <meta name="rating" content="General">
<!-- Allows control over how referrer information is passed --> <!-- Allows control over how referrer information is passed -->
@ -136,13 +146,13 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
<!-- Disable automatic detection and formatting of possible phone numbers --> <!-- Disable automatic detection and formatting of possible phone numbers -->
<meta name="format-detection" content="telephone=no"> <meta name="format-detection" content="telephone=no">
<!-- Completely opt out of DNS prefetching by setting to 'off' --> <!-- Completely opt out of DNS prefetching by setting to "off" -->
<meta http-equiv="x-dns-prefetch-control" content="off"> <meta http-equiv="x-dns-prefetch-control" content="off">
<!-- Stores cookie on the client web browser for client identification --> <!-- Stores a cookie on the client web browser for identification purposes -->
<meta http-equiv="set-cookie" content="name=value; expires=date; path=url"> <meta http-equiv="set-cookie" content="name=value; expires=date; path=url">
<!-- Specifies the page to appear in a specific frame --> <!-- Specifies the document to appear in a specific frame -->
<meta http-equiv="Window-Target" content="_value"> <meta http-equiv="Window-Target" content="_value">
<!-- Geo tags --> <!-- Geo tags -->
@ -162,42 +172,42 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
## Link ## Link
``` html ``` html
<!-- Points to a CSS stylesheet --> <!-- Points to an external CSS style sheet -->
<link rel="stylesheet" href="http://example.com/styles.css"> <link rel="stylesheet" href="http://example.com/styles.css">
<!-- Helps prevent duplicate content issues --> <!-- Helps prevent duplicate content issues -->
<link rel="canonical" href="http://example.com/2010/06/9-things-to-do-before-entering-social-media.html"> <link rel="canonical" href="http://example.com/2010/06/9-things-to-do-before-entering-social-media.html">
<!-- Used to be included before the icon link, but is deprecated and no longer is used --> <!-- Used to be included before the icon link, but it has been deprecated -->
<link rel="shortlink" href="http://example.com/?p=42"> <link rel="shortlink" href="http://example.com/?p=42">
<!-- Links to an AMP HTML version of the current document --> <!-- Links to an AMP HTML version of the current document -->
<link rel="amphtml" href="http://example.com/path/to/amp-version.html"> <link rel="amphtml" href="http://example.com/path/to/amp-version.html">
<!-- Links to a JSON file that specifies "installation" credentials for web applications --> <!-- Links to a JSON file that specifies "installation" credentials for the web applications -->
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json">
<!-- Links to the author of the document --> <!-- Links to information about the author(s) of the document -->
<link rel="author" href="humans.txt"> <link rel="author" href="humans.txt">
<!-- Refers to a copyright statement that applies to the links context --> <!-- Refers to a copyright statement that applies to the link's context -->
<link rel="license" href="copyright.html"> <link rel="license" href="copyright.html">
<!-- Gives a reference to a location in your document that may be in another language --> <!-- Gives a reference to a location in your document that may be in another language -->
<link rel="alternate" href="https://es.example.com/" hreflang="es"> <link rel="alternate" href="https://es.example.com/" hreflang="es">
<!-- Gives information about an author or another person --> <!-- Provides information about an author or another person -->
<link rel="me" href="https://google.com/profiles/thenextweb" type="text/html"> <link rel="me" href="https://google.com/profiles/thenextweb" type="text/html">
<link rel="me" href="mailto:name@example.com"> <link rel="me" href="mailto:name@example.com">
<link rel="me" href="sms:+15035550125"> <link rel="me" href="sms:+15035550125">
<!-- Links to a document that describes a collection of records, documents, or other materials of historical interest. --> <!-- Links to a document that describes a collection of records, documents, or other materials of historical interest -->
<link rel="archives" href="http://example.com/archives/"> <link rel="archives" href="http://example.com/archives/">
<!-- Links to top level resource in an hierarchical structure --> <!-- Links to top level resource in an hierarchical structure -->
<link rel="index" href="http://example.com/"> <link rel="index" href="http://example.com/">
<!-- Gives a self reference - useful when the document has multiple possible references --> <!-- Provides a self reference - useful when the document has multiple possible references -->
<link rel="self" type="application/atom+xml" href="http://example.com/atomFeed.php?page=3"> <link rel="self" type="application/atom+xml" href="http://example.com/atomFeed.php?page=3">
<!-- The first, next, previous, and last documents in a series of documents, respectively --> <!-- The first, next, previous, and last documents in a series of documents, respectively -->
@ -206,19 +216,19 @@ Valid `<head>` elements include `meta`, `link`, `title`, `style`, `script`, `nos
<link rel="prev" href="http://example.com/atomFeed.php?page=2"> <link rel="prev" href="http://example.com/atomFeed.php?page=2">
<link rel="last" href="http://example.com/atomFeed.php?page=147"> <link rel="last" href="http://example.com/atomFeed.php?page=147">
<!-- Used when using a 3rd party service to maintain a blog --> <!-- Used when a 3rd party service is utilized to maintain a blog -->
<link rel="EditURI" href="http://example.com/xmlrpc.php?rsd" type="application/rsd+xml" title="RSD"> <link rel="EditURI" href="http://example.com/xmlrpc.php?rsd" type="application/rsd+xml" title="RSD">
<!-- Forms an automated comment when another WordPress blog links to your WordPress blog or post --> <!-- Forms an automated comment when another WordPress blog links to your WordPress blog or post -->
<link rel="pingback" href="http://example.com/xmlrpc.php"> <link rel="pingback" href="http://example.com/xmlrpc.php">
<!-- Notifies a url when you link to it on your site --> <!-- Notifies a URL when you link to it on your document -->
<link rel="webmention" href="http://example.com/webmention"> <link rel="webmention" href="http://example.com/webmention">
<!-- Enables posting to your own domain using a Micropub client --> <!-- Enables posting to your own domain using a Micropub client -->
<link rel="micropub" href="http://example.com/micropub"> <link rel="micropub" href="http://example.com/micropub">
<!-- Loads in an external HTML file into the current HTML file --> <!-- Loads in an external HTML file into the current document -->
<link rel="import" href="/path/to/component.html"> <link rel="import" href="/path/to/component.html">
<!-- Open Search --> <!-- Open Search -->
@ -403,14 +413,14 @@ Pinterest lets you prevent people from saving things from your website, accordin
Since Chrome 31, you can set up your web app to "app mode" like Safari. Since Chrome 31, you can set up your web app to "app mode" like Safari.
``` html ``` html
<!-- Link to a manifest and define the manifest metadata. --> <!-- Link to a manifest and define the manifest metadata -->
<!-- The example of manifest.json could be found in the link below. --> <!-- The example of manifest.json could be found in the link below -->
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json">
<!-- Define your web page as a web app --> <!-- Define your web page as a web app -->
<meta name="mobile-web-app-capable" content="yes"> <meta name="mobile-web-app-capable" content="yes">
<!-- Homescreen Icon --> <!-- Homescreen Icon -->
<link rel="icon" sizes="192x192" href="/path/to/highres-icon.png"> <link rel="icon" sizes="192x192" href="/path/to/highres-icon.png">
``` ```
@ -451,10 +461,12 @@ Since Chrome 31, you can set up your web app to "app mode" like Safari.
<meta property="al:ios:url" content="applinks://docs"> <meta property="al:ios:url" content="applinks://docs">
<meta property="al:ios:app_store_id" content="12345"> <meta property="al:ios:app_store_id" content="12345">
<meta property="al:ios:app_name" content="App Links"> <meta property="al:ios:app_name" content="App Links">
<!-- Android --> <!-- Android -->
<meta property="al:android:url" content="applinks://docs"> <meta property="al:android:url" content="applinks://docs">
<meta property="al:android:app_name" content="App Links"> <meta property="al:android:app_name" content="App Links">
<meta property="al:android:package" content="org.applinks"> <meta property="al:android:package" content="org.applinks">
<!-- Web Fallback --> <!-- Web Fallback -->
<meta property="al:web:url" content="http://applinks.org/documentation"> <meta property="al:web:url" content="http://applinks.org/documentation">
``` ```
@ -477,9 +489,11 @@ Since Chrome 31, you can set up your web app to "app mode" like Safari.
``` html ``` html
<!-- Locks the screen into the specified orientation --> <!-- Locks the screen into the specified orientation -->
<meta name="x5-orientation" content="landscape/portrait"> <meta name="x5-orientation" content="landscape/portrait">
<!-- Display this page in fullscreen -->
<!-- Display this document in fullscreen -->
<meta name="x5-fullscreen" content="true"> <meta name="x5-fullscreen" content="true">
<!-- Page will be displayed in "application mode" (full screen, etc.) -->
<!-- Document will be displayed in "application mode" (full screen, etc.) -->
<meta name="x5-page-mode" content="app"> <meta name="x5-page-mode" content="app">
``` ```
@ -488,17 +502,23 @@ Since Chrome 31, you can set up your web app to "app mode" like Safari.
``` html ``` html
<!-- Locks the screen into the specified orientation --> <!-- Locks the screen into the specified orientation -->
<meta name="screen-orientation" content="landscape/portrait"> <meta name="screen-orientation" content="landscape/portrait">
<!-- Display this page in fullscreen -->
<!-- Display this document in fullscreen -->
<meta name="full-screen" content="yes"> <meta name="full-screen" content="yes">
<!-- UC browser will display images even if in "text mode" --> <!-- UC browser will display images even if in "text mode" -->
<meta name="imagemode" content="force"> <meta name="imagemode" content="force">
<!-- Page will be displayed in "application mode"(full screen, forbidding gesture, etc.) -->
<!-- Document will be displayed in "application mode"(full screen, forbidding gesture, etc.) -->
<meta name="browsermode" content="application"> <meta name="browsermode" content="application">
<!-- Disabled the UC browser's "night mode" in this page -->
<!-- Disabled the UC browser's "night mode" for this document -->
<meta name="nightmode" content="disable"> <meta name="nightmode" content="disable">
<!-- Simplify the page to reduce data transfer -->
<!-- Simplify the document to reduce data transfer -->
<meta name="layoutmode" content="fitscreen"> <meta name="layoutmode" content="fitscreen">
<!-- Disable the UC browser's feature of "scaling font up when there are many words in this page" -->
<!-- Disable the UC browser's feature of "scaling font up when there are many words in this document" -->
<meta name="wap-font-scale" content="no"> <meta name="wap-font-scale" content="no">
``` ```