El contenido de las páginas web se define a través del llamado lenguaje HTML, y éste consiste en una serie de etiquetas de marcado. Aquí te explicamos qué es HTML y las etiquetas HTML más importantes que debes conocer para SEO. Aprende a utilizarlas correctamente siguiendo nuestros consejos de buenas prácticas.
Pero primero, empecemos por mirar la definición HTML.
Tabla de contenidos
¿Qué es el HTML?
El código HTML es el lenguaje utilizado para definir el contenido de los sitios web. Consiste en una serie de etiquetas que definen tanto el texto como los demás elementos de la página (imágenes, vídeos, etc.).
Hay que tener en cuenta que el HTML no es un lenguaje de programación, sino marcas de hipertexto (Hypertext Markup Language, de ahí las iniciales HTML). Está escrito completamente a través de etiquetas, contenido y atributos.
Etiquetas HTML importantes para SEO
Las etiquetas más importantes para la optimización de los motores de búsqueda son las siguientes:
Title tag
Esta etiqueta se utiliza para configurar el titular en azul en las páginas de resultados de los motores de búsqueda. Aunque el título que aparecerá depende en última instancia de Google, el bot comprueba esta etiqueta primero, y en la mayoría de los casos, la convierte en el título principal.
La recomendación es incluir en los resultados de la búsqueda las palabras clave para las que se quiere clasificar y hacer que el título sea tan llamativo que los usuarios no puedan resistirse a entrar en la página.
Tengan en cuenta que Google sólo muestra los primeros 50-60 caracteres. Por lo tanto, debes optimizar la etiqueta del título para que no exceda la longitud o contenga la información más relevante en esa primera parte. También es esencial ser creativo y escribir títulos originales.
Etiqueta de descripción de la meta
Puede utilizar etiquetas de meta descripción para crear una descripción dentro del fragmento que aparece en los resultados de la búsqueda. La verdad es que Google no siempre utiliza la meta descripción para crear estos fragmentos, pero si usted los usa, aumentará las posibilidades de obtener el texto deseado en las SERP.
A veces, Google muestra un trozo de texto de la página porque considera que coincide mejor con una consulta. Aunque no hay reglas estrictas para la meta descripción, en general, hay que pensar que el motor de búsqueda sólo muestra 150-160 caracteres. Es crucial poner la información más relevante y interesante para su público objetivo en ella.
Texto alternativo de la imagen
El texto alternativo de la imagen permite a los usuarios comprender mejor el contenido de la misma, especialmente para aquellos con discapacidad visual. También es vital permitir que los robots de los motores de búsqueda identifiquen la imagen ya que no pueden verla.
En algún momento, puede incluso haber un problema técnico que impida que la imagen se muestre, en cuyo caso el texto alternativo debe describir lo que contiene.
Un excelente texto alternativo será breve pero descriptivo. Debe contener el mínimo de palabras necesarias para aclarar de qué trata la imagen. Sin embargo, no debe ser demasiado conciso, ya que es difícil describir correctamente una imagen con sólo una o dos palabras.
Y, por supuesto, no debería usar las etiquetas de texto alternativas para hacer un relleno de palabras clave, ya que esta es una práctica que ya no funciona para el SEO.
<a> element
The HTML <a> element, also called the anchor element, creates links to other web pages, files, or locations within the same page, email addresses, or any different URL. In SEO, it is fundamental to work on the internal links apart from having good quality backlinks.
The hyperlink created by an anchor element is applied to a text, image, or other HTML content placed between the opening and closing <a> tags. Considering that the search engines cannot see the images, it is advisable to link the URLs with text instead of pictures. This leads us to talk about anchor text optimization.
El texto de anclaje son las palabras visibles sobre las que se puede hacer clic en un hipervínculo HTML. Este texto debe informar al usuario (y al buscador) sobre el contenido de la página enlazada. Una buena práctica es incluir palabras clave relevantes en el texto de anclaje para dar a Google más pistas sobre el tema de la página.
On the other hand, by adding the right attributes in the <a> element, you can optimize your crawl budget. To this end, you can use the rel=nofollow. This attribute is used to tell search engines to ignore the link and not pass authority to nofollow links. This practice is especially beneficial when linking to external sites, although Google stated that it only works as a hint and it does not prevent GoogleBot from crawling the linked page. The Nofollow Update began on March 1st, 2020.
Ejemplo de código:
<a href="https://www.fandangoseo.com" rel="nofollow">SEO Crawler</a>
Schema marcado
Son una serie de etiquetas desarrolladas conjuntamente por Google, Yahoo!, Bing y Yandex para dar información adicional a los motores de búsqueda sobre diferentes tipos de páginas. Los motores de búsqueda las utilizan para mejorar la información proporcionada en la página de resultados de búsqueda con los fragmentos enriquecidos (Rich Snippets en inglés).
Estas etiquetas no garantizan la indexación en las SERP, pero ciertamente hace que los recortes sean mucho más atractivos, mejorando así su CTR orgánico.
Por lo tanto, le sugerimos que visite schema.org para ver si hay etiquetas aplicables a los tipos de páginas que quiere resaltar en los resultados de la búsqueda.
Etiqueta Meta robots
La etiqueta de los meta robots influye en la forma en que el motor de búsqueda interactúa en un sitio web. Aquí es donde los dueños de los sitios pueden dar directivas a los bots para que rastreen e indexen sus páginas de una manera particular. Las etiquetas más utilizadas son follow, nofollow, index, noindex.
Algunas de estas reglas son "obligatorias" y otras son sólo sugerencias. No todos los rastreadores respetan las etiquetas de los meta robots, pero los motores de búsqueda suelen hacerlo. Además, si no añade ninguna directiva, el crawler actuará libremente. Esto, entre otras cosas, complicará un buen uso de su presupuesto para rastreo.
Es esencial colocar la etiqueta de los meta robots en la sección de encabezado del código de la página, indicando las instrucciones que deben aplicarse.
Etiqueta canónica
La etiqueta canónica ayuda a evitar problemas de contenido duplicado. Cualquier página puede tener múltiples URLs, incluso cuando el dueño del sitio no tiene la intención de hacerlo.
Google no penaliza directamente por ello, pero afecta al rendimiento de la página SEO . Al tener contenido muy similar en varias URL, los motores de búsqueda tienen dificultades para gastar su presupuesto de rastreo y asignar la autoridad de página adecuada.
Por lo tanto, debe colocar la etiqueta canónica en las siguientes páginas:
- Los que tienen un contenido muy similar
- Páginas a las que se puede acceder a través de diferentes URLs
- Páginas dinámicas que crean sus parámetros de URL
De H1 a H6
Estas etiquetas indican diferentes niveles de títulos, que van del 1 al 6, tanto para el lector como para el motor de búsqueda. Permiten destacar la importancia de los títulos dentro del texto y estructurar su contenido.
Cuando se trata del lector, casi nadie lee ya un artículo completo, sino que busca directamente la sección para encontrar la información exacta que busca. Y las etiquetas de encabezado son una gran ayuda en este sentido.
Es aconsejable dividir el artículo en pequeñas secciones y mantener un formato coherente. Tampoco se debe usar más de un encabezado H1 porque es el que el buscador trata como título principal.
Por lo general, la estructura de un artículo no debe ser demasiado profunda; de hecho, rara vez es necesario ir más allá del H3. Por último, vale la pena formular encabezamientos similares a las consultas, para que los usuarios entiendan que encontrarán la respuesta a la pregunta que figura a continuación.
Etiquetas de Open Graph
Las etiquetas de Open Graph permiten a las redes sociales conocer los principales elementos a mostrar cuando se comparte un artículo externo en ellas.
Se añaden a las redes sociales (Facebook, Twitter y LinkedIn) y a las aplicaciones de mensajería populares (WhatsApp, Telegram y Slack).
En este caso, siempre es necesario añadir al menos las siguientes propiedades de Open Graph:
- og:url
- og:title (55-60 caracteres)
- og:description (60-65 caracteres)
- og:image (al menos 1200 x 630 píxeles, y un máximo de 8 MB)
Y es importante asegurarse de que el título y la descripción en las redes sociales coincidan con el contenido.
Dominios Anchor Text