Guía: Optimización SEO de páginas PDP y PLP
Optimiza las principales páginas de tu eCommerce
El comercio electrónico, o eCommerce, crece año a año a pasos agigantados en todo el mundo. Cada vez son más los negocios de todo tipo de sectores que se suman a la ola digital, especialmente a raíz del “boom” vivido por el comercio electrónico a consecuencia de la pandemia del coronavirus. Lo cierto es que, aunque sin duda la pandemia tuvo mucho que ver en el desarrollo del comercio electrónico, los expertos apuntan que las condiciones para este crecimiento ya existían previamente y solo necesitaba un impulso para producirse.
Sea como fuere, de la mano del desarrollo del eCommerce aparecen nuevos términos fundamentales para entender cómo funciona. En esta guía hablaremos de los factores que se deben de tener en cuenta a la hora de optimizar dos de los elementos más importantes de un eCommerce: PDP y PLP.
Tabla de contenidos
¿Qué son las PDP y las PLP?
Una PDP, o “Product Detail Page”, es una página que proporciona información detallada sobre un producto y permite a los clientes seleccionar opciones si las hubiera (tamaño, estilo, color…). Las PDP son esencialmente la columna vertebral de los sitios de comercio electrónico y en ellas los clientes deben encontrar toda la información que un cliente necesita para tomar una decisión de compra.
Por su parte, las PLP o “Product Listing Page” son aquellas páginas que presentan una lista de productos que responden a un mismo criterio de búsqueda o clasificación. Una PLP suele disponer también de una categorización que permiten ordenar los resultados en función de diferentes criterios y suelen incluir filtros con los que acotar el número de resultados en función de nuestros criterios de búsqueda: precio, marca, disponibilidad, color, talla…
Una vez sabemos en qué consiste cada uno de estos términos, veamos algunos de los elementos y características que se deberán de considerar para optimizar este tipo de páginas tanto desde el punto de vista del posicionamiento orgánico en buscadores (SEO) como de la experiencia de usuario.
Estructura de URL optimizada con funcionalidad de “deep linking”
Contar con un buen diseño de URLs puede ayudar a Google y otros motores de búsqueda a encontrar y categorizar páginas web de manera más eficiente, así como a mejorar la experiencia de usuario. Utilizar estructuras claras, lógicas y respetando las jerarquías internas del sitio web, facilitará la navegación por nuestro sitio web y ayudará a comprender su organización.
Un dilema habitual en los sitios de eCommerce se produce a la hora de estructurar las URLs cuando los productos vienen en múltiples variantes, como el color o la capacidad. Para estos casos Google admite una amplia gama de estructuras de URL. Si decides utilizar una única URL que englobe las diferentes variantes de producto, deberás de tener en cuenta ciertas limitaciones con respecto a los resultados enriquecidos en SERP y en Google Shopping.
La opción más recomendada será optar por una URL diferenciada por cada variante de producto apuntando a cada una de las opciones en las que está disponible. Aquí es dónde hablamos de “deep links”, que son aquellos que llevan al usuario directamente a un contenido concreto, mejorando la experiencia del usuario y la indexación de los contenidos por los motores de búsqueda. Para estas situaciones Google recomienda dos posibles opciones: utilizar segmentos de URL (como «/t-shirt/green») o utilizar parámetros de URL (como «/t-shirt?color=green»).
Además, todo parece indicar que Google y Meta se centran en el esquema de producto individual y buscan un futuro en el que las plataformas y aplicaciones tengan la capacidad de servir URL designadas para cada variante de producto específica.
Recomendaciones
- Utiliza URLs amigables, es decir, fáciles de leer por usuarios y buscadores.
- Utiliza siempre letras minúsculas en tus URLs.
- Utiliza guiones para separar las palabras de una URL.
- Estructura tus URLs siguiendo una organización y jerarquía lógicas.
- Incluye palabras clave en tus URL siempre y cuando tengan relación con el contenido de la página.
- Para diferentes variantes de producto con distintas URLs, utiliza segmentos o parámetros.
- Para URLs con parámetros, utiliza “?key=value”en lugar de “?value”, siempre que sea posible.
Canonicalización de la URL
En el SEO, canonicalizar significa indicar a los motores de búsqueda cuál es la versión de URL preferida para la indexación y se seguirá en la mayoría de los casos cuando se implemente correctamente en una página equivalente.
La canonicalización es un método utilizado para ayudar a prevenir problemas de contenido duplicado y administrar la indexación de URL en los motores de búsqueda, y pueden ser autorreferenciales (donde una etiqueta canónica apunta a la propia URL de una página) o pueden hacer referencia a la URL de otra página para consolidar las señales de enlaces de páginas similares o duplicadas.
Cuando los productos cuentan con múltiples variantes con URLs distintas, para ayudar a Google a comprender qué variante es mejor mostrar en SERP, elige la URL de una de las variantes del producto como canónica para el producto. Si se utilizan parámetros para identificar las variantes, se recomienda utilizar la URL sin el parámetro de consulta como URL canónica para ayudar a Google a comprender mejor la relación entre las diferentes variantes.
Recomendaciones
- Define únicamente una canónica por página
- Incluye las canónicas en tu sitemap.
- Especifica el protocolo correcto (http, https…)
- Especifica si la URL incluye o no el carácter “/” al final de la misma.
- Utiliza URLs absolutas, es decir, con la dirección completa.
- Para páginas con una única variante, utiliza canónicas autorreferenciales.
- Para distintas URLs con parámetros para diferentes variantes de producto, utiliza la URL sin parámetro como URL canónica.
Metadatos optimizados: el título, la meta-descripción y la etiqueta H1
Los metadatos ofrecen detalles sobre nuestras páginas a los motores de búsqueda y a los usuarios que encuentran nuestro sitio en los resultados de búsqueda. Se pueden optimizar para resaltar los elementos más importantes del contenido de la página y hacer que se destaque en los resultados de búsqueda frente a los competidores, lo que aumenta la posibilidad de atraer visitantes y, de este modo, potencialmente aumentar las conversiones.
Los motores de búsqueda valoran cada vez más una buena experiencia de usuario y eso incluye asegurarse de satisfacer la intención de la búsqueda del usuario lo mejor posible. Los metadatos ayudan con esto al asegurarse de que la información que los usuarios necesitan saber sobre nuestro sitio sea mostrada.
Veamos cuales son las metaetiquetas más importantes y lo que pueden hacer por tu sitio y tu SEO:
- Título: Cruciales para la clasificación en los resultados orgánicos, ya que los motores de búsqueda los utilizan para identificar el tema de la página y clasificarla. También son esenciales para determinar si los usuarios harán clic en un resultado particular en el SERP.
- Meta-descripción: A pesar de que no son un factor de clasificación, una meta descripción más atractiva para los usuarios aumentará las posibilidades de que lleguen a nuestra página. Google sí considera indirectamente la tasa de clics (o CTR) en sus rankings, por lo que, si más usuarios hacen clic en un resultado, Google lo considerará como un resultado relevante y se reflejará en las clasificaciones.
- H1: Debe ser la etiqueta visible más destacada de la página y debe describir de qué se trata el contenido. Cada página debe usar solo una etiqueta H1, ya que usar más de una podría diluir la eficacia de un buen H1 y, además, Google podría considerar que la página está sobre-optimizada y penalizarla. Una forma de reforzar la relevancia de la página de un producto es hacer coincidir parcialmente la etiqueta del título con el H1: deben estar relacionados conceptualmente, pero no ser lo mismo.
Recomendaciones
- Utiliza metadatos únicos, claros y descriptivos.
- Incluye palabras clave relevantes en tus metadatos.
- El título no debe sobrepasar los 50-60 caracteres (hasta 600 píxeles).
- La descripción no debe sobrepasar los 155-160 caracteres (hasta 920 píxeles).
- Incluye una “llamada a la acción” (CTA) en la descripción.
- Utiliza una única etiqueta H1.
- El H1 no debe sobrepasar los 60 caracteres y es recomendable que se relacione temáticamente con el título sin ser igual a este.
Los “Breadcrumbs” (o migas de pan)
Los breadcrumbs son elementos de navegación del sitio web que se utilizan para crear una mejor experiencia de usuario y mejorar la capacidad de rastreo. Básicamente son enlaces internos de sitios web que permiten a los usuarios rastrear dónde se encuentran en un sitio web y qué tan lejos están de la página de inicio, pero también ayudan a Google a navegar, categorizar el sitio contextualizando el contenido y estableciendo relaciones jerárquicas entre las diferentes áreas de productos y páginas. Además, también pueden ayudar a reducir la tasa de rebote.
Se recomienda añadir marcado de datos estructurados a través de un esquema en formato JSON-LD. Google utiliza este marcado para categorizar la información de la página y usar esto para mejorar nuestro resultado de búsqueda en el SERP, pudiendo incorporar este rastro en los resultados de búsqueda mediante fragmentos enriquecidos o “rich snippets”, lo que ayuda a mejorar el CTR.
Recomendaciones
- Deben estar presentes en todas las páginas.
- Deben ser fáciles de ver, pero discretos.
- Deben mostrar el camino desde la página de inicio hasta la página actual.
- Use el símbolo «>» para separar los hipervínculos en las rutas.
- Deben estar ubicados en la parte superior de la página (justo encima del H1).
- Deben estar visibles también en la versión móvil de la página (con los cambios necesarios para que sean compatibles con dispositivos).
- Deben poder rastrearse sin JavaScript.
- Añade marcado de datos estructurados.
Las etiquetas “Open Graph” y las tarjetas de Twitter
Las metaetiquetas Open Graph (OG) son fragmentos de código que controlan cómo se muestran las URL cuando se comparten en las redes sociales; permitiendo elegir la imagen, el título y la descripción que se mostrarán cuando un usuario comparta un contenido. Se pueden encontrar en la sección <head> de la página con la etiqueta «og:» antes del nombre de la propiedad.
Se trata, por tanto, de un conjunto de etiquetas que proporcionan información estructurada sobre el contenido de una página particular y que son leídas por la mayoría de las redes sociales (algunas como Instagram o TikTok actualmente las ignoran y sus usuarios únicamente pueden compartir enlaces sin una tarjeta), que ayudan a aumentar el CTR haciendo que el contenido sea más visto y compartido.
Probablemente la etiqueta OG más importante sea la imagen OG («og:image»), ya que los contenidos visuales son los más atractivos en las redes sociales. La imagen OG debe brindar a las personas en las redes sociales una vista previa de lo que verán si hacen clic en el enlace. Una buena imagen de OG es relevante para el contenido de la página, y debe ser atractiva para captar la atención de los usuarios y también debe de llevar el logo de la marca para asociarla a la misma.
Las etiquetas de los mapas de Twitter son similares a las etiquetas de Open Graph y se basan en las mismas convenciones que estas. Cuando el procesador de la tarjeta Twitter busca etiquetas en una página, primero comprueba y asegura la propiedad específica de Twitter y, si está ausente, vuelve a la propiedad Open Graph soportada. Twitter, además, tiene su propia herramienta de validación: Twitter Card Validator.
Recomendaciones
- Utilízalas en todas las páginas “compartibles” en redes sociales.
- Asegúrate de que al menos todas las propiedades OG requeridas estén definidas (pero idealmente también las recomendadas).
- La etiqueta “og:title” debe estar por debajo de los 55-60 caracteres.
- La etiqueta «og: description» debe estar por debajo de los 60-65 caracteres.
- Utiliza la URL canónica para la etiqueta «og:url».
- Utiliza imágenes de alta calidad para la etiqueta “og:image” (al menos 1200 x 630 píxeles), manteniendo el tamaño del archivo por debajo de los 8 MB.
- Valida la implementación de OG con un verificador para obtener una vista previa del fragmento y asegurarse de que se completen todos los datos.
FAQ (o Preguntas Frecuentes) específicas para cada página
Las FAQs (del inglés “Frequent Asked Questions”) son páginas o secciones de páginas en la que se incluyen las preguntas más frecuentes de los usuarios y se proporcionan respuestas.
Contar con este tipo de contenido mejora la experiencia de los usuarios y, además, puede también ayudar al posicionamiento SEO. Aunque estas no son un factor de posicionamiento en sí mismas, las FAQs te permiten incluir palabras clave a las que apunta tu negocio de manera natural, así como añadir enlaces internos a otras páginas de tu sitio web o enlaces externos que complementen la información ofrecida. Además, las FAQs reducen el “bounce rate”, de modo que los usuarios tienden a permanecer más tiempo en la página y esto sí influye directamente para el SEO.
También se recomienda añadir datos estructurados a través de un esquema JSON-LD, formato recomendado por Google. Al usar un marcado, mejoramos las posibilidades de tener nuestras preguntas frecuentes en los fragmentos destacados en el SERP de Google, lo que puede generar un aumento en el CTR y, en consecuencia, un aumento del tráfico. Aquí tienes un ejemplo:
Recomendaciones
- El objetivo fundamental de las FAQs debe ser mejorar la experiencia de usuario, buscando dar respuestas a las preguntas más habituales que se puedan hacer sobre nuestros productos o servicios.
- Proporciona respuestas claras y concisas.
- Incluye estrategia de posicionamiento “long tail”: búsquedas más amplias y descriptivas, pero con menos competencia.
- Incluye enlaces dentro de tus FAQs siempre y cuando sean relevantes en relación con el contenido.
- Añade marcado de datos estructurados.
Otros datos estructurados
Los datos estructurados son un formato estandarizado para proporcionar información sobre una página y clasificar el contenido de la página, y es una buena manera de ayudar a Google a indexar nuestro contenido y volverse más atractivo visualmente en Google SERP al ser elegible para resultados enriquecidos. Esencialmente, los datos estructurados eliminan algunas de las conjeturas que deben hacer los motores de búsqueda cuando rastrean el sitio, proporcionando contexto al contenido y, por lo tanto, ayudando a Google a comprenderlo.
En apartados anteriores ya se han mencionado algunos de los marcados de datos más habituales, veamos ahora otros modelos muy recomendables para las páginas PDP y PLP de tu eCommerce:
- Esquemas JSON-LD de Producto: Son uno de los tipos de marcado más frecuentes y útiles para las páginas de comercio electrónico, destacando los datos más relevantes del producto (como su precio, marca o disponibilidad).
- Esquemas JSON-LD de Reseñas: Este tipo de marcado permite mostrar en el fragmento un breve extracto de una revisión o calificación (generalmente un promedio de las puntuaciones de calificación combinadas de muchos revisores). Los fragmentos de reseñas pueden aparecer en los resultados enriquecidos o en los paneles de conocimiento de Google. Para esto deberá de tenerse previamente implementada la funcionalidad para recibir reseñas de los usuarios.
Google dispone de una herramienta de prueba de datos estructurados llamada Google Structured Data Testing Tool, que te será de gran utilidad para comprobar diferentes tipos de marcado de datos y si Google los reconoce como válidos.
Recomendaciones
- Incluye únicamente información presente en la página.
- Añade el elemento <script> dentro del <head> o del <body> de la página.
- Asegúrate de añadir, al menos, las propiedades obligatorias.
- Valida tu código con la prueba de resultados enriquecidos.
Estrategia de enlaces internos
Los enlaces internos son enlaces que van de una página a otra dentro del mismo dominio. Los enlaces internos son importantes fundamentalmente por dos motivos:
- Ayudan a que el usuario permanezca por más tiempo en tu dominio (es decir, reduce el «bounce rate»)
- Facilitan el rastreo, la indexación y la clasificación de las páginas al robot de Google.
Los enlaces internos también pueden ayudar a demostrar la relación contextual entre dos páginas si se usan correctamente, lo que ayuda tanto a los usuarios como a los motores de búsqueda a comprender la estructura y la jerarquía del sitio. Los enlaces internos ayudan a los usuarios a navegar mejorando su experiencia, al mismo tiempo que ayuda a pasar la autoridad entre las páginas del sitio y, en última instancia, mejorar los rankings.
Recomendaciones
- El objetivo fundamental debe ser mejorar la experiencia de usuario agregando valor al contenido y mejorando la navegación.
- Usa textos de anclaje (“anchor text”) naturales. Este es el fragmento de texto que muestran los enlaces incluidos en el contenido, permitiendo hacer clic sobre ellos.
- Enlaza a contenido relevante al contexto del contenido.
- Enlaza a contenido concreto más allá de la página de inicio.
- Añade un número razonable de enlaces internos, sin sobrecargar el contenido.
- Evitar añadir enlaces internos con etiquetados como “nofollow”.
Optimización de imágenes
La optimización de imágenes se ha convertido en un elemento muy importante del SEO moderno, ya que ofrece una oportunidad adicional para posicionar contenido visual de tus productos en los resultados de búsqueda. Cada vez más imágenes ocupan un lugar destacado en los SERPs y a menudo se posicionan por encima de los resultados orgánicos habituales.
Por esto, no se debe ignorar la importancia de las imágenes para el SEO, ya que las imágenes deben ser accesibles no solo para los usuarios sino también para los motores de búsqueda.
El atributo «alt-text» puede garantizar esto al proporcionar una alternativa de texto a las imágenes que explica a los motores de búsqueda qué representa esa imagen, pudiendo incluir en esta descripción palabras clave siempre y cuando tenga sentido y no se utilice de forma exagerada para intentar posicionarnos en Google (lo que sería motivo de penalización por parte del buscador).
Además, otro factor fundamental será reducir el tamaño de las imágenes para que sean lo más razonablemente pequeñas posible, así como utilizar formatos que permitan reducir el tamaño del archivo. De este modo se mejoraría enormemente tanto la experiencia de usuario como la capacidad de rastreo del sitio por parte de los bots de Google, lo que podría ayudarnos a posicionarnos mejor en los resultados de búsqueda.
Los tamaños de imagen más pequeños mantienen gran parte de la calidad de la imagen original y ayudan a que las páginas se carguen más rápido para una experiencia de usuario perfecta. En cuanto al formato, Google recomienda usar WebP, un formato de imagen que viene para remplazar tanto las imágenes JPG como PNG e incluso los GIF y que permite reducir el tamaño de estas hasta en un 80%. Esto significa que se pueden usar imágenes más pequeñas para que las páginas se carguen más rápido proporcionando una mejor experiencia de usuario y también ayudando a mejorar el posicionamiento orgánico.
Por último y con el objetivo de mejorar el tiempo de carga de la página y la experiencia de usuario, se recomienda implementar el “lazy loading” en las páginas. Esta técnica consiste en que las imágenes no se cargan hasta que aparecen en la pantalla del usuario (es decir, hasta que el usuario se desplaza a la parte de la página que contiene la imagen), reduciendo significativamente el tiempo requerido para la carga inicial de la página.
Recomendaciones
- Utiliza “alt-texts” descriptivos y relevantes con palabras clave relevantes.
- Asigna un nombre al archivo de imagen antes de subirlo.
- Comprime las imágenes tanto como sea posible para un tiempo de carga más rápido.
- Utiliza el formato WebP en lugar de JPEG o PNG.
- Utiliza imágenes adaptables para cualquier tipo de dispositivo.
- Utiliza “lazy loading”, mejorando el tiempo de carga y la experiencia de usuario.
XML Sitemap automatizado
El sitemap es, como su nombre indica, un mapa de tu sitio web con el que indicas a Google qué páginas quieres que indexe y muestre en sus resultados de búsqueda. Además, te permite identificar rápidamente problemas de indexación.
En ocasiones, las páginas que reciben pocos links o no son fácilmente accesibles no son encontradas e indexadas por Google. Por esto, incluir en el sitemap todas las páginas que te interesan es una garantía de que el buscador sepa de la existencia de ese contenido y pueda indexarlo y presentarlo como resultado de búsqueda.
Recomendaciones
- Archivo XML publicado en una URL accesible que enumera todos las URLs de los productos que hay dentro del eCommerce.
- Si alguna página incluye la etiqueta de robots «Noindex», esta página debe ser excluida del sitemap XML.
- Si alguna de estas páginas tiene una etiqueta canónica que no hace referencia a sí misma, no debe formar parte del sitemap.
- Si un producto ya no estará disponible y la URL queda obsoleta, debe eliminarse automáticamente del archivo XML.
Funcionalidad de «scroll infinito» en las PLP
Una página de listado de productos (PLP) es una parte esencial de cualquier sitio web de comercio electrónico y juega un papel clave para ayudar a los compradores a tomar sus decisiones de compra. Es uno de los factores más importantes para mejorar tus tasas de conversión, por lo que es necesario optimizarlas como es debido.
En este sentido, debemos hablar de un sistema que se ha puesto muy de moda en los últimos años fundamentalmente a raíz de las redes sociales (como Twitter, Facebook, Instagram o Pinterest) y que se conoce como “scroll infinito” (o “infinite scrolling”). El scroll infinito es una técnica que permite cargar y visualizar progresivamente el contenido de una página a medida que se avanza con el scroll. Se trata de un sistema alternativo al mecanismo de paginación para mostrar listados de resultados, ofreciendo una mejora del tiempo de carga inicial de la página, pero que también conlleva sus riesgos al implementarse a través de AJAX (Asynchronous JavaScript And XML), lo que significa que es necesario proporcionar enlaces apuntando a las URL de los componentes para que los motores de búsqueda o los usuarios sin JavaScript puedan acceder al contenido.
En este escenario, la mejor solución dependerá del tamaño del catálogo.
Así, para páginas de listado de productos con un gran número de tarjetas, lo recomendable es que el scroll infinito automáticamente se reemplace por enlaces de paginación HTML simples, complementando etiquetas canónicas autorreferenciales con las etiquetas rel=“next” y rel=“prev” para indicar la relación entre páginas (como se ve en la imagen inferior).
Sin embargo, si la PLP no contiene un gran número de productos, en lugar de la paginación se debería optar por un formato de “ver todo” para cuando no esté habilitado JavaScript.
Recomendaciones
- Utiliza el scroll infinito para mejorar el tiempo de carga y la experiencia de usuario.
- Los elementos esenciales deben ser accesibles para los motores de búsqueda como enlaces (sin JavaScript).
- Para listas de productos largas, sin JavaScript el scroll infinito debe de reemplazarse por enlaces de paginación HTML.
- Para listas cortas de productos, sin JavaScript utiliza un formato de página de «ver todo», sin necesidad de paginación.
Navegación con filtros en las PLP
Otro elemento de gran importancia para optimizar las páginas de listado de productos, especialmente cuando el listado cuenta con un amplio catálogo, es la navegación con filtros.
La navegación filtrada permite a los usuarios restringir los elementos en la lista en función de los atributos del producto. Su función es mejorar la experiencia de usuario al ayudar a encontrar lo que buscan con mayor facilidad, descartando todos los productos que no se ajusten a las características deseadas (marca, color, talla, precio…). Lo más habitual es que el usuario necesite filtrar con atributos combinados.
El principal propósito es que el usuario llegue al producto deseado en la menor cantidad de clics posible, facilitándole así el proceso de compra.
Recomendaciones
- Analiza las características de cada categoría de producto para facilitar filtros específicos en cada tipo de artículo.
- Permite el filtrado con atributos combinados.
- Asegúrate de que el usuario pueda ver fácilmente qué filtros ha introducido y pueda deshacerlos de forma rápida y sencilla.
- Asegúrate de que la herramienta de filtrado es funcional en dispositivos móviles (generalmente a través de un sistema simplificado).
En RafaSEO te ofrecemos las soluciones digitales que necesitas para tu negocio aprovechando al máximo los beneficios del Kit Digital.
Impulsamos proyectos personalizados para cada cliente adaptándonos a las necesidades y metas de cada uno y elaborando estrategias comunicativas únicas. Tratamos a nuestros clientes con empatía y transparencia, manteniendo una comunicación abierta y constante de principio a fin del proyecto, asegurándonos de la satisfacción del cliente en todo momento.
Utilizamos las mejores herramientas a la hora de diseñar y crear tu página web, comercio electrónico, así como para gestionar tus perfiles profesionales en redes sociales y mejorar la presencia de tu sitio en los buscadores para llegar a tus clientes gracias a técnicas SEO y SEM.
Contáctame y planifiquemos tu estrategia digital!
Puedes contactarme por teléfono, WhatsApp, enviándome un correo electrónico, o esperar a que me ponga en contacto contigo rellenando este formulario.
* Los datos serán tratados por el responsable de la web con la finalidad de establecer contacto, enviar información y promociones y con la legitimación por parte del cliente. Ver política de privacidad.