Cómo convertir un GIF a vídeo: conversión a MP4 y WEBM

Tienes un GIF y vas a ponerlo en tu web. El archivo pesa 6 MB y la página tarda en abrirse. O quizá necesitas meter un GIF en un proyecto de edición de vídeo. La conversión de GIF a vídeo es la respuesta a ambas necesidades y suele suponer una reducción dramática de tamaño.

Por qué conviene convertir el GIF a vídeo

Tamaño de archivo. El GIF usa una compresión ineficiente de 1987 y aprovecha la redundancia entre fotogramas solo de forma primitiva. El mismo contenido en MP4 suele ocupar la décima parte. Un GIF de 6 MB se convierte en un MP4 de 500 KB.

Velocidad de página. Los GIF grandes retrasan notablemente la carga en conexiones móviles. Además, los motores de búsqueda usan la velocidad de página como señal de posicionamiento.

Edición. Los programas de edición de vídeo pueden tener dificultades para importar un GIF directamente o interpretar mal su velocidad de fotogramas. Pasarlo a formato de vídeo arregla el flujo de trabajo.

Requisitos de plataforma. Algunas redes sociales y gestores de contenido piden vídeo.

Paso 1: Ajusta bien las expectativas

Digamos de entrada una verdad importante: la conversión no mejora la calidad.

Tu GIF ya está reducido a 256 colores y esa información de color no vuelve. El formato de vídeo admite color completo, pero como tu fuente tiene 256 colores el resultado también se verá con 256. Las bandas y las manchas se quedan tal cual.

La ganancia está en el tamaño del archivo, no en la calidad. Y esa ganancia suele ser enorme.

Además, si la conversión se hace a un códec de vídeo con pérdidas (H.264, VP9) habrá una pérdida adicional muy pequeña. Con un bitrate suficiente no se nota, sobre todo porque, al tener la fuente solo 256 colores, el trabajo del códec es fácil.

Paso 2: Elige el formato de destino

MP4 (H.264): la elección más segura. Lo admiten todos los navegadores, todos los dispositivos y todas las plataformas. Si tienes dudas, elige este.

WEBM (VP9): a igual calidad, alrededor de un 30 % más pequeño que el MP4. Lo admiten todos los navegadores modernos. Ideal si lo vas a usar en tu propia web.

El mejor enfoque es generar los dos y dejar que elija el navegador:

<video autoplay muted loop playsinline>
  <source src="animacion.webm" type="video/webm">
  <source src="animacion.mp4" type="video/mp4">
</video>

El navegador usa la primera fuente que admite: los modernos, WEBM; los antiguos, MP4.

Paso 3: Haz la conversión

Abre la herramienta de conversión de GIF a vídeo, sube tu GIF y elige el formato de destino. El proceso se ejecuta en tu navegador; tu archivo no viaja al servidor.

Durante la conversión se resuelven en segundo plano dos cuestiones técnicas:

La regla del número par. Códecs como H.264 guardan la información de color reducida a la mitad en horizontal y en vertical (submuestreo de croma 4:2:0). Eso exige que el ancho y el alto sean números pares. Como los GIF no tienen esa restricción, son frecuentes medidas como 401×267. El conversor suele arreglarlo recortando o añadiendo un píxel, una intervención que no se aprecia visualmente.

Normalización de la velocidad de fotogramas. En un GIF, cada fotograma tiene su propio tiempo de retardo, así que la velocidad puede variar fotograma a fotograma. El vídeo, en cambio, suele esperar una velocidad constante. El conversor elige una velocidad de destino y reparte los fotogramas según ella.

Si los retardos de origen son irregulares puede aparecer una ligera diferencia de temporización. En una animación crítica (por ejemplo, una demostración de interfaz) conviene comparar la salida con el original.

Paso 4: Comprueba el resultado

¿La duración es la misma? Durante la conversión de velocidad de fotogramas pueden aparecer pequeñas diferencias.

