Acerca de este problema HTML
El elemento <meta> proporciona metadatos sobre el documento HTML — información que no se muestra en la página pero que es utilizada por navegadores, motores de búsqueda y otros servicios web. Según la especificación HTML, una etiqueta <meta> sin ninguno de los atributos reconocidos carece de significado. El validador marca esto porque un elemento <meta> vacío (o uno con solo atributos no reconocidos) no proporciona metadatos útiles y probablemente indica un error o una etiqueta incompleta.
Este problema ocurre comúnmente cuando una etiqueta <meta> se deja vacía por accidente, cuando el nombre de un atributo está mal escrito (por ejemplo, naem en lugar de name), o cuando un atributo obligatorio se elimina accidentalmente durante la edición.
La mayoría de casos de uso de <meta> siguen algunos patrones, cada uno requiriendo combinaciones específicas de atributos:
-
charset— Se usa solo para declarar la codificación de caracteres del documento. -
name+content— Se usan juntos para definir metadatos con nombre como descripciones, configuraciones del viewport, o información del autor. -
http-equiv+content— Se usan juntos para simular una cabecera de respuesta HTTP. -
property+content— Se usan juntos para Open Graph y metadatos similares basados en RDFa. -
itemprop+content— Se usan juntos para anotaciones de microdatos.
Ten en cuenta que content por sí solo no es suficiente — debe emparejarse con name, http-equiv, property, o itemprop para tener significado.
Ejemplos
Incorrecto: etiqueta <meta> vacía sin atributos
Esto desencadena el error de validación porque el elemento <meta> no tiene atributos reconocidos:
<meta>Incorrecto: atributo mal escrito
Un error tipográfico en el nombre del atributo significa que el validador no lo reconoce:
<meta nane="description" content="An example page.">
Incorrecto: content sin un atributo de emparejamiento
El atributo content por sí solo no es suficiente — necesita name, http-equiv, property, o itemprop:
<meta content="some value">
Correcto: codificación de caracteres con charset
<meta charset="UTF-8">
Correcto: metadatos con nombre usando name y content
<meta name="description" content="A brief description of the webpage.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Jane Doe">
Correcto: equivalente HTTP con http-equiv y content
<meta http-equiv="X-UA-Compatible" content="IE=edge">
Correcto: metadatos de Open Graph con property y content
<meta property="og:title" content="My Page Title">
<meta property="og:description" content="A summary of the page content.">
Correcto: microdatos con itemprop y content
<meta itemprop="name" content="Product Name">Ejemplo de documento completo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A brief description of the webpage.">
<meta property="og:title" content="My Page Title">
<title>Example Page</title>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Cómo solucionarlo
-
Encuentra la etiqueta
<meta>marcada en tu código HTML en el número de línea que reporta el validador. -
Revisa errores tipográficos en los nombres de atributos — asegúrate de que
name,charset,http-equiv,property, oitempropestén escritos correctamente. -
Añade el atributo faltante. Determina qué se supone que debe hacer la etiqueta
<meta>y añade el atributo(s) apropiado(s). Si no puedes determinar su propósito, puede ser seguro eliminarla por completo. -
Asegura el emparejamiento correcto. Si estás usando
content, asegúrate de que esté emparejado conname,http-equiv,property, oitemprop. El atributocharsetes el único que funciona por sí solo sincontent.
Encuentra problemas como este automáticamente
Rocket Validator escanea miles de páginas en segundos, detectando problemas de HTML en todo tu sitio web.
Más información: