Una guía completa de metaetiquetas en SEO
Publicado: 2021-09-27Las metaetiquetas son uno de los aspectos clave del SEO y su uso correcto puede tener un gran impacto en la clasificación.
Pero, no todas las metaetiquetas son importantes para el SEO. Es por eso que he cubierto todas las metaetiquetas importantes en las que todo blogger y SEO debería centrarse.
Desempeña un papel crucial en la estrategia de SEO. No puede confiar en una sola cosa como la construcción de enlaces o escribir mejor contenido . Tienes que auditar adecuadamente tu parte técnica de SEO y la etiqueta Meta es una de ellas.
¿Qué son las metaetiquetas?
Las etiquetas meta son códigos HTML que brindan más información sobre su sitio web tanto a los motores de búsqueda como a los navegadores.
Instruye a los motores de búsqueda sobre cómo mostrar contenido en las páginas de resultados de búsqueda y ayuda a los navegadores a mostrar el contenido correctamente a los visitantes.
Estas etiquetas solo son visibles en códigos HTML y no se muestran a los visitantes habituales.
Entonces, veamos cuáles son los usos de cada metaetiqueta y cuáles son los beneficios de SEO de la misma. Al final, le mostraré cómo puede usarlos correctamente en su sitio web, ya sea en Blogger o Wordpress.
Si eres un aprendiz visual, puedes ver el video a continuación sobre Metaetiquetas para SEO.
1. Etiquetas de título HTML
Las etiquetas de título son la parte más importante de una página web y se utilizan como un título en el que se puede hacer clic en las SERP y también se muestran en los sitios de redes sociales cuando se comparte el enlace.
Generalmente se usa en la parte superior de una página web debajo de la etiqueta <head> y brinda una idea clara y completa de lo que trata la página.

Aquí, en la imagen de arriba, he señalado la etiqueta de título que se muestra en Google.
Entonces, la etiqueta de título en HTML de esta página se verá así.
<title>key2blogging | Learn Blogging and SEO tips</title>
NOTA AL MARGEN . Google no siempre muestra la etiqueta del título. A veces lo modifica si no es adecuado para los visitantes.
Las etiquetas de título son oficialmente un factor de clasificación, ya que un título bien escrito lo ayuda a obtener más clics de los resultados de búsqueda.
De hecho, Google comprenderá mejor el tema incluso si la palabra clave de enfoque no está presente en la etiqueta del título. Pero es una buena práctica incluir la palabra clave de enfoque al comienzo del título.
Según Hubspot , un título no debe tener más de 60 caracteres, ya que el resto estará oculto y no será visible para los usuarios. Pero hay algunas excepciones.
¿Cómo agregar una etiqueta de título a su página?
Puede agregar la etiqueta de título justo debajo de la etiqueta <head> de la página.
Si utiliza Blogger , el título de la publicación se establece de forma predeterminada como la etiqueta de título de la página. Y si está utilizando Wordpress, puede usar complementos de SEO como RankMath , Yoast SEO , etc. para agregar etiquetas de título.

Aquí, configuré el título de la publicación y el nombre del sitio como la etiqueta de título de la página.
Mejores prácticas
- Utilice una etiqueta de título única en cada página que describa el contenido de forma breve y precisa.
- Mantenga la longitud del título por debajo de los 60 caracteres.
- Use la palabra clave de enfoque al principio (si es posible)
- No utilice varias etiquetas de título en una página.
- Usa el nombre de tu marca en el título aunque esté oculto en las SERP. todavía ayudará en SEO.
Lea también: 7 técnicas de redacción de contenido para una mejor clasificación.
2. Meta descripción
La Meta Descripción es un elemento HTML que resume tu página web. Los motores de búsqueda generalmente muestran la meta descripción en los resultados de búsqueda debajo de su etiqueta de título.
La meta descripción ocupa una porción más grande en las SERP y brinda a los buscadores la confianza de que encontrarán la solución después de hacer clic en el enlace.
Una buena descripción lo ayuda a obtener más clics de la página de búsqueda y mejora el CTR (tasa de clics) y reduce la tasa de rebote si el contenido ofrece lo que prometió en la descripción.
Mantenga sus palabras clave en la meta descripción y ayudará en los SERP. Cuando un usuario busca una palabra clave en Google y la misma palabra clave está presente en su descripción, el motor de búsqueda pondrá en negrita esa palabra que afecta el CTR.
En HTML, la meta descripción se verá así.
<meta name="description" content="Here is a precise description of my awesome webpage.">
¿Cómo agregar meta descripciones a tu página?
Hay bastantes formas de agregar meta descripciones a una página web. Si está utilizando cualquier sitio web HTML, puede colocar el fragmento de código debajo de la etiqueta <head>.
Si está utilizando Blogger, puede ver la opción en el lado derecho del editor de publicaciones.

Aquí, puede escribir una descripción de 150 caracteres de largo. Y si está utilizando Wordpress, puede agregar una meta descripción haciendo clic en la configuración de rankmath y haciendo clic en editar fragmento.

Aquí, puede ver la opción para agregar una descripción debajo de la configuración del enlace permanente. Siga las mejores prácticas para las descripciones.
Mejores prácticas
- Escriba una descripción única para cada publicación y página.
- Mantenga la descripción alrededor de 150 a 160 caracteres (incluidos los espacios)
- Evite las descripciones genéricas
- Coincidir con la intención de búsqueda
- Use sus palabras clave de enfoque en la descripción
- Escribe descripciones dignas de hacer clic, no clickbait
3. Meta ventana gráfica
Meta Viewport le indica al navegador que muestre el área de la ventana gráfica correctamente en diferentes tamaños de dispositivos. La ventana gráfica es el área visible del documento HTML.
Esta etiqueta ayuda al navegador a mostrar la página correctamente en diferentes dispositivos.
Las etiquetas meta viewport ayudan a los motores de búsqueda a comprender si la página es compatible con dispositivos móviles o no. Por lo tanto, tener esta etiqueta en su sitio web ayuda a una mejor clasificación en los resultados de búsqueda móvil.
La sintaxis de esta etiqueta se ve así.
<meta name="viewport" content="width=device-width", initial-scale=1">
Solo necesita agregar esta etiqueta debajo de la etiqueta <head> de cada página y no necesita cambiar nada en este código.
Si está utilizando wordpress, esto se agregará de manera predeterminada y si está utilizando un tema personalizado, asegúrese de verificar si esta etiqueta se usa o no.
También puede agregarle elementos adicionales, como configurar el nivel de zoom máximo y mínimo de la pantalla, etc.
<meta content='width=device-width, initial-scale=1, user-scalable=1, minimum-scale=1, maximum-scale=5' name='viewport'/>
Puede verificar su sitio web en la herramienta de prueba de compatibilidad con dispositivos móviles de Google , ya sea que sea compatible con dispositivos móviles o no.

Si la ventana gráfica no está configurada en su sitio web, mostrará un error como este.

Si no está viendo este error, entonces está listo para comenzar.
4. Meta juego de caracteres
La etiqueta Meta charset brinda información sobre la codificación HTML utilizada en un sitio web. Le dice al navegador cómo se debe mostrar el texto en su página web.
Se utilizan muchos códigos de caracteres en los sitios web, pero los más populares son
- UTF-8 — Codificación de caracteres para Unicode;
- ISO-8859–1 — Codificación de caracteres para el alfabeto latino.
- ASCII — primer estándar de codificación de caracteres
Las etiquetas meta del juego de caracteres se ven así. (Para HTML 5)
<meta charset='UTF-8'/>
Si está utilizando HTML 4 o inferior, debe agregar las metaetiquetas como esta.
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

Todas las plataformas CMS modernas, como Wordpress, Blogger, etc., utilizan HTML 5 ahora. Por lo tanto, debe verificar si el primer código meta se agrega a su código HTML o no.
5. Metapalabras clave
En la etiqueta de palabras clave meta , puede agregar las palabras clave importantes de su sitio web.
Aunque Google no está considerando esto siempre, es útil para los nuevos sitios web.
<meta name="keywords" content="HTML, CSS, JavaScript, Blogging, SEO">
Aquí, en el campo de contenido, debe agregar las palabras clave importantes de su sitio web. Después de eso, pegue este fragmento de código debajo de la etiqueta principal.
6. Metaautores
El atributo author especifica el autor de la página web.
Por lo tanto, use esta metaetiqueta para informar a los motores de búsqueda sobre el autor del contenido. Ayuda en EAT (Experiencia, autoridad y confiabilidad).
<meta name="author" content="Abhishek Padhi">
Aquí, en el campo de contenido, debe agregar el nombre del autor.
7. Etiqueta canónica
Una etiqueta canónica (también conocida como "rel canonical") ayuda a los motores de búsqueda a comprender la copia maestra de una página web.
Se puede acceder a una página web desde múltiples URL como HTTP, HTTPS, con www o sin www. Por lo tanto, el uso de la etiqueta canónica evita los problemas causados por contenido idéntico o "duplicado" que aparece en varias URL.
<link rel="canonical" href="http://example.com/" />
8. Etiqueta de encabezado (h1, h2, h3, etc.)
Las etiquetas de encabezado son importantes para el SEO. Le ayuda a estructurar correctamente el contenido y ayuda a los motores de búsqueda a comprender el contenido.
De hecho, la implementación correcta de estas etiquetas de encabezado puede ayudarlo a clasificarse mejor en los SERP. (páginas de resultados del motor de búsqueda). También mejora la experiencia del usuario y la facilidad de lectura.
Por lo tanto, siempre estructura correctamente el contenido. Entonces, aquí, de manera predeterminada, el título de la publicación actúa como una etiqueta h1 y usamos etiquetas h2 y h3 en el contenido. Siempre incluya sus palabras clave de enfoque en la etiqueta del encabezado.
9. Metaetiqueta Robots
Las etiquetas meta de robots se utilizan para indicar a los motores de búsqueda si deben indexar esa página o no. Por lo tanto, puede usar esta etiqueta para no indexar ciertas páginas fácilmente.
Sin embargo, estas etiquetas no se utilizan mucho, ya que existe una forma más avanzada de páginas sin índice, como el archivo robots.txt.
<meta name="robots" content="noindex, nofollow" />
Aquí el primer atributo es "nombre" y el valor es "robots" y el segundo atributo es "contenido" y aquí puede establecer diferentes valores.
- Noindex : le dice a un motor de búsqueda que no indexe una página.
- Índice : Esto le dice al motor de búsqueda que indexe una página. (No es necesario usarlo ya que es el predeterminado)
- Seguir : Incluso si la página no está indexada, el rastreador debe seguir todos los enlaces en una página y pasar equidad a las páginas enlazadas.
- Nofollow : le dice a un rastreador que no siga ningún enlace en una página ni transmita ningún valor de enlace.
- Noimageindex : Esto le dice a un rastreador que no indexe ninguna imagen en una página.
- Ninguno : equivalente a usar las etiquetas noindex y nofollow simultáneamente.
- Noarchive : los motores de búsqueda no deben mostrar un enlace en caché a esta página en un SERP.
- Nocache : Igual que noarchive, pero solo lo usan Internet Explorer y Firefox.
- Nosnippet : le dice a un motor de búsqueda que no muestre un fragmento de esta página (es decir, una meta descripción) de esta página en un SERP.
- Unavailable_after : los motores de búsqueda ya no deberían indexar esta página después de una fecha determinada.
Por lo tanto, puede usar varios valores en el atributo de contenido separados por comas.
Pero, si está utilizando Wordpress, puede no indexar fácilmente una página utilizando un complemento de SEO como Rank Math SEO, Yoast SEO, etc.
Si está utilizando Blogger, también puede hacer lo mismo con el editor de publicaciones.
10. Texto alternativo
Una etiqueta alt es un texto alternativo que se muestra en el navegador cuando la imagen no está disponible o tiene un error de descarga. También ayuda a los motores de búsqueda a comprender mejor la imagen utilizada en una página web.
entonces, cuando cargue una imagen en un sitio web, los códigos se verán así.
<img src="Mountain.jpg" alt="Photo of a mountain" width="500" height="600">
Entonces, aquí en el campo src, se agrega la URL de la imagen y en el campo alt, debe agregar el texto alternativo que explica la imagen.
Pero, en la mayoría de las plataformas CMS, no necesita editar el código. Puede agregar fácilmente esta etiqueta seleccionando la imagen y luego haciendo clic en el icono de configuración.
11. Meta actualización
La etiqueta Meta Refresh se utiliza para actualizar el contenido en un intervalo determinado. Entonces, el navegador seguirá las instrucciones dadas en esta etiqueta.
<meta http-equiv="refresh" content="30">
Aquí, en el ejemplo anterior, hemos establecido 30 segundos. Esta etiqueta es útil cuando está ejecutando un sitio web donde el contenido debe actualizarse después de ciertos intervalos, como actualizaciones de noticias, actualizaciones de puntaje, etc.
12. Meta colores
Esta metaetiqueta se usa para mostrar diferentes colores en la barra de URL cuando el sitio web se abre en dispositivos móviles.
<meta content='#162536' name='theme-color'/>
Aquí, en el campo "contenido", debe agregar el código de color que desea mostrar en la barra de URL.
Nota : debe usar todas las metaetiquetas debajo de la etiqueta <head>.
Conclusión
Espero que haya entendido qué son las metaetiquetas y cómo puede usarlas en su sitio web para un mejor SEO.
Si tienes alguna duda al respecto, no dudes en preguntarme en la sección de comentarios.

Únase a la comunidad Key2Blogging
Aquí, obtendrá las últimas noticias de SEO, consejos y trucos para blogs y ofertas ocasionales.