The meta element represents various kinds of metadata that cannot be expressed using the title, base, link, style, and script elements.
  1. Exactly one of the following attributes must be specified.
    1. name
    2. http-equiv
    3. charset
  2. If either name or http-equiv is specified, then the content attribute must also be specified
  3. Otherwise, it must be omitted


The structure of a meta element


<meta charset="utf-8">
It is important that the character encoding declaration appears early in the document as most browsers will try to determine the character encoding from the first 1,024 bytes of a file (Coulson)


<meta charset="big5">

<meta charset="US-ASCII">


<meta name="google" content="notranslate" >

<meta name="robots" content="nofollow">

<meta name="robots" content="index, follow">



<meta name="viewport" content="width=device-width,initial-scale=1.0">
  1. width
    1. Controls the size of the viewport
    2. It can be set to a specific number of pixels like width=600
    3. Or to the special value device-width, which is 100vw, or 100% viewport
    4. Minimum: 1, Maximum: 10000
  2. initial-scale
    1. Controls the zoom level when the page is first loaded
    2. Minimum: 0.1, Maximum: 10
    3. Default: 1
    4. Negative values: ignored


<meta name="description" content="my description">
  1. Short and accurate summary of the content of the page. Several browsers, like Firefox and Opera, use this as the default description of bookmarked pages.
  2. Google does NOT use the meta keyword tag but DOES use the meta description tag


<meta name="keywords" content="my,keywords">
Words relevant to the page's content separated by commas


<meta http-equiv="refresh" content="5">

<meta http-equiv="refresh" content= "5; url='my_new_page.html' ">

<meta http-equiv="default-style" content="Default">

<meta http-equiv="X-UA-Compatible" content="ie=edge">
  1. Defines a pragma directive.
  2. The attribute is named http-equiv(alent) because all the allowed values are names of particular HTTP headers
  3. The following keywords may be used
    1. content-language
    2. content-type
    3. default-style
    4. refresh
    5. set-cookie
  4. If http-equiv represents one of the above states, then the user agent must run the algorithm appropriate for that state
  5. The meta element with a http-equiv attribute whose value is "default-style" represents a pragma directive that specifies the document's preferred stylesheet.
  6. The content value of http-equiv="default-style" content="Value"must refer to the title attribute of a stylesheet (either external or internal), otherwise css styling will break
  7. refresh
    1. Positive integer. The number of seconds until page reloads/redirects
    2. May be followed by ';url="myurl'


<meta name=generator content="Frontweaver 8.2">