Google usa los Core Web Vitals como factor de ranking desde 2021. Si tu tienda Shopify tiene puntuaciones bajas en LCP, CLS o INP, estás perdiendo posiciones frente a competidores más rápidos. La buena noticia: muchas de las mejoras más impactantes no requieren tocar una sola línea de código.
¿Qué son los Core Web Vitals y por qué importan para Shopify?
Google mide tres métricas de experiencia de usuario para determinar el ranking:
- LCP (Largest Contentful Paint): cuánto tarda en cargar el elemento más grande de la página. Bueno: menos de 2.5 segundos.
- CLS (Cumulative Layout Shift): qué tanto "saltan" los elementos de la página mientras carga. Bueno: menos de 0.1.
- INP (Interaction to Next Paint): qué tan rápido responde la página a tus clicks. Bueno: menos de 200ms.
Mide primero: cómo ver tu puntuación actual
Antes de optimizar, mide. Herramientas gratuitas:
- Google PageSpeed Insights: analiza cualquier URL y muestra LCP, CLS e INP en móvil y escritorio
- Google Search Console: sección "Experiencia de página" → "Core Web Vitals" (datos reales de tus usuarios)
- Shopify Analytics: desde 2023 muestra métricas de rendimiento básicas
Mejoras sin código: LCP
1. Comprime todas las imágenes
La causa número 1 de LCP lento en Shopify es imágenes sin comprimir. En el admin de Shopify puedes reemplazar imágenes fácilmente. Antes de subir cualquier imagen:
- Redimensiona a máximo 2000px de ancho (Shopify las escala, no necesitas más)
- Comprímelas con TinyPNG.com o Squoosh.app
- Usa formato WebP cuando sea posible
2. Revisa cuántas apps tienes instaladas
Cada app de Shopify puede inyectar JavaScript que ralentiza la carga. Ve a tu panel de Shopify → Apps y desinstala cualquier app que no uses activamente. El impacto puede ser considerable: cada app elimina potencialmente 200-500ms de tiempo de carga.
3. Usa el CDN de Shopify correctamente
Shopify sirve todas las imágenes desde su CDN global. Asegúrate de no estar enlazando imágenes desde servidores externos en el contenido de tus páginas o blog posts.
Mejoras sin código: CLS
4. No uses fuentes web no esenciales
Las fuentes de Google Fonts con display:swap causan Layout Shift cuando se intercambian con la fuente de sistema. Si tu tema usa fuentes personalizadas, verifica en la configuración del tema si puedes usar "fuentes del sistema" como alternativa.
5. Configura imágenes con relación de aspecto fija
En la configuración del tema de Shopify (Personalizar tema), ajusta todas las imágenes de producto a una relación de aspecto fija (cuadrada, 4:3, etc.). Esto evita que la página salte cuando las imágenes cargan.
6. Evita banners de apps que se inyectan tarde
Los banners de cookies, popups de email y chat widgets que aparecen después de la carga inicial causan CLS. Configúralos para que aparezcan con animaciones suaves o fuera del flujo del contenido principal.
Mejoras sin código: INP
7. Reduce la cantidad de scripts de terceros
Cada app de analytics, píxel de Facebook, chat en vivo y app de marketing añade scripts que compiten por el hilo principal del navegador. Prioriza solo los absolutamente necesarios.
8. Usa la app Speed Booster de Shopify (o similar)
Hay apps en el Shopify App Store específicamente para mejorar el rendimiento: Booster: Page Speed Optimizer, Swift, Hyperspeed. Estas apps pueden mejorar el LCP sin necesidad de editar código.
Qué hacer si necesitas más mejoras
Si después de estas optimizaciones tu puntuación sigue baja (menor a 50 en móvil), probablemente necesites optimizaciones a nivel de código del tema. En Starstudio auditamos tu tienda y aplicamos optimizaciones técnicas de rendimiento. Solicita tu auditoría gratuita.