Respuesta breve
Un vídeo de fondo en la cabecera es siempre mudo, siempre pesado y nunca te dice si alguien lo quería. Aquí está dónde el movimiento se gana su sitio, dónde basta un póster con botón, y por qué el color va en la exportación y no en el CSS.
La respuesta corta: el vídeo vende movimiento, no datos: El arranque automático se concede al vídeo silenciado,…
La primera pantalla tiene una sola tarea: explicar a qué te dedicas y qué hay que pulsar después. El vídeo muestra bien el movimiento, la textura, la escala y a las personas. Sostiene mal un precio, una ficha técnica o una dirección, porque eso se recorre con la vista y un clip no se recorre con la vista.
Así que la pregunta útil no es vídeo sí o vídeo no. La pregunta es otra: ¿necesita moverse esta cosa para que se entienda? La tela cae, la máquina corta, la sala resulta más grande de lo que sugería la foto, a una persona se le cree porque se la oye. Eso lo sostiene el movimiento.
Cuando la respuesta es que no, una fotografía con pie de foto hace el mismo trabajo por una fracción de los bytes, aparece ya en el primer pintado y se lee en el metro con dos rayas de cobertura. No es una renuncia ni una versión barata: es el formato correcto.
El resto del artículo trata las dos decisiones que se derivan de ahí: si el clip arranca solo, y qué cuesta eso en un móvil, dentro del navegador y en tu propio presupuesto de producción.
Bucle de fondo automático frente a un póster con botón de reproducción
Un bucle de fondo arranca sin preguntar. Gasta datos, batería y atención del visitante antes de que esa persona haya decidido que tu página merece alguna de las tres cosas. Un póster con botón cuesta una imagen y una pulsación deliberada.
La vía del póster tiene una ventaja añadida: mide el interés. Si casi nadie pulsa el botón, el vídeo era decoración y lo has descubierto barato. El arranque automático no te dará nunca esa señal, porque en las cifras lo ha visto todo el mundo.
Aun así queda un caso estrecho para el bucle: una base corta y silenciosa detrás de un titular donde el contenido sea de verdad la atmósfera — la sala de un restaurante, una tela en movimiento, un taller. Tiene que ir sin sonido, ser breve y no llevar ninguna información dentro.
Todo lo que tenga subtítulos, una cara hablando, una cifra en pantalla o una secuencia que importe vive detrás de un botón. El visitante necesita arrancarlo, pararlo y volver atrás, y un bucle de fondo no ofrece ninguna de esas tres cosas.
Qué le pide realmente el arranque automático al navegador
Los navegadores no dejan que una página encienda el sonido por su cuenta. El arranque automático se concede al vídeo silenciado, y el elemento necesita muted, autoplay, loop y playsinline; sin playsinline un móvil puede llevarse el clip a pantalla completa en lugar de reproducirlo en su sitio.
Conviene leerlo dos veces: un clip que arranca solo es siempre un clip mudo. Si el mensaje vive en la voz en off, el arranque automático ya lo ha cortado, y estás pagando el peso completo de la página para no entregar nada.
La reproducción muda traslada toda la carga a los subtítulos y a los rótulos en pantalla, que después tendrán que seguir siendo legibles sobre un fondo en movimiento. Eso lo tratamos aparte, porque se resuelve en la maquetación y no en el montaje.
Y el arranque automático es una petición, no una garantía. Una batería baja, un ahorro de datos, una preferencia del sistema por menos movimiento o una política del navegador pueden rechazarla. La página tiene que verse terminada en el caso en que el vídeo no arranque nunca.
Peso de página: medido, no discutido
No resuelvas esto de memoria ni con el instinto de un diseñador. Abre el panel de red, activa la limitación de velocidad y un perfil móvil, carga la página y anota dos números: el tamaño transferido del clip y el tamaño transferido del póster.
Un archivo de vídeo y una sola imagen fija son cosas de órdenes distintos, y la diferencia se ve enseguida. El sentido de medir es que después discutes el intercambio con un número en la mano y no con el gusto de alguien.
Dos valores del atributo preload eliminan buena parte del daño. Con none, el navegador no descarga el clip hasta que se lo piden; con metadata, descarga solo lo justo para conocer la duración. Una cabecera que arranca sola no puede usar ninguno de los dos, y ese es justamente su precio.
Comprueba la conexión lenta por separado: ¿aguanta la maquetación, aparece el póster, o el visitante recibe un rectángulo gris donde debería estar la primera pantalla? Prueba ese estado a propósito, porque los visitantes lo encuentran sin ningún esfuerzo.
Contenedor y códec: la extensión del archivo no es una especificación
La guía de MDN sobre formatos de contenedor multimedia introduce una distinción que ahorra mucha correspondencia con un proveedor: el contenedor es la envoltura (MP4, WebM, Ogg, QuickTime) y el códec es la forma en que se comprimen la imagen y el sonido que van dentro (H.264, VP9, AV1, AAC, Opus).
Dos archivos pueden terminar los dos en .mp4 y comportarse de forma distinta, porque un mismo contenedor puede llevar un códec que un navegador concreto no descodifica. Por eso mándame un MP4 es un encargo incompleto: el códec también va en la petición.
En la práctica eso significa acordar H.264 en MP4 por compatibilidad amplia y, cuando compense el tiempo extra de codificación, ofrecer una segunda versión más eficiente. El elemento video acepta varias fuentes y el navegador se queda con la primera que sabe reproducir.
Si pones la cadena del códec en el atributo type, el navegador puede descartar un archivo sin descargarlo. Es un detalle pequeño que importa exactamente en una situación: en el visitante con la peor conexión, que es el visitante que menos te puedes permitir perder.
El póster hace más trabajo que el propio vídeo
El póster es una imagen corriente, así que el navegador lo pinta antes de que haya llegado un solo byte de vídeo. En un móvil lento, el póster es lo que el visitante ve de verdad, y con bastante frecuencia el póster es toda la experiencia que recibe.
Elige ese fotograma con intención. Tiene que leerse de un vistazo: un sujeto claro, sitio para el control de reproducción y para el titular, y no un fotograma cualquiera del medio con alguien pillado a mitad de parpadeo.
Trata el póster como cualquier otra imagen de cabecera: dimensiones correctas, comprimido y con la misma relación de aspecto que el clip, para que la maquetación no dé un salto en el momento en que empieza la reproducción.
Y escribe el texto de alrededor para que se sostenga solo. Un titular y una frase junto al póster responden a la pregunta del visitante sin reproducción alguna, y el vídeo pasa a ser la prueba para quien quiera una prueba.
Por qué un filtro sobre un vídeo en marcha cuesta una pasada de color por fotograma
A los diseñadores les apetece tintar la cabecera: desaturarla, calentarla, desenfocarla, poner encima un velo oscuro para que el titular se lea. Aplicado en CSS sobre una reproducción en marcha, eso deja de ser un efecto puntual y pasa a ser un coste continuo.
Una imagen fija se puede filtrar una vez y reutilizar el resultado mientras nada cambia. Un vídeo entrega al compositor píxeles nuevos muchas veces por segundo, así que el filtro se recalcula para cada uno de esos fotogramas, en el dispositivo del visitante y mientras dure el clip.
El desenfoque cuesta más que un tinte, porque el trabajo crece con el radio, y un filtro apilado sobre un vídeo escalado a todo el ancho además aparta los fotogramas del camino más corto que tiene el navegador para llevar imágenes descodificadas a la pantalla.
El remedio es aburrido y gratis: deja el aspecto cocinado en la exportación. El montador aplica el color una vez, al archivo, y cada visitante se descarga un resultado ya terminado. Si hace falta un velo oscuro por legibilidad, una capa plana semitransparente cuesta muchísimo menos que un filtro.
El texto sobre imágenes en movimiento es un problema de contraste
El contraste se mide entre el texto y lo que hay detrás. Detrás de un vídeo, ese algo cambia sin parar, así que un titular que aprueba sobre el fotograma del póster desaparece tres segundos después, cuando entra en cuadro una pared clara.
La referencia rápida del W3C para WCAG 2.2 fija los requisitos de contraste del texto, y la conclusión práctica para un fondo de vídeo es una sola: no puedes confiar en el material. La tipografía necesita una capa constante que no dependa del fotograma.
Esa capa puede ser un velo sólido o en degradado, un bloque de color dentro del cual vive el titular, o sencillamente sacar el texto fuera del vídeo para que el clip pase a ser un panel al lado. Las tres salidas cuestan menos que pelearse con el material.
Compruébalo con honestidad: párate en diez momentos distintos del clip y mira el titular en cada uno. Si ha desaparecido aunque sea una vez, para una parte de tus visitantes ha desaparecido del todo.
Dale a la gente una forma de pararlo
WCAG 2.2 pide un mecanismo para pausar, detener u ocultar contenido en movimiento que arranca solo, dura más de cinco segundos y se muestra en paralelo con otro contenido, y también una forma de detener el sonido que empieza sin que nadie lo haya pedido.
Una cabecera en bucle es exactamente ese contenido. Un control de pausa visible es la respuesta honesta y cuesta un botón. Además rescata a quien no cubre ningún requisito: quien lee en el transporte, en una reunión o con una tarifa que cobra por megabyte.
Respeta también la preferencia de movimiento reducido. Cuando un visitante le ha pedido menos animación a su sistema operativo, sirve el póster y sáltate el bucle: la página sigue funcionando y has retirado la versión que a algunas personas les sienta físicamente mal.
Si el clip lleva habla, necesita subtítulos, y WCAG los trata como un requisito para los medios sincronizados pregrabados y no como un detalle amable. Una cabecera muda que arranca sola no le deja al habla ningún canal salvo el texto en pantalla.
Cuándo gana sin más una imagen fija
La fotografía gana allí donde el sujeto no se mueve: un producto sobre blanco, una carta, un retrato de equipo, un interior terminado, un certificado, un cartel de precios. El movimiento no le añade nada a un objeto que no contiene movimiento propio.
Gana otra vez en las páginas cuyo trabajo es que las encuentren y las lean: una página de servicio, una ficha de catálogo, una página de sede. Esas páginas necesitan texto, estructura y una primera pantalla rápida mucho más que una cabecera en vídeo.
Y gana cuando no estás dispuesto a mantener el vídeo. Una fotografía de hace un año sigue pareciendo una fotografía. Un clip promocional de hace un año parece abandonado, porque enseña el envase de la temporada pasada y un teléfono que ya has cambiado.
La prueba honesta es sencilla: describe con palabras lo que mostraría el clip. Si la descripción cabe en una frase sobre un objeto quieto, encarga una fotografía y gasta la diferencia en el texto que va a su lado.
Dónde se gana el vídeo su sitio
Montaje, instalación y uso. Todo lo que el cliente tendrá que hacer con las manos es más fácil de enseñar que de escribir, y un clip corto elimina una conversación de soporte que si no se repetiría cada semana.
Escala y espacio. Salas, locales, vehículos y objetos grandes quedan planos en una fotografía; un movimiento lento por dentro explica el tamaño como no lo consigue ningún plano general, porque el espectador percibe cuánto se tarda en recorrerlo.
Personas y confianza. Alguien que responde a una pregunta con sus propias palabras hace algo que no hace un testimonio entrecomillado, siempre que la grabación esté lo bastante limpia como para que la respuesta se crea en lugar de ponerse en duda.
Y el movimiento del propio producto: tela, líquido, un mecanismo, una bisagra, un pliegue. Si lo que vendes es cómo se comporta la cosa, la fotografía estática está describiendo un objeto distinto del que vendes en realidad.
Qué encargar y cuánto cuesta
Una sola pieza vertical es el Single Reel por $70, entregado en 1-2 días laborables y con 1 ronda de revisiones. Incluye subtítulos, una pista con licencia y exportaciones para todas las ubicaciones verticales; la grabación, el guion y los actores no están incluidos.
Si el material ya está grabado y quieres un conjunto, el Reels Pack cuesta $90 por hasta 5 montajes, entregado en 1-2 días laborables desde la entrega del material y con 2 rondas sobre el montaje; la grabación no forma parte del paquete, porque el material lo aportas tú.
Cuando la fecha está fijada existe el Reels Pack Express por $150: 1 día laborable, un plazo de 24 horas desde el material, 1 ronda de revisiones, y quedan fuera la grabación y cualquier licencia más allá de la pista suministrada.
Para una pieza principal con derivados cortos está el Campaign Edit por $180 en 3-5 días, con 2 rondas sobre el montaje y 1 sobre el etalonaje; la música con licencia no está incluida, ya que la licencia la compras tú. Si la web necesita un flujo y no un único lanzamiento, el Monthly Content Engine cuesta $290/mo en ciclo mensual con un preaviso de 30 días para pararlo, el volumen se acuerda al inicio de cada ciclo, y los días de grabación y el stock de pago quedan fuera.
Lista práctica
- Decide si el sujeto se mueve de verdad antes de encargar ningún clip.
- Sustituye la cabecera automática por un póster con botón siempre que el vídeo lleve información.
- Mide el tamaño transferido del clip y del póster en un perfil móvil con la velocidad limitada.
- Pide al proveedor un códec y un contenedor concretos, y no simplemente un MP4.
- Saca del CSS cualquier tinte, etalonaje o desenfoque y llévalos a la exportación.
- Añade un control de pausa visible, subtítulos y una alternativa para movimiento reducido antes de publicar.
Preguntas frecuentes
¿Debe arrancar sola la cabecera de vídeo?
Solo si va muda, es corta y no lleva información que el visitante tenga que leer. En cuanto el clip contiene subtítulos, una cara hablando o una secuencia que importa, se traslada detrás de un botón. Ten presente además que el arranque automático lo pueden rechazar el navegador, un ahorro de datos o una preferencia del sistema por movimiento reducido, así que la página tiene que verse terminada sin él.
¿Cuánto cuesta un vídeo para la web y en cuánto tiempo está?
El Single Reel cuesta $70, se entrega en 1-2 días laborables con 1 ronda de revisiones, y no incluye grabación, guion ni actores. El Reels Pack cuesta $90 por hasta 5 montajes, se entrega en 1-2 días laborables desde la entrega del material con 2 rondas sobre el montaje, y el material lo aportas tú. El Campaign Edit cuesta $180 en 3-5 días, con 2 rondas sobre el montaje y 1 sobre el etalonaje, y la licencia de la música la compras tú. El Reels Pack Express cuesta $150, 1 día laborable, plazo de 24 horas desde el material, 1 ronda. El Monthly Content Engine cuesta $290/mo en ciclo mensual con un preaviso de 30 días para pararlo.
¿Qué formato le pido al proveedor?
Nombra el contenedor y el códec. Como explica la guía de MDN, el contenedor (MP4, WebM, Ogg, QuickTime) es la envoltura y el códec (H.264, VP9, AV1, AAC, Opus) es la forma de comprimir lo que va dentro, y por eso dos archivos con la misma extensión pueden comportarse de forma distinta. Una petición práctica es H.264 en MP4 por compatibilidad amplia, con una segunda versión más eficiente como fuente adicional cuando compense el tiempo extra.
¿Puedo poner sin más un filtro al vídeo en CSS?
Puedes, pero lo paga el dispositivo del visitante. Una imagen fija se filtra una vez, mientras que un vídeo entrega píxeles nuevos muchas veces por segundo, así que el filtro se recalcula en cada fotograma mientras dure el clip. El desenfoque cuesta más que un tinte porque el trabajo crece con el radio. Deja el color cocinado en la exportación y usa una capa plana semitransparente cuando el titular necesite ayuda.
¿Hacen falta subtítulos si el clip ya va sin sonido?
Sí, por dos motivos a la vez. Una cabecera muda que arranca sola no le deja al habla otro canal que el texto en pantalla, y WCAG 2.2 trata los subtítulos como un requisito para los medios sincronizados pregrabados. Aparte necesitas una forma visible de pausar el movimiento cuando un clip arranca solo y dura más de cinco segundos junto a otro contenido.