Elemento meta

Si no sabes lo que es un elemento o cómo debes usarlo, te recomiendo leer el tutorial "Tags y atributos en HTML" que puedes encontrar en la sección de tutoriales HTML.

Descripción

El elemento meta provee metadatos que no pueden ser expresados con otros elementos del encabezado (head), como title, base, link, style y script. Este elemento puede ser utilizado de tres maneras diferentes.

Con el atributo charset

En este caso, el atributo debe estar solo y tener un valor que represente al conjunto de caracteres utilizado por el documento.

Con el atributo name

El elemento provee metadatos a nivel de documento organizados en pares nombre-valor. El "nombre" en este par es provisto por el atributo name, mientras que el "valor" es provisto por el atributo content en cada caso.

A continuación hay una referencia para los nombres estándar que se pueden utilizar para este propósito, y una descripción de la información que debería proveer el atributo content.

  • application-name: el nombre de la aplicación web que este documento representa. Las traducciones del nombre pueden ser provistas en conjunto con el atributo lang. No debe existir más de un nombre de aplicación meta para un lenguaje específico.
  • author: el nombre del autor del documento. Múltiples autores pueden ser declarados con múltiples declaraciones meta.
  • description: una breve descripción del documento o su propósito. Solo puede haber una descripción meta en el documento.
  • generator: el nombre de uno de los programas utilizados para generar el documento. Múltiples generadores pueden ser declarados con múltiples declaraciones meta.
  • keywords: un conjunto de identificadores separados por comas, cada uno de los cuales es una palabra clave que describe de alguna manera los contenidos del documento.

Con el atributo http-equiv

El elemento representa una directiva pragma y su tipo es declarado en el atributo http-equiv. Los valores para su interpretación son definidos en el atributo content.

Existe un conjunto de directivas pragma estándares que se describe en la lista a continuación, donde el nombre de cada directiva es asociado a una descripción de cómo debería ser el valor del atributo content.

  • content-type: esta directiva es una alternativa a la declaración meta con el atributo charset. Especifica el conjunto de caracteres utilizado por el documento pero en este caso, el valor es precedido por la cadena "text/html; charset=".

    Ejemplo

    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    
  • default-style: el nombre de la hoja de estilos predeterminada. Su valor debe coincidir con el atributo title de algún elemento link en el documento que enlace a una hoja de estilos, o con el atributo title de un elemento style. Esta directiva es útil cuando hay más de una hoja de estilos en un solo documento.
  • refresh: establece el número de segundos que el navegador debería esperar antes de redireccionar automáticamente al usuario a otra página. Los valores pueden ser establecidos de dos formas:
    • Con un entero positivo, que define el número de segundos a esperar antes de recargar la página.
    • Con un entero positivo, que define el número de segundos a esperar, seguido de la cadena "; URL=") y el URL a donde el navegador debería redireccionar al usuario luego del tiempo especificado.

      Ejemplo

      <meta http-equiv="refresh" content="60; URL=http://www.htmlquick.com/">
      

Un elemento meta debe tener uno, y solo uno, de estos cuatro atributos: charset, name, http-equiv y itemprop.

El atributo content debe estar presente cuando cualquiera de los atributos name, http-equiv y itemprop es usado. En cualquier otro caso, debe omitirse.

Cuando el atributo itemprop está ausente, este elemento sólo puede ser declarado en el encabezado del documento (head). En caso contrario puede ser declarado en cualquier parte.

Ejemplos

En el siguiente ejemplo declararemos un conjunto de elementos meta para proveer la siguiente información acerca del documento: el juego de caracteres utilizado, dos autores, una descripción y una redirección programada.

<head>
  <title>Derrocando a un imperio intergaláctico</title>
  <meta charset="utf-8">
  <meta name="author" content="Luke Skywalker">
  <meta name="author" content="Darth Vader">
  <meta name="description" content="Guía completa para derrocar a un imperio intergaláctico, con representaciones y ejemplos prácticos">
  <meta http-equiv="refresh" content="15; url=http://www.basurarebelde.com/">
</head>

Atributos

Atributos específicos

name

El nombre en un par nombre-valor, compuesto por este atributo y el atributo content. Existe un número de nombres estándares en HTML5:

  • application-name: el nombre la aplicación web que este documento representa. Translated names can be provided together with the lang attribute. There musn't be more that one meta application name for a specific language.
  • author: el nombre del autor del documento. Múltiples autores pueden ser declarados con múltiples declaraciones meta.
  • description: una breve descripción del documento o su propósito. Solo puede haber una descripción meta en el documento.
  • generator: el nombre de uno de los programas utilizados para generar el documento. Múltiples generadores pueden ser declarados con múltiples declaraciones meta.
  • keywords: un conjunto de identificadores separados por comas, cada uno de los cuales es una palabra clave que describe de alguna manera los contenidos del documento.

Ejemplo

<meta name="author" content="Master Yoda">
<meta name="description" content="Especificaciones para la nave X-wing con información, planos e imágenes">

http-equiv

Un valor que indica el tipo de directiva pragma que representa el elemento. Existen tres valores posibles, insensibles a mayúsculas/minúsculas:

  • content-type: esta directiva es una alternativa a la declaración meta con el atributo charset. Especifica el conjunto de caracteres utilizado por el documento pero éste es precedido por la cadena "text/html; charset=".
  • default-style: el nombre de la hija de estilos predeterminada utilizada para la renderización del documento. Su valor debe coincidir con el atributo title de algún elemento link en el documento que enlace a una hoja de estilos, o con el atributo title de un elemento style. Esta directiva es útil cuando hay más de una hoja de estilos en un solo documento.
  • refresh: establece el número de segundos que el navegador debería esperar antes de redireccionar automáticamente al usuario a otra página. Los valores pueden ser establecidos de dos formas:
    • Con un entero positivo, que define el número de segundos a esprar antes de recargar la página.
    • Con un entero positivo, que define el número de segundos a esperar, seguido de la cadena "; URL=") y el URL a donde el navegador debería redireccionar al usuario luego del tiempo especificado.

Ejemplo

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="default-style" content="Hoja de estilos principal">
<meta http-equiv="refresh" content="300; url=/clasica/lista.html">

content

El valor en un par nombre-valor, compuesto por este atributo y uno de los atributos name y http-equiv. Los valores posibles dependen del contexto y son especificados en las descripciones de los atributos name y http-equiv.

Ejemplo

<meta name="application-name" content="LinkScanner 2.0">
<meta name="description" content="Escanea automáticamente todos los vínculos en tu sitio sin intervenciones">
<meta http-equiv="refresh" content="90">

charset

El juego de caracteres utilizado por el documento.

Ejemplo

<meta charset="utf-8">

scheme

Una cadena con información adicional para ayudar a los navegadores a comprender las propiedades declaradas por el elemento.

Este atributo ha sido removido del estándar HTML5. Los autores deberían recurrir ahora a la wiki de HTML5 (wiki de extensiones pragma y wiki de extensiones meta).

Ejemplo

<meta name="date" content="2015-04-22" scheme="YYYY-MM-DD">
<meta name="code" content="0553293354" scheme="ISBN-10">

Atributos globales

Para más información acerca de los atributos globales refiérete a esta lista de atributos gloables en HTML5.

Eventos

Eventos globales

Para más información acerca de los eventos globales refiérete a esta lista de eventos globales en HTML5.