Elementos y mejores prácticas en metadatos HTML

Las etiquetas meta son breves extractos de un código que informan a los motores de búsqueda sobre información crucial sobre su página web. También controlan cómo se muestran los navegadores web a los visitantes. Las etiquetas meta están presentes en todas las páginas web y solo puede verlas en el código HTML. Aquí hay una lista de ejemplos de etiquetas meta para SEO.

• Metadescripción
• Metarobots
• metatítulo
• metajuego de caracteres
• Redirección de meta actualización
• Meta ventana gráfica

Metatítulo

El título de la página que muestran Google y otros motores de búsqueda en los resultados de búsqueda es el metatítulo. Un título HTML proporciona a los usuarios una visión rápida del contenido de un resultado y su relevancia para la consulta. Por lo general, es la forma básica de información que determina en qué resultado hacer clic. El uso de títulos de alta calidad en sus páginas web es muy importante para el SEO. Aquí hay un ejemplo de un metatítulo:

Mejores prácticas

• Use una etiqueta de título especial para sus páginas
• Los títulos deben ser breves y descriptivos.
• Evite el uso de títulos genéricos y vagos
• Usar título o mayúsculas y minúsculas
• No utilices click-bait, sino algo digno de hacer clic.
• Coincidir con la intención de búsqueda
• Usa 60 caracteres o menos
• Incluya palabras clave objetivo cuando sea necesario

Encontrar y corregir errores de etiquetas de título

Asegúrese de que su etiqueta de título no sea demasiado larga ni demasiado corta. Evite los títulos innecesariamente largos o prolijos y manténgalos concisos y descriptivos. Asegúrese de que cada página tenga una etiqueta de título. Evite varias etiquetas de título HTML en la página, ya que los motores de búsqueda pueden mostrar una etiqueta de título irrelevante si hay varias páginas web. Títulos duplicados en varias páginas. Es muy importante que cada una de las páginas de su sitio tenga un título único y descriptivo.

¡Prueba el SEO y el rendimiento de tu sitio en 60 segundos!

Un buen diseño del sitio web es fundamental para la participación de los visitantes y las conversiones, pero un sitio web lento o errores de rendimiento pueden hacer que incluso el sitio web mejor diseñado tenga un rendimiento inferior. Diib es una de las mejores herramientas de monitoreo de SEO y rendimiento de sitios web del mundo. Diib utiliza el poder de los grandes datos para ayudarlo a aumentar rápida y fácilmente su tráfico y clasificaciones. Como se ve en Emprendedor!

• Herramienta SEO automatizada fácil de usar
• Monitoreo de palabras clave y backlinks + ideas
• Garantiza la velocidad, la seguridad y el seguimiento de Core Vitals

• Sugiere inteligentemente ideas para mejorar el SEO
• Más de 250,000k miembros globales
• Comparación integrada y análisis de la competencia

Por ejemplo “www.diib.com”

Regístrate gratis

Utilizado por más de 250 000 empresas y organizaciones:

• 
• 
• 
• 

sincroniza con

Metadescripción

Una meta descripción proporciona una breve descripción de una página web. Los motores de búsqueda lo utilizan para mostrar una página web en los resultados de búsqueda. Informa y capta el interés de los usuarios mediante un breve y preciso resumen de los contenidos de una determinada página. Una meta descripción asegura al usuario que está en la página correcta y exactamente lo que está buscando. Sin embargo, Google no los utiliza como un factor de clasificación directo. La siguiente imagen muestra una meta descripción:

Mejores prácticas

• Escriba una descripción única y comprensible para cada página
• Proporcione un resumen preciso
• No use descripciones genéricas
• Use las palabras clave principales apropiadamente en una oración significativa
• Usar caso de oración
• No utilices clickbait, sino escribe algo que valga la pena.
• Coincide con el propósito de la búsqueda
• Usa 160 caracteres o menos

Errores comunes de meta descripción

Los errores más comunes al escribir una meta descripción son casi similares a los de las etiquetas de título. Una meta descripción demasiado larga o demasiado corta. Por lo general, no hay límite en la longitud de una meta descripción. Para adaptarse al ancho del dispositivo, los resultados de búsqueda extraídos suelen acortarse. Otro error es cuando una página web carece por completo de una meta descripción.

