Los videos de fondo no son el futuro. Son el presente. No porque sean geniales y todo el mundo los use, sino porque plataformas sociales como Facebook están apostando por la realidad aumentada (RA): experiencias inmersivas que impulsan nuestras interacciones. Y el video es un pilar fundamental de la RA.
El video de fondo es una maravilla. Pero si no sigues algunas pautas importantes, puede arruinar el rendimiento de tu sitio y estropear el diseño y la experiencia general. Antes de profundizar en esas pautas, asegurémonos de que estamos listos para añadir videos de fondo a nuestro sitio.
Cada vez vemos más videos de fondo por toda la web
Los videos de fondo pueden ser una forma fantástica de mejorar el aspecto de tu sitio web, hacerlo más agradable para los visitantes y captar su atención.
Los visitantes quieren sentirse atraídos, y un buen video lo consigue. Los videos pueden contar la historia de una empresa, y toda empresa tiene una historia que merece ser contada de la mejor manera.

Buenas prácticas para añadir videos de fondo
Usa un video de fondo solo cuando realmente mejore el aspecto y la sensación de tu sitio. Es tentador lanzarse a por lo último y más llamativo sin considerar su impacto. Aunque el impacto será mínimo si se hace bien, tu sitio será más lento. Cambiar una imagen estática por un video debe valer la pena.
Aquí tienes algunas cosas a tener en cuenta:
- Elige un video corto que cargue rápido. Deja las películas de larga duración para el cine.
- No uses sonido. El sonido aumenta el tamaño del archivo y aporta poco valor. A menos que consideres valioso obligar a tus visitantes a buscar desesperadamente cómo silenciarlo.
- Usa un marcador de posición. Si el video se detiene o no puede reproducirse, asegúrate de que haya una imagen de respaldo. Crear marcadores de posición en Webflow es sencillo. Coloca tu elemento de video de fondo en una sección que ya tenga una imagen de fondo.
- Sustituye el video por una imagen en la versión móvil — los videos a menudo no se reproducen o son difíciles de implementar en móviles. Además, no es muy considerado consumir los datos móviles de un usuario con un video de fondo. Sustituir el video por una imagen en Webflow también es pan comido. Oculta el elemento de video de fondo en los puntos de interrupción móviles para mostrar la imagen de fondo. Esto garantiza la mejor experiencia para el visitante móvil.
Cuándo no deberías usar un video de fondo
Aunque un video de fondo es excelente para captar la atención, puede ser contraproducente si quieres que los visitantes se centren en tu texto.
Si abusas del video de fondo, eclipsará el contenido importante. Los videos pueden distraer cuando hay ideas complejas, como contenido de ventas, que requieren lectura. Si tu oferta necesita mucha explicación, las palabras son mejores. No corras el riesgo de distraer o perder visitantes por culpa de un video.
Elige la utilidad sobre la complejidad
“¿Cuál es la cantidad mínima de interfaz necesaria para que el usuario encuentre el contenido y este le hable?” Deberíamos hacernos esta pregunta a menudo durante el proceso de diseño, especialmente cuando decidimos si añadir o no un elemento.
Es fácil caer en el error de pensar que mejorarás la experiencia añadiendo animaciones divertidas o ocultando y revelando elementos. Pero en realidad, podrías estar añadiendo un obstáculo.
La mejor forma de mantener las cosas simples es... ¡mantenerlas simples! Empieza con la solución más directa y añade capas complejas solo cuando sea necesario. Tu video de fondo debe reforzar el mensaje, eliminar barreras y complementar el resto del contenido de tu sitio.
La palabra clave aquí es "fondo". Los vídeos de fondo deben integrarse en la estética del sitio web, no destacar por sí solos ni estorbar.
"El buen diseño es el diseño mínimo posible".
–Dieter Rams
La inteligencia detrás de añadir un vídeo de fondo
Mantén el objetivo de conversión como prioridad absoluta. La narrativa del vídeo de fondo siempre debe respaldar el objetivo final de la página.
El escenario ideal es aquel en el que los vídeos de fondo complementan o potencian la llamada a la acción (CTA).

