Etiqueta meta en HTML

La etiqueta meta en HTML es un elemento que se coloca en la cabecera de una página web. Aunque no es visible para los visitantes, es de gran utilidad para navegadores y otros programas que utilizan esta información.

La palabra “meta” proviene de “metainformación” y se utiliza para aportar información adicional sobre el documento. Se coloca dentro del elemento head de la página.

Ejemplos de emplear la etiqueta meta

1 Descripción (Description)

Ejemplo: < meta name="description" content="Esta es una página sobre recetas saludables" >

Funcionamiento: Proporciona una breve descripción de la página que aparece en los resultados de búsqueda. Ayuda a los usuarios a entender el contenido antes de hacer clic

2 Palabras clave (Keywords)

Ejemplo: < meta name="keywords" content="recetas, salud, cocina, alimentos" >

Funcionamiento: Solía ser relevante para SEO, pero ahora es menos importante. Define palabras clave relacionadas con el contenido de la página1.

3 Autor (Author)

Ejemplo: < meta name="author" content="Juan Pérez" >

Funcionamiento: Indica el autor o creador de la página. Puede ser útil para identificar la autoría3.

4 Idioma (Language)

Ejemplo: < meta name="language" content="es" >

Funcionamiento: Especifica el idioma principal de la página. Ayuda a los motores de búsqueda a entender el contenido

5 Viewport para móviles

Ejemplo: < meta name="viewport" content="width=device-width, initial-scale=1.0" >

Funcionamiento: Ajusta la escala y el ancho de la página para dispositivos móviles, mejorando la experiencia del usuario

6 Fecha de creación

Ejemplo: < meta name="date" content="2024-02-16" >

Funcionamiento: Indica la fecha de creación o última modificación de la página

7 Tipo de contenido

Ejemplo: < meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >

Funcionamiento: Define el tipo de contenido y la codificación de caracteres. Es importante para la interpretación correcta del contenido1.

8 Redirección automática

Ejemplo: < meta http-equiv="refresh" content="5;url=https://miotrapagina.com" >

Funcionamiento: Redirige automáticamente a otra página después de un tiempo específico (aquí, 5 segundos)

9 Control de robots

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

Funcionamiento: Indica a los robots de búsqueda si deben indexar la página y seguir los enlaces. Puede ser útil para SEO1.

10 Redes sociales

Ejemplo: < meta property="og:image" content="https://miotrapagina.com/imagen.jpg" >

Funcionamiento: Define una imagen que se mostrará cuando se comparta la página en redes sociales (usando Open Graph).