Asegúrese de escribirlo en su sitio. También puede tener una página con más de una meta descripción, sin embargo, esto puede confundir a los motores de búsqueda. Tener meta descripciones similares en varias páginas también es un error común. Asegúrese de que cada página tenga su propia descripción única.

Metarobots

Los meta robots permiten que el motor de búsqueda rastree páginas web y también ofrecen instrucciones sobre cómo hacerlo. La presencia de su sitio en los resultados de búsqueda puede tener un impacto negativo si no utiliza los atributos correctos en la etiqueta meta robots. Comprender esta etiqueta y usarla de manera efectiva tendrá un gran impacto en su SEO.

Los valores de índice le dicen a los bots que hagan la indexación de la página, mientras que el valor de noindex les indica a los bots que no hagan la indexación de la página. El siguiente valor indica a los bots que rastreen enlaces en la página para responder por ellos, mientras que el valor nofollow les indica que no rastreen enlaces en la página para evitar cualquier respaldo.

Mejores prácticas

Solo use las etiquetas de meta robot cuando restrinja los rastreos de Google en una página y evite bloquear páginas con etiquetas de meta robot en robots.

Errores comunes de meta robots

Algunos de los errores típicos de meta robots incluyen robots que no bloquean páginas de índice. Esto dificulta que Google vea la etiqueta de robots noindex y puede continuar indexando la URL. Un meta noindex falso reduce el tráfico orgánico de la página al impedir que Google la indexe. Rogue meta nofollow evitará que Google rastree los enlaces de la página y reducirá las posibilidades de descubrir e indexar contenido crucial. Esto también puede evitar el flujo de PageRank a páginas importantes.

Meta ventana gráfica

Una meta ventana gráfica establece el área visible de la página web y brinda instrucciones sobre cómo el navegador mostrará la página en diferentes tamaños de pantalla. Esto es importante ya que las páginas web optimizadas para dispositivos móviles se clasifican más alto en los resultados de búsqueda móviles de Google.

Mejores prácticas

Es fundamental que utilice meta viewport en todas las páginas web y con la etiqueta estándar.

Juego de caracteres meta

Esta etiqueta determina la codificación de caracteres para su página o simplemente indica al navegador cómo mostrar los caracteres y el texto en la página. Hay dos conjuntos de caracteres comunes que incluyen UTF-8 que se usa para codificar Unicode e ISO-8859-1 que se usa para codificar el alfabeto latino. La codificación con el carácter incorrecto hará que el navegador se muestre incorrectamente.

(Crédito de la imagen: aprender tutoriales web)

Los problemas de formato de caracteres dan como resultado una experiencia de usuario negativa y sus páginas pueden verse rotas. Otros problemas que puede causar incluyen menos personas que se vinculan a su página, poco tiempo de permanencia, poco tiempo en la página, alta tasa de rebote y es posible que el motor de búsqueda no entienda su contenido.

Mejores prácticas

• Utilice siempre la etiqueta meta charset en todas sus páginas web
• Utilice Unicode/UTF-8 siempre que sea posible

Es importante revisar todas sus páginas web para asegurarse de que estén utilizando la codificación UTF-8.

Redirección de actualización meta

Esta etiqueta redirige al usuario a otra URL después de un cierto período de tiempo. Google entiende y respeta las etiquetas de redireccionamiento de actualización meta, pero es mejor no usarlas en SEO. Esto se debe a que la mayoría de los navegadores no los admiten y pueden causar confusión al usuario y generar problemas de seguridad. También lleva tiempo, ya que las páginas requieren un análisis antes de que la URL de destino sea visible. Así es como se verá esa etiqueta:

(Crédito de la imagen: HostPapa)

Mejores prácticas

• Solo use etiquetas de redireccionamiento de actualización meta cuando sea necesario

Lo mejor es evitar el uso de redireccionamientos de actualización meta cuando sea posible, ya que son una mala práctica. Si los tiene en sus páginas web, puede usar redirecciones 301 o 302 en su lugar, siempre que sea posible.

Palabras clave meta

Las palabras clave meta son un buen ejemplo de etiqueta meta que se usa a menudo en estos días. No es recomendable agregar la etiqueta de palabras clave meta con una lista de palabras clave de destino ya que Google dejó de usar palabras clave para las clasificaciones. Esto se debe a que muchas personas agregaron palabras clave irrelevantes sin que los usuarios las vieran. Google ignoró la metaetiqueta de palabras clave ya que a menudo se abusaba de ella.

