Cómo optimizar vídeos en WordPress: 11 trucos

Consejo 1: No utilices vídeos en el ATF (Above the Fold)

El término «Above the Fold» (ATF) se refiere a la parte de la página web que se ve en primer lugar, es decir, la zona visible sin necesidad de hacer scroll.

Poner un vídeo en esa sección puede ser perjudicial para tu velocidad web por varias razones:

1. Carga inicial más lenta: al estar el vídeo en la parte superior, se cargará inmediatamente en cuanto el usuario acceda a la página. Si además no está optimizado, provocará que tu web tarde mucho en cargar, aumentando tu porcentaje de rebote.
2. Experiencia de usuario: muchos usuarios no quieren ver un vídeo de forma inmediata. Darles la opción de navegar y consumir el contenido a su ritmo mejora la experiencia de usuario.
3. SEO: Google puntúa negativamente las páginas web lentas y tener un vídeo en el ATF sin optimizar puede afectar indirectamente a tu posicionamiento web.

Consejo 2: Elige el formato de vídeo adecuado para web

Elegir el formato correcto para tus vídeos puede marcar la diferencia entre una página web rápida y una lenta.

Para la optimización de vídeos para web se recomienda utilizar formatos modernos como MP4 o WebM:

• MP4: excelente relación calidad-peso y gran compatibilidad con la mayoría de navegadores y dispositivos.
• WebM: excelente calidad de vídeo con un peso menor que otros formatos, aunque no todos los navegadores lo soportan.

Consejo 3: Evitar utilizar vídeos de fondo

Los vídeos de fondo son espectaculares, sin embargo ralentizan la carga de la página web incluso sin estar en el ATF.

Cuando colocas un vídeo de fondo, este suele reproducirse automáticamente y sin el control del usuario, lo que obliga al navegador a cargar y reproducir ese contenido desde el primer momento.

Mi recomendación: si quieres crear efectos dinámicos de fondo, lo mejor será utilizar una animación CSS o un GIF ligero.

Los vídeos de fondo suelen ser muy pesados y, en la mayoría de los casos, no aportan un valor diferencial suficiente como para justificar el sacrificio de rendimiento.

Consejo 4: Evitar la reproducción automática de vídeos

Seguramente más de una vez te ha pasado que al entrar en una página web ¡ZAS! un vídeo empieza a sonar sin tu permiso a todo volumen.

Esto además de ser molesto para el usuario puede penalizarte en términos de usabilidad. Y además, si un vídeo se reproduce automáticamente el navegador empieza a descargar todos los datos de inmediato, ralentizando tu página web y disparando el aviso de «cargas útiles de red de gran tamaño» en PageSpeed Insights.

Lo más recomendable será activar la reproducción manual, de forma que el usuario sea quien decida si quiere ver el vídeo o no. De esta forma, el navegador no cargará todo el vídeo hasta que el usuario pulse «play».

Consejo 5: Reduce el peso de los vídeos antes de subirlos

Una de las principales razones por las que tu página web con vídeo puede ser lenta es el peso de los archivos. Cuanto más pese un vídeo, más tardará tu página en cargar y más probabilidades tendrás de activar el aviso de cargas útiles de red de gran tamaño en Core Web Vitals.

Para reducir el peso de tus vídeos puedes:

• Recortar las escenas que no sean necesarias.
• Reducir la resolución del vídeo (no hace falta que sea 4K para web).
• Disminuir la tasa de fotogramas (FPS).
• Rebajar el bitrate.
• Optar por herramientas de compresión de vídeos online como Clideo o FreeConvert.

Consejo 6: Comprime los vídeos antes de subirlos

Además de reducir la resolución y editar el vídeo para eliminar partes innecesarias, siempre deberás comprimir el archivo final.

Herramientas como Clideo o FreeConvert te permitirán ajustar la compresión y rebajar el peso del vídeo antes de subirlo a WordPress.

Ojo con pasarte a la hora de comprimir: un exceso de compresión puede hacer que tus vídeos se vean pixelados o pierdan calidad. Busca el punto de equilibrio entre peso y calidad.

Consejo 7: Limita el número de vídeos por URL

Un error muy habitual es incluir demasiados vídeos en una misma URL. Cuantos más elementos tenga que cargar la página, más tiempo tardará en mostrarse al usuario.

Si necesitas poner varios vídeos relacionados lo mejor será crear distintas URLs de forma individual o agruparlos en una página específica con lazy loading activado.

Google y los usuarios valoran la relevancia del contenido. Siempre será mejor ofrecer un contenido bien estructurado que uno saturado con muchos vídeos a la vez.

Consejo 8: Cuidado con los vídeos incrustados de YouTube o Vimeo

Mucha gente recomienda subir los vídeos a plataformas como YouTube o Vimeo para ahorrar espacio en el hosting. En parte tienen razón, pero existen contras importantes.

Cuando incrustas un vídeo de YouTube o Vimeo en tu página web se añaden scripts externos para poder reproducirlo que ralentizan la carga de la URL, pueden mostrar publicidad o sugerencias de otros vídeos y, si tu web está orientada a un público europeo, cargan cookies de terceros que pueden traerte problemas legales con la RGPD.

Dicho esto, si decides usar YouTube, activa siempre el modo de privacidad mejorada y considera reemplazar el iframe por una miniatura estática (que se transforma en reproductor al hacer clic), algo que plugins como WP Rocket ya hacen automáticamente.

Si tu prioridad es la velocidad y el control total de tus contenidos, lo mejor será servir tus vídeos desde tu propio hosting o CDN.

Consejo 9: Sirve los vídeos desde un CDN

Si decides alojar tus vídeos directamente en tu WordPress, lo mejor será optar por una de estas dos alternativas:

• Hosting local: subir tus vídeos a tu propio servidor asegurándote de tener espacio y recursos suficientes. Si tu hosting se queda corto, tu web puede caerse o volverse lenta.
• CDN (Content Delivery Network): con esta alternativa tus vídeos se servirán desde el servidor más cercano al usuario, reduciendo el tiempo de carga sin saturar tu hosting. Entre los CDN más populares están Cloudflare, KeyCDN y BunnyCDN.

Consejo 10: Utiliza miniaturas personalizadas para cada vídeo

Lo mejor para optimizar vídeos en WordPress sin sacrificar el diseño es utilizar miniaturas o carátulas personalizadas.

En lugar de cargar el primer frame del vídeo, mostrarás una imagen (que carga más rápidamente) hasta que el usuario pulse «play». De esta forma, la página no carga el reproductor completo hasta que el usuario lo solicita, mejorando considerablemente tu WPO.

PD. Puedes usar estas miniaturas como parte de tu estrategia de WordPress video SEO añadiendo textos alternativos (alt text) descriptivos a cada imagen.

Consejo 11: Activa el Lazy Loading para tus vídeos de WordPress

El lazy loading o «carga diferida» es una técnica que retrasa la carga de contenido que no se encuentra visible en pantalla en ese momento.

De esta forma, los vídeos solo se cargarán cuando el usuario haga scroll y esté a punto de verlos, mejorando tu WPO y evitando las cargas útiles de red de gran tamaño que penaliza Google.

Para activar lazy load en tus vídeos de WordPress puedes usar plugins como WP Rocket o Perfmatters.

Cómo activar Lazy Load para vídeo en WP Rocket

1. Instala y activa WP Rocket en tu WordPress.
2. Ve a la pestaña «Medios».
3. Activa la opción «Activar la carga diferida de los iframes y los vídeos».
4. Activa también «Reemplazar el iframe de YouTube por una imagen de vista previa» para que, en lugar de cargar todo el reproductor, aparezca una imagen que se sustituye cuando el usuario hace clic.

Cómo activar Lazy Load para vídeo en Perfmatters

1. Instala y activa Perfmatters.
2. Ve a Perfmatters > Settings.
3. Busca la pestaña «Media» y activa la opción «Lazy Loading».
4. Asegúrate de que el lazy load para vídeos esté habilitado.
5. Guarda los cambios.

Perfmatters también ofrece la opción de reemplazar el iframe de YouTube por una miniatura, reduciendo los scripts que se cargan inicialmente.

Preguntas frecuentes sobre la optimización de vídeos en WordPress

Conclusiones