The 33 Content Metas of HTML
A Content Meta specify data about the data in Content Windows
Each Content Meta must be declared within the Head Container
Charset Meta
The Charset Meta specifies the character encoding for a web document.
The syntax is one void meta
element per document with either of the following attributes:
-
One
charset
attribute with theutf-8
value -
Both of the following attributes:
-
http-equiv
attribute with thecontent-type
value -
content
attribute with the "text/html; charset=utf-8" value
-
<meta charset="utf-8">
<!-- or -->
<meta http-equiv="content-type" content="text/html; charset=utf-8">
Title Meta
The Title Meta specifies an elaboration of the document name.
A document must have a Title Meta, except for each of the following cases:
-
The document is an
iframe
element with asrcdoc
attribute -
The title information is available from a higher-level protocol
The syntax is one title
element per document with the following attributes and content:
-
Zero or one count for each Global Attribute
-
A non-empty text content
<title> [non-empty text] </title>
URL Meta
The URL Meta specifies a prefix for all non-schemed URLs in a web document.
This meta must precede elements with attributes that accept URLs.
The syntax is one void base
element per document with the following attributes:
-
Zero or one
href
attribute -
Zero or one count for each Global Attribute
<base href="[URL]">
Target Meta
The Target Meta specifies the default opening context for all URLs in a web document.
This Meta must precede elements that represent hyperlinks
The syntax is one void base
element per document with the following attributes:
-
Zero or one
target
attribute -
Zero or one count for each Global Attribute
<base href="[navigable-name-or-keyword]">
Canonical Meta
A Canonical Meta specifies the document as a duplicate to an external resource.
The syntax is a one void link
element per document with the following attributes:
-
One
rel
attribute with thecanonical
keyword. -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="canonical" href="[resource-url]">
Icon Meta
An Icon Meta specifies a graphic resource that identifies a web document in the browser chrome.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with theicon
keyword -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="icon" href="[resource-url]">
Description Meta
The Description Meta summarizes the information in Content Windows.
The syntax is a one void meta
element per document with the following attributes:
-
One
name
attribute with thedescription
value -
Zero or one count for each Global Attribute
<meta name="description" content="[value]">
Keywords Meta
A Keywords Meta specifies a set of words that represent information in Content Windows.
The syntax is a void meta
element with the following attributes:
-
One
name
attribute with thekeywords
value -
Zero or one count for each Global Attribute
<meta name="keywords" content="[value]">
Author Meta
An Author Meta specifies the name of the author of a web document.
The syntax is a void meta
element with the following attributes:
-
One
name
attribute with theauthor
value -
Zero or one count for each Global Attribute
<meta name="author" content="[value]">
Generator Meta
A Generator Meta specifies the name of a software that generates a part or the whole of a web document.
The syntax is a void meta
element with the following attributes:
-
One
name
attribute with thegenerator
value -
Zero or one count for each Global Attribute
<meta name="generator" content="[value]">
Translation Meta
A Translation Meta specifies a version of the current document in another language.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thealternate
keyword -
One
href
attribute -
One
hreflang
attribute with a language different from that of the document -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="alternate" hreflang="[not-document-language]" href="[resource-url]">
Repurposing Meta
A Repurposing Meta specifies a version of the current document in another format.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thealternate
keyword -
One
href
attribute -
One
type
attribute without theapplication/rss+xml
value or theapplication/atom+xml
value. -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="alternate" href="[URL]" type="[valid-MIME-TYPE]">
Next Meta
A Next Meta specifies a resource that is next in sequence to the current document.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thenext
keyword -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="next" href="[resource-url]">
Search Meta
A Search Meta relates an external resource to discover the contents of the current document.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thesearch
keyword -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="search" href="[resource-url]">
Referrer Meta
A Referrer Meta specifies the default referrer policy of a web document.
The syntax is a void meta
element with the following attributes:
-
One
name
attribute with thereferrer
value -
Zero or one count for each Global Attribute
<meta name="referrer" content="[value]">
Security Meta
The Security Meta specifies a policy to secure the content of a web document.
The syntax is one void meta
element per document with the following attributes:
-
One
http-equiv
attribute with thecontent-security-policy
value -
Zero or one count for each Global Attribute
<meta http-equiv="content-security-policy" content="[value]">
Timeout Meta
The Timeout Meta specifies the time to redirect a web document.
The syntax is one void meta
element per document with the following attributes:
-
One
http-equiv
attribute with therefresh
value -
Zero or one count for each Global Attribute
<meta http-equiv="refresh" content="[value]">
Name Meta
The Name Meta specifies the name of the application in a web document.
The syntax is one void meta
element per document with the following attributes:
-
One
name
attribute with theapplication-name
value -
Zero or one count for each Global Attribute
<meta name="application-name" content="[value]">
Manifest Meta
A Manifest Meta specifies a JSON resource that provides information about the web application in a web document.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with amanifest
keyword. And, an optionalpreload
keyword -
One
href
attribute -
One
as
attribute with amanifest
value if thepreload
keyword is in therel
attribute. -
Zero or one count for each of the following attributes:
-
Zero or one
integrity
attribute if thepreload
keyword is in therel
attribute -
Zero or one count for each Global Attribute
<link rel="manifest" href="[url]">
Pingback Meta
A Pingback Meta relates a server resource to handle pingbacks to a web document
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thepingback
keyword -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="pingback" href="[url]">
Feed Meta
A Feed Meta relates an external resource to syndicate the contents of a web document to aggregators
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thealternate
keyword -
One
href
attribute -
One
type
attribute with a MIME Type value but not the following keywords:application/rss+xml
andapplication/atom+xml
. -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
<link rel="alternate" type="application/rss+xml" href="[resource-url]">
<!-- or -->
<link rel="alternate" type="application/atom+xml" href="[resource-url]">
Theme Meta
A Theme Meta relates the color to customize the interface of the user agent.
The syntax is a void meta
element with the following attributes:
-
One
name
attribute with thetheme-color
value -
Zero or one count for each Global Attribute
<meta name="theme-color" content="[value]">
Scheme Meta
The Scheme Meta relates the color scheme to use as default for a web document.
The syntax is one void meta
element per document with the following attributes:
-
One
name
attribute with thecolor-scheme
value -
Zero or one count for each Global Attribute
<meta name="color-scheme" content="[value]">
Template Meta
A Template Meta specifies a fragment of an HTML document with optional placeholders
The syntax is a template
element with the following attributes and contents:
-
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
-
Zero or more counts for each Flow Content Element.
<template>
</template>
Font Meta
A Font Meta relates a font resource to be loaded in advance for use within a content window.
The syntax is a void link
element with the following keywords:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute with afont
value -
One count for each of the following attributes:
-
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
<link rel="preload" as="font" href="[URL]" crosorigin>
Image Meta
An Image Meta relates an image resource to be loaded in advance for use within a content window
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute with animage
value -
One or both of the following attributes:
-
Zero or one
imagesizes
attribute if theimagesrscet
attribute has a value that includes a width descriptor -
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
<link rel="preload" as="image" href="[URL]" imagesrcset="[IMS]">
Media Meta
A Media Meta relates an audio
or a video
resource to be loaded in advance for use within a content window
The syntax is a void link
element with the following keywords:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute with anaudio
value orvideo
value -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
<link rel="preload" as="[audio|video]" href="[URL]">
Track Meta
A Track Meta relates a text track resource to be loaded in advance for use within a content window.
The syntax is a void link
element with the following keywords:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute withtrack
value. -
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
<link rel="preload" as="track" href="[URL]">
Document Meta
A Document Meta relates a document to be loaded in advance for an iframe
, object
, or embed
element in a content window.
The syntax is a void link
element with the following keywords:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute with one of the following values:-
document
-
object
-
embed
-
-
One
href
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
<link rel="preload" as="[document|object|embed]" href="[URL]">
Stylesheet Meta
A Stylesheet Meta specifies a set of CSS Rules on a web document for presentational purposes.
Usage Scenario
There are the following 3 ways to which CSS Rules apply to a web document
All 3 create a Persistent Stylesheet on Content Windows.
Meanwhile, setting a title
attribute on an external or embedded stylesheet creates a design variation for user's choice. Each variation becomes a set of Alternate Stylesheets
The initial variation to style the Content Windows is provided by a Default Stylesheet
External Stylesheet
An External Stylesheet relate CSS Rules applicable to one or more web pages.
The syntax is a void link
element with the following attributes:
-
One
rel
attribute with thestylesheet
keyword.It may include a
preload
keyword to load the stylesheet in advance. -
One
href
attribute -
One
as
attribute with astyle
value if there's apreload
keyword in therel
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute
Embedded Stylesheet
An Embedded Stylesheet relate CSS Rules applicable to only one web page
The syntax is a style
element with the following attributes and content:
-
Zero or one count for each of the following attributes:
-
Zero or one count for the
title
attribute and each other Global Attribute -
A text content that gives a conformant style sheet
<style>
/* text that is style conformant */
</style>
Inline Stylesheet
An Inline Stylesheet relate CSS declarations applicable to only one HTML element.
The syntax is a style
attribute with a value conforming to a conformant style sheet
Script Meta
A Script Meta specifies javascript instructions on a web document for dynamic contents.
External Javascript
An External Javascript relate instructions applicable to one or more web web pages
It can be a Classic Script or a Preloaded Script. An External Classic Script loads and runs a javascript resource. A Preloaded External Script loads but not run the javascript resource. The latter helps with performance optimizations
The syntax for an External Classic Script is a script
element with the following attributes and content:
-
One
src
attribute -
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
-
An optional text content matching script content restrictions and conforming to a script documentation
<script src="[valid-URL]"></script>
The syntax for an External Preloaded Script is a void link
element with the following attributes:
-
One
rel
attribute with apreload
keyword. -
One
as
attribute with one of the following values:-
audioworklet
-
paintworklet
-
serviceworker
-
sharedworker
-
worker
-
script
-
json
-
-
One
href
attribute -
Zero or one count for each of the following attributes:
<link rel="preload" as="[audioworklet|paintworklet|serviceworker|sharedworker|worker|script|json]" href="[URL]">
Embedded Javascript
An Embedded Javascript relate instructions applicable to only one web page
The syntax is a script
element with the following attributes and content:
-
Zero or one count for each of the following attributes:
-
Zero or one count for each Global Attribute
-
A text content matching script content restrictions and conforming to the value of the
type
attribute
<script>
</script>
Inline Javascript
An Inline Javascript relate instructions to only one HTML element
The syntax is an event handler content attribute with applicable values.
Custom Link Meta
A Custom Link Meta specifies a non-standard metadata keyword whose value must be a URL to a resource
The syntax is a void link
element with the following attributes:
-
One
rel
attribute but it must have an extension link type keyword -
One
href
attribute -
Zero or one for the following attributes if the extension link type is an external resource link:
crossorigin
fetchpriority
, andreferrerpolicy
-
Zero or one count for each of the following attributes:
hreflang
,media
, andtype
-
Zero or one
color
attribute ifrel
attribute has amask-icon
-
Zero or one count for each Global Attribute
<link rel="[extension-link-type-keyword]" href="[URL]">
Custom Text Meta
A Custom Text Meta specifies a non-standard metadata keyword whose value must not be a URL to a resource
The syntax is a void meta
element with the following attributes:
-
One
name
attribute whose value must be a Meta Name Extension -
Zero or one count for each Global Attribute
<meta name="[meta-name-extension]" value="[value]">