Bing ahora usa la metaetiqueta de palabras clave para señalar el spam, por lo que esto podría funcionar en su contra. Lo mejor es que elimine la etiqueta de su sitio.

Los metadatos son datos que proporcionan información sobre otros datos. Los metadatos HTML resumen la información básica sobre los datos, lo que facilita la búsqueda y el trabajo con esos datos en particular. Se puede crear manualmente para mayor precisión o automáticamente para ofrecer información más básica. Los datos de Mata se utilizan para archivos de documentos, imágenes, videos, hojas de cálculo y páginas web.

¿Qué es un generador de metaetiquetas?

Un generador de etiquetas meta le permite desarrollar las etiquetas meta HTML necesarias y más útiles para SEO.

Mejores prácticas al usar metadatos HTML

Declarar un tipo de documento siempre

Una declaración de tipo de documento debe ser lo primero en sus metaetiquetas HTML para SEO. Notifica al navegador sobre los estándares XHTML que se están utilizando. Es aconsejable utilizar el tipo de documento estricto XHTML 1.0, aunque algunos desarrolladores lo consideran una elección difícil. Se asegura de que su código se ajuste estrictamente a los últimos estándares.

Use etiquetas de título significativas

Las etiquetas de título permiten que la página web sea más significativa y fácil de buscar.

Usar lista descriptiva de metaetiquetas

Una lista de metaetiquetas agrega más significado a su página web para los agentes de usuario como las arañas de los motores de búsqueda. Es importante que la descripción no tenga palabras y frases repetidas ya que los motores de búsqueda lo detectarán. Use descripciones simples y directas cuando explique el propósito de su página web.

Divida su diseño en secciones principales usando divs

Al construir un diseño de sitio web, considere dividir la página web en secciones en el primer paso. Esto promoverá un código limpio y bien intencionado mientras lo ayuda a evitar confusiones y el uso excesivo de divs al escribir un marcado complejo y largo.

Evite mezclar contenido de la presentación

No mezcle su contenido HTML con la presentación visual de contenido proporcionada por CSS. Crear un archivo CSS separado para sus estilos en lugar de usar estilos en línea en su HTML es muy esencial. Esto le permitirá a usted y a otros desarrolladores que trabajan en el código realizar cambios rápidos y garantizar que su contenido sea más comprensible para los agentes de usuario.

Minificar y Unificar CSS

Los sitios web típicos tienen un archivo CSS principal y probablemente otras cosas como correcciones específicas del navegador y reinicio de CSS. Cuando cada archivo C realiza una solicitud HTTP, ralentiza los tiempos de carga del sitio web. Elimina caracteres que no son necesarios como líneas nuevas, espacios y tabuladores de todo tu código y unifica archivos que se pueden integrar entre sí. Esto puede ayudar a resolver ese problema y mejorar los tiempos de carga de tu sitio web.

Minificar, unificar y mover hacia abajo JavaScript

Evite usar JavaScript en línea, pero en su lugar, intente minimizar y unificar sus bibliotecas de JavaScript para reducir la cantidad de solicitudes HTTP necesarias para generar una de sus páginas. Sin embargo, no puede tener descargas paralelas en la mayoría de los navegadores, lo que significa que el navegador no descargará nada más mientras descarga JavaScript, lo que hace que la página parezca que se está cargando lentamente.

Para evitar esto, puede cargar su JavaScript después de cargar su CSS colocando el JavaScript al final de su documento HTML donde corresponda, preferiblemente antes de cerrar la etiqueta del cuerpo.

Usa los elementos del encabezado sabiamente

El uso de elementos h1 a h6 para indicar el orden del contenido de su HTML hace que su contenido sea más fácil de usar para agentes de usuario, motores de búsqueda y software de lectura de pantalla. Cuando use blogs, es mejor que use el elemento h1 para el título de la publicación del blog en lugar del nombre del sitio, ya que es ideal para los motores de búsqueda.

Use las etiquetas HTML correctas en el lugar correcto

Es importante que conozca las etiquetas HTML disponibles y cómo usarlas con precisión para evitar confusiones y crear una estructura de contenido relevante.

Esperamos que este artículo le haya resultado útil.

Si desea obtener más información interesante sobre el estado de su sitio, obtener recomendaciones y alertas personales, escanee su sitio web por Diib. Solo toma 60 segundos.

