<META>

The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable.

CHARSET

Specifies the character encoding for the HTML document

CONTENT

Gives the value associated with the http-equiv or name attribute

HTTP-EQUIV

Provides an HTTP header for the information/value of the content attribute

NAME

Specifies a name for the metadata

VIEWPORT

The viewport attribute specifies how the browser should control the page zoom level and dimensions

<!-- Specifies the name of the Web application that the page represents -->
<meta name="application-name" content="Document structure">

<!-- Specifies the name of the author of the document. -->
<meta name="author" content="Ivan Ivanov"> 

<!-- Specifies a description of the page. Search engines can pick up this 
description to show with the results of searches. -->
<meta name="description" content="HTML and CSS"> 

<!-- Specifies one of the software packages used to generate the document
(not used on hand-authored pages) -->
<meta name="generator" content="Frontweaver 8.2"> 
    
<!-- Specifies a comma-separated list of keywords - relevant to the page
(Informs search engines what the page is about). -->
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"> 

Examples

<!-- Specifies the character encoding for the document. -->
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 

<!-- Specified the preferred style sheet to use. -->
<meta http-equiv="default-style" content="the document's preferred stylesheet"> 

<!-- Defines a time interval for the document to refresh itself. -->
<meta http-equiv="refresh" content="30"> 

<!-- 
The "width=device-width" sets the width of the page to follow the screen-width of
the device (which will vary depending on the device).

The "initial-scale=1" sets the initial zoom level when the page is first loaded 
by the browser. This keeps the page displaying correctly on orientation change.

The "minimum-scale=1" prevents users zooming too far out.
The "maximum-scale=1" prevents them zooming too far in.

The "user-scalable=no" disable user scaling
-->

<meta name="viewport" content="width=device-width, initial-scale=1,
        maximum-scale=1, user-scalable=no">

Examples

<LINK>

The <link> tag defines a link between a document and an external resource.

The <link> tag is used to link to external style sheets.

CROSSORIGIN

Specifies how the element handles cross-origin requests

HREF

Specifies the location of the linked document

HREFLANG

Provides an HTTP header for the information/value of the content attribute

MEDIA

Specifies on what device the linked document will be displayed

REL

Specifies the relationship between the current document and the linked document

TYPE

Specifies the media type of the linked document

Examples

<!-- Default. Suitable for all devices -->
<link media="all">

<!-- Speech synthesizers -->
<link media="aural">

<!-- Braille feedback devices -->
<link media="braille">

<!-- Handheld devices (small screen, limited bandwidth) -->
<link media="handheld">

<!-- Projectors -->
<link media="projection">

<!-- Print preview mode/printed pages -->
<link media="print">

<!-- Computer screens -->
<link media="screen">

<!-- Teletypes and similar media using a fixed-pitch character grid -->
<link media="tty">

<!-- Television type devices (low resolution, limited scroll ability) -->
<link media="tv">

Examples

<!-- Links to an alternate version of the document 
(i.e. print page, translated or mirror) -->
<link rel="alternate">

<!-- Links to the author of the document -->
<link rel="author">

<!-- Links to a help document -->
<link rel="help">

<!-- Imports an icon to represent the document. -->
<link rel="icon">

<!-- Links to copyright information for the document -->
<link rel="license">

<!-- Indicates that the document is a part of a series, and that the next document
in the series is the referenced document -->
<link rel="next">

<!-- Specifies that the target resource should be cached -->
<link rel="prefetch">

<!-- Indicates that the document is a part of a series, and that the previous 
document in the series is the referenced document -->
<link rel="prev">

Examples

<!-- Links to a search tool for the document -->
<link rel="search">

<!-- URL to a style sheet to import -->
<link rel="stylesheet">

<!-- The URL of the linked resource/document. -->
<link href="URL">

<!-- A two-letter language code that specifies the language of the linked document -->
<link hreflang="langauge_code">

<!-- The type attribute specifies the Internet media type (formerly known as MIME type)
of the linked document/resource. Complete list of standard media types: 
"http://www.iana.org/assignments/media-types/media-types.xhtml" -->

<link type="media_type">  

<SCRIPT>

The <script> element either contains scripting statements, or it points to an external script file through the src attribute.

The <script> tag is used to define a client-side script, such as a JavaScript.

CHARSET

Specifies the character encoding used in an external script file

DEFER

Specifies that the script is executed when the page has finished parsing (only for external scripts)

SRC

Specifies the URL of an external script file

TYPE

Specifies the media type of the script

ASYNC

Specifies that the script is executed asynchronously (only for external scripts)

Example

<!-- A script that will be run asynchronously as soon as it is available.
The async attribute is a boolean attribute.-->
<script src="demo_async.js" async></script> 

<!-- An external JavaScript with an UTF-8 character set -->
<script src="myscripts.js" charset="UTF-8"></script>

<!-- A script that will not run until after the page has loaded -->
<script src="demo_defer.js" defer></script>

<!-- Point to an external JavaScript file -->
<script src="myscripts.js"></script>

<!-- A script with the type attribute specified -->
<script type="text/javascript">
    document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>