Respuesta rápida: Comprimir SVG para web recorta entre un 10 % y un 80 % del peso del archivo sin cambiar ni un píxel. Ábrelo en la herramienta de arriba, suéltalo y descarga la versión ligera — todo en tu navegador. Menos bytes significa una carga de página más rápida y mejores Core Web Vitals (LCP), algo que Google premia en el ranking móvil.
Un SVG de 120 KB suele bajar a 20–30 KB solo con minificar y eliminar metadatos; el visitante no nota la diferencia, pero la página pesa la mitad.
Por qué comprimir SVG para la web
El SVG es un archivo de texto (XML), no una imagen rasterizada. Eso es bueno — es escalable y nítido a cualquier tamaño — pero también significa que arrastra todo el « equipaje » de la herramienta con la que se creó: metadatos de Adobe Illustrator o Figma, comentarios, espacios de nombres del editor, coordenadas con seis decimales y grupos vacíos. En la web, ese equipaje es peso muerto.
Para un sitio con decenas de iconos por página, esos bytes se suman. Comprimir el SVG es la forma más barata de recortar el peso de la página sin tocar el servidor ni cambiar el diseño.
Cómo comprimir un SVG para web (paso a paso)
Paso 1. Abre el Compresor de SVG en línea de arriba. Es gratis y no requiere registro.
Paso 2. Haz clic en « Abrir SVG » y suelta tu archivo. También puedes pegar el marcado SVG directamente con « Pegar marcado ».
Paso 3. En « Configuración global », activa eliminar metadatos y redondea las coordenadas: 1 decimal para iconos, 2 decimales para ilustraciones. Fusiona las rutas adyacentes con el mismo relleno.
Paso 4. Haz clic en « Soltar » para descarga el SVG comprimido. Compruébalo en tu página: el aspecto debe ser idéntico.
Paso 5 (opcional). Si vas a incrustarlo en HTML, usa « Copiar como texto » para copiar el código ya minificado.
Ajustes recomendados según el caso web
No hay un « tamaño perfecto » universal; depende de lo que estés publicando. Estas son las reglas que mejor funcionan en la práctica:
- Iconos e interfaces: 1 decimal, eliminar metadatos + declaración XML. Objetivo 1–5 KB.
- Logotipos y gráficos de marketing: 1 decimal, fusionar rutas. Objetivo 15–50 KB.
- Ilustraciones detalladas: 2 decimales, conservar fidelidad visual. Objetivo 50–250 KB.
- SVG inline en HTML: igual que iconos, pero quita la declaración XML (el navegador la ignora y son bytes de más).
SVG inline frente a archivo externo (un truco)
Para iconos pequeños, incrustar el SVG directamente en el HTML (inline) elimina una petición HTTP y acelera la pintura de la página. Pero hazlo solo después de comprimir: un SVG inline sin minificar puede ser más grande que la propia página. Regla sencilla: comprime primero, incrusta después.
Si el SVG se usa muchas veces (por ejemplo, el mismo icono de lupa en diez sitios), mejor mantenlo como archivo externo y cacheable; el navegador lo descarga una vez y lo reutiliza.
Errores comunes al comprimir para web
- Dejar la declaración XML en un SVG inline: el navegador la ignora, así que son bytes que viajan de más en cada página.
- Redondear a 1 decimal en ilustraciones detalladas: borra detalle fino; usa 2 decimales para ese tipo de arte.
- Eliminar ID que usa tu CSS o JavaScript: si animas o estilizas el SVG desde fuera, pon en lista blanca los ID que necesitas o la animación se romperá.
- Olvidar las imágenes raster incrustadas: un JPEG dentro del SVG no se reoptimiza solo; comprimelo aparte primero.
SVG ligero y Core Web Vitals
Google usa la velocidad de carga como señal de ranking, y el LCP (el elemento más grande visible) se ve penalizado por archivos pesados. Los SVG ocupan a menudo el papel de logotipo, icono de cabecera o ilustración principal — justo lo que el LCP mide. Comprimir esos SVG es uno de los cambios más rápidos para subir la nota de rendimiento de una página.
Empieza por el logotipo y los iconos de la cabecera: suelen ser los SVG más grandes y los más fáciles de recortar a la mitad. Luego repasa las ilustraciones de las entradas del blog. Con el Compresor de SVG en línea el proceso es de segundos y totalmente privado: tus archivos nunca salen de tu navegador.
Abre el compresor y reduce tu SVG para web ahora
Preguntas frecuentes
Respuestas rápidas sobre cómo comprimir SVG para la web.
¿Comprimir SVG mejora la velocidad de la web?
Sí. Menos bytes significa una descarga y un parseo más rápidos del navegador, lo que mejora la métrica LCP (Largest Contentful Paint). En páginas con muchos iconos SVG, el ahorro se suma y la carga percibida es claramente más rápida.
¿El SVG comprimido se ve igual que el original?
Sí. La compresión es sin pérdida a nivel de píxel: solo se eliminan datos que el navegador ignora al renderizar (metadatos, comentarios, coordenadas redundantes), así que la imagen visible es idéntica al original.
¿Puedo incrustar el SVG comprimido directamente en HTML?
Sí. Quita la declaración XML y pégalo dentro de tu HTML. Para iconos pequeños esto elimina una petición HTTP extra y acelera la pintura de la página.
¿Comprimir SVG ayuda al SEO?
De forma indirecta. La velocidad de página es una señal de ranking de Google, así que unos SVG ligeros contribuyen a una web más rápida y mejor posicionada en búsquedas.
¿Qué pasa si mi SVG tiene imágenes raster incrustadas?
El compresor de SVG no reoptimiza JPEG ni PNG internos. Comprime esas imágenes por separado primero y luego vuelve a pasar el SVG por la herramienta para eliminar el equipaje de texto sobrante.
¿Es gratis y privado?
Sí. El Compresor de SVG en línea funciona en tu navegador, es gratis y no sube tus archivos a ningún servidor: todo el proceso ocurre en tu dispositivo.