Ingrese su sitio web

Por ejemplo “www.diib.com”

Regístrate gratis

¡No puedo tener suficiente de DIIB! La mejor herramienta y estoy muy agradecido por encontrarla. ¡Absolutamente lo amo! Cruza los dedos para que no subas los precios porque esto es tan perfecto.

katarina calibre
Director de Operaciones en ahoymatey.com.au

Evite el uso excesivo de divs

Algunos desarrolladores envuelven etiquetas div en otras etiquetas div que tienen más etiquetas div creando numerosos divs. El div se considera un elemento sin sentido que solo debe usarse cuando no hay otros elementos adecuados disponibles de acuerdo con las especificaciones HTML del W3C. Evita tener muchos divs usándolos responsablemente y solo cuando sea necesario.

Use una lista desordenada para la navegación

El elemento de navegación es un factor muy esencial en el diseño de sitios web cuando se combina con CSS. Ayuda a que sus menús de navegación sean semánticos y hermosos. Aquí hay dos maneras de hacer esto:

(Crédito de la imagen: Studytonight)

Cierra tus etiquetas

Las especificaciones W3C requieren que cierre todas sus etiquetas. Es posible que otros navegadores muestren correctamente sus páginas aunque no cerrar sus etiquetas no sea válido según los estándares normales.

Usar marcado en minúsculas

Mantener el marcado en minúsculas es una práctica estándar en la industria. El uso de mayúsculas en el marcado afecta la legibilidad de su código, pero no cambia la visualización de sus páginas web.

Usar correcciones modulares de IE

Si tiene problemas con sus páginas, puede usar comentarios condicionales para enfocarse en Internet Explorer. Asegúrese de hacer que las correcciones sean modulares para garantizar que su trabajo esté preparado para el futuro, de modo que la versión anterior de IE no requiera ningún soporte.

Valida tu código

No debe ver la validación como la evaluación final del buen trabajo frente al mal trabajo. Un trabajo que valida no es necesariamente un buen código y, alternativamente, un trabajo que no valida completamente no es necesariamente un código malo.

Puede utilizar los servicios de validación automática como depuradores útiles para identificar errores de representación. Valide su trabajo con frecuencia cuando escriba HTML para evitar problemas que pueden ser difíciles de identificar una vez que haya completado su trabajo.

Escribir código con formato coherente

Escribir un código base limpio y bien intencionado resalta su profesionalismo y hace que sea más fácil para los desarrolladores que pueden trabajar en su código. También aumentará la legibilidad de su trabajo cuando escriba un marcado correctamente sangrado desde el principio. Por ejemplo:

(Crédito de la imagen: html.com)

Evite los comentarios excesivos

El propósito de documentar su código es hacerlo comprensible y comentar su código es razonable y lógico para lenguajes de programación como Java, PHP y C#. Sin embargo, el marcado se explica por sí mismo y no necesita comentar cada línea en XHTML/HTML. Revisar la semántica de su trabajo lo ayudará si está comentando mucho en su HTML para explicar el proceso.

Diib: ¡Obtenga sus estadísticas de metadatos HTML aquí!

Usar estos elementos y seguir las pautas lo ayudará en sus esfuerzos de SEO.

Elementos como una buena meta descripción aumentarán las tasas de clics de las búsquedas aunque no mejoren su clasificación. Las metaetiquetas ahora se utilizan en plataformas de redes sociales como Twitter y Facebook. Puede usar etiquetas para verificar cómo se comparten sus datos en Facebook. Asociarse con Diib Digital le brindará las métricas vitales con respecto a sus metadatos para que pueda tomar decisiones efectivas sobre el estado de su sitio web.

Estas son algunas de las características de nuestro panel de usuario que estamos seguros de que te encantarán:

• Objetivos personalizados diseñados para mejorar el rendimiento del sitio web
• Alertas que le informan sobre su autoridad de dominio, otros problemas técnicos de SEO
• Páginas rotas donde tienes backlinks (verificador 404)
• Herramientas de monitoreo y seguimiento de palabras clave, backlinks e indexación
• Experiencia de usuario y optimización de la velocidad móvil
• Optimización del título de la imagen

Haga clic aquí para obtener su escaneo gratuito o simplemente llame al 800-303-3510 para hablar con uno de nuestros expertos en crecimiento.