HTML - Metaetiquetas
HTML le permite especificar metadatos: información adicional importante sobre un documento de varias formas. Los elementos META se pueden utilizar para incluir pares de nombre / valor que describen las propiedades del documento HTML, como el autor, la fecha de caducidad, una lista de palabras clave, el autor del documento, etc.
los <meta>se utiliza para proporcionar dicha información adicional. Esta etiqueta es un elemento vacío y, por lo tanto, no tiene una etiqueta de cierre, pero lleva información dentro de sus atributos.
Puede incluir una o más metaetiquetas en su documento según la información que desee mantener en su documento, pero en general, las metaetiquetas no afectan la apariencia física del documento, por lo que desde el punto de vista de la apariencia, no importa si incluye ellos o no.
Agregar metaetiquetas a sus documentos
Puede agregar metadatos a sus páginas web colocando etiquetas <meta> dentro del encabezado del documento que está representado por <head> y </head>etiquetas. Una metaetiqueta puede tener los siguientes atributos además de los atributos principales:
| No Señor | Atributo y descripción |
|---|---|
| 1 | Name Nombre de la propiedad. Puede ser cualquier cosa. Los ejemplos incluyen palabras clave, descripción, autor, revisado, generador, etc. |
| 2 | content Especifica el valor de la propiedad. |
| 3 | scheme Especifica un esquema para interpretar el valor de la propiedad (como se declara en el atributo de contenido). |
| 4 | http-equiv Se utiliza para encabezados de mensajes de respuesta http. Por ejemplo, http-equiv se puede utilizar para actualizar la página o para configurar una cookie. Los valores incluyen tipo de contenido, caducidad, actualización y configuración de cookies. |
Especificar palabras clave
Puede utilizar la etiqueta <meta> para especificar palabras clave importantes relacionadas con el documento y, posteriormente, los motores de búsqueda utilizan estas palabras clave al indexar su página web con fines de búsqueda.
Ejemplo
A continuación se muestra un ejemplo en el que agregamos HTML, metaetiquetas y metadatos como palabras clave importantes sobre el documento.
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Esto producirá el siguiente resultado:
Descripción del documento
Puede utilizar la etiqueta <meta> para dar una breve descripción sobre el documento. Esto nuevamente puede ser utilizado por varios motores de búsqueda mientras indexa su página web con fines de búsqueda.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Fecha de revisión del documento
Puede utilizar la etiqueta <meta> para proporcionar información sobre cuándo se actualizó el documento por última vez. Esta información puede ser utilizada por varios navegadores web mientras actualiza su página web.
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Actualización de documentos
Se puede usar una etiqueta <meta> para especificar una duración después del cual su página web se actualizará automáticamente.
Ejemplo
Si desea que su página se actualice cada 5 segundos, utilice la siguiente sintaxis.
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
<meta http-equiv = "refresh" content = "5" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Redirección de página
Puede utilizar la etiqueta <meta> para redirigir su página a cualquier otra página web. También puede especificar una duración si desea redirigir la página después de un cierto número de segundos.
Ejemplo
A continuación, se muestra un ejemplo de cómo redirigir la página actual a otra página después de 5 segundos. Si desea redirigir la página inmediatamente, no especifique el atributo de contenido .
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
<meta http-equiv = "refresh" content = "5; url = http://www.tutorialspoint.com" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Configuración de cookies
Las cookies son datos que se almacenan en pequeños archivos de texto en su computadora y se intercambian entre el navegador web y el servidor web para realizar un seguimiento de la información diversa según las necesidades de su aplicación web.
Puede utilizar la etiqueta <meta> para almacenar cookies en el lado del cliente y, posteriormente, el servidor web puede utilizar esta información para realizar un seguimiento de los visitantes del sitio.
Ejemplo
A continuación, se muestra un ejemplo de cómo redirigir la página actual a otra página después de 5 segundos. Si desea redirigir la página inmediatamente, no especifique el atributo de contenido .
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta http-equiv = "cookie" content = "userid = xyz; expires = Wednesday, 08-Aug-15 23:59:59 GMT;" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Si no incluye la fecha y hora de vencimiento, la cookie se considera una cookie de sesión y se eliminará cuando el usuario salga del navegador.
Note- Puede consultar el tutorial de PHP y cookies para obtener un detalle completo sobre las cookies.
Configuración del nombre del autor
Puede establecer un nombre de autor en una página web mediante metaetiqueta. Vea un ejemplo a continuación:
Ejemplo
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "author" content = "Mahnaz Mohtashim" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Especificar juego de caracteres
Puede utilizar la etiqueta <meta> para especificar el conjunto de caracteres utilizado dentro de la página web.
Ejemplo
De forma predeterminada, los servidores web y los navegadores web utilizan la codificación ISO-8859-1 (Latin1) para procesar páginas web. A continuación se muestra un ejemplo para configurar la codificación UTF-8:
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "author" content = "Mahnaz Mohtashim" />
<meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>Para publicar la página estática con caracteres chinos tradicionales, la página web debe contener una etiqueta <meta> para configurar la codificación Big5:
<!DOCTYPE html>
<html>
<head>
<title>Meta Tags Example</title>
<meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
<meta name = "description" content = "Learning about Meta Tags." />
<meta name = "author" content = "Mahnaz Mohtashim" />
<meta http-equiv = "Content-Type" content = "text/html; charset = Big5" />
</head>
<body>
<p>Hello HTML5!</p>
</body>
</html>