¿La velocidad del movimiento es correcta? Si tu GIF usa retardos irregulares, el vídeo se reproduce a velocidad constante y el ritmo puede cambiar. Si notas que va más lento o más rápido, cambia el ajuste de velocidad de fotogramas y prueba de nuevo.

¿Encajan el primer y el último fotograma? Como el GIF se reproducía en bucle, su principio y su final eran parecidos. Al poner el vídeo en bucle debe conservarse esa misma fluidez.

¿Hay deterioro visual? Si eliges un bitrate insuficiente pueden aparecer bloques en las zonas con movimiento. En vídeos procedentes de un GIF esto es raro porque la fuente ya es simple, pero compruébalo.

¿Cuánto has ganado en tamaño? Lo normal es una reducción de 5 a 10 veces. Si la reducción es pequeña, puede que hayas elegido un bitrate innecesariamente alto.

Paso 5: Úsalo correctamente en la web

Los atributos necesarios para que el vídeo se comporte como un GIF:

| Atributo | Función | |---|---| | autoplay | Se reproduce solo al abrirse la página | | muted | Sin sonido; sin esto los navegadores no permiten la reproducción automática | | loop | Bucle infinito | | playsinline | Impide el paso a pantalla completa en el móvil | | poster | La imagen que se muestra hasta que carga el vídeo |

El atributo muted es crítico: los navegadores bloquean la reproducción automática con sonido y sin muted el autoplay no funciona.

El playsinline también es obligatorio en móvil; sin él, Safari en iOS abre el vídeo a pantalla completa y se rompe el comportamiento tipo GIF.

Una nota sobre experiencia de usuario: los vídeos que se reproducen solos resultan molestos para algunas personas. En animaciones largas o que distraen, darle el control al usuario con el atributo controls puede ser mejor opción.

Cuándo conviene dejarlo como GIF

La conversión no es correcta en todos los escenarios:

Si lo vas a usar en un correo. Casi ningún cliente de correo reproduce vídeo. Ahí el GIF debe quedarse.

En sistemas de foro o wiki antiguos. Estos entornos suelen admitir solo etiquetas de imagen.

En las bibliotecas de GIF de las apps de mensajería. Algunas aplicaciones tratan el GIF de forma especial.

En archivos muy pequeños. La ganancia de convertir a vídeo un GIF de 100 KB puede no compensar la complejidad añadida.

Si necesitas fondo transparente. Los formatos de vídeo no admiten en la práctica la transparencia alfa. La del GIF es binaria (sí/no), pero al menos existe. Para una transparencia mejor, plantéate WEBP animado o APNG.

Conversión masiva

Si tienes muchos GIF en tu web, convertirlos todos supone una ganancia importante. El enfoque:

1. Haz un inventario. ¿Qué GIF se usan y dónde, y cuánto pesan?

2. Establece prioridades. Empieza por los archivos más grandes; la ganancia es proporcional.

3. Genera los dos formatos. La pareja WEBM + MP4 aporta eficiencia y compatibilidad.

4. Actualiza el HTML. Convierte las etiquetas <img src="x.gif"> en bloques <video>.

5. Guarda una copia. No borres los GIF enseguida; consérvalos un tiempo por si surge algún problema y hay que volver atrás.

En las mediciones de velocidad de página la diferencia suele verse de inmediato, sobre todo en conexiones móviles.

En resumen

La conversión de GIF a vídeo no mejora la calidad (el límite de 256 colores ya está aplicado), pero da una ganancia típica de diez veces en tamaño de archivo. El MP4 es el destino más seguro; si lo vas a usar en tu propia web, servirlo junto con WEBM da el mejor resultado. Durante la conversión se resuelven en segundo plano el redondeo de la resolución a números pares y la normalización de los retardos variables del GIF a una velocidad de fotogramas constante; esto último puede crear una ligera diferencia de temporización en animaciones críticas, así que revisa la salida. Para lograr el comportamiento de GIF en la web, usa los atributos autoplay muted loop playsinline. En el correo, en foros antiguos y cuando hace falta transparencia, dejar el GIF tal cual es la decisión correcta.