Dale un toque personal
Por lo general, la gente prefiere tratar con personas, no con empresas sin rostro. Esta es una de las razones por las que a los compradores les encanta adquirir artículos en tiendas como Etsy: hay una cara detrás del negocio.
Añadir un vídeo corto que muestre a personas interactuando con tu servicio permite que los clientes potenciales se visualicen trabajando contigo. Esto, idealmente, lleva a tu audiencia a realizar una acción, como registrarse, hacer una compra o ponerse en contacto.
Haz que destaque
En la mayoría de los casos, querrás colocar texto sobre el vídeo de fondo, así que asegúrate de que sea fácil de leer durante todo el bucle. Por lo general, busca un fuerte contraste de luz y sombra entre el vídeo de fondo y el texto.

Una forma de garantizar un contraste total y legible es aplicar un filtro sólido y monocromático sobre el vídeo. Esto no solo se ve súper profesional, sino que el contraste de color hace que el texto, el formulario y la llamada a la acción de la página de destino resalten. Otras alternativas incluyen una sombra en el texto o un bloque de color semitransparente detrás del mismo.

Diseña interacciones y animaciones sin escribir código
Crea interacciones y animaciones complejas sin tener que tocar ni una línea de código.
Mantenlo breve
Los vídeos de fondo no deberían durar más de 10 segundos. Un vídeo corto en bucle debería ser suficiente para transmitir el mensaje sin afectar el tiempo de carga.
Recuerda que es un bucle. Si el vídeo es demasiado corto, el bucle parecerá fuera de lugar o incompleto. Por otro lado, si es demasiado largo, es posible que los visitantes abandonen el sitio o pasen a otra página antes de que el vídeo haya tenido la oportunidad de hacer lo que mejor sabe hacer: despertar las emociones deseadas.
Busca o produce un fondo sencillo en bucle que sea relevante para el contenido de tu sitio web. Hay muchos lugares donde conseguir clips de vídeo de stock. Si no puedes producir tu propio material, verifica los derechos de autor asociados a cualquier vídeo antes de usarlo.
Pero darle un toque personal es difícil cuando el contenido no es realmente tuyo. Así que, si es posible, produce siempre tu propio vídeo.
Hazlo imparable
Siempre que el contenido del vídeo sea de calidad y coherente con tu marca, no debería haber razón para que los visitantes tengan que pulsar play o pausa; no les des esa opción.
Los vídeos de fondo se reproducen automáticamente. Esto capta la atención del visitante y la mantiene desde el momento en que ven el elemento de vídeo. Te aseguro que quieren que les captes la atención; para eso están visitando tu sitio.

No olvides las analíticas
Como con cualquier otra cosa, revisa las cifras y consulta a tus usuarios para entender cómo está afectando tu vídeo de fondo a tus métricas clave.
Para que tus pruebas sean claras y precisas, no añadidas un vídeo de fondo junto con otros cambios de diseño. Si lo haces, no podrás sacar conclusiones definitivas sobre el impacto del vídeo. Asegúrate también de tener un plan por si el vídeo acaba afectando a tus métricas clave.
Realiza un test A/B para comparar el rendimiento de tu página con un vídeo de fondo frente a una imagen estática. Por seguridad, empieza dirigiendo solo una pequeña parte de tu tráfico a esa página.
Los tests A/B tienen su aquel: son una mezcla de magia y matemáticas. La mayoría de los especialistas en usabilidad se dejan llevar por la experiencia, el instinto y la opinión personal a la hora de decidir qué cambios de diseño encandilan a los clientes.
Al fin y al cabo, son tus clientes y tu marca quienes deciden qué funciona mejor. Pero los datos son la mejor forma de saber lo que tus clientes realmente piensan, en lugar de lo que dicen que piensan.
¿Has experimentado ya con vídeos de fondo?
Si es así, ¡nos encantaría conocer tus resultados! Puede que incluso nos interese publicar tu historia, así que no dudes en dejar un comentario aquí abajo.










