Guía

Cómo optimizar un archivo SVG con redondeo de precisión

Aprende cómo optimizar un archivo SVG eliminando metadatos, comentarios y reduciendo la precisión numérica flotante para disminuir el peso sin perder calidad visual.

Herramienta Optimizador SVG

Optimizar un archivo SVG consiste en eliminar código redundante, limpiar metadatos de programas de diseño y acortar valores numéricos flotantes sin alterar la fidelidad visual de la ilustración vectorial. Aligerar el marcado reduce el tiempo de transferencia en la web y facilita la manipulación directa del código XML.

Qué elementos se limpian en un gráfico vectorial

Los programas de edición gráfica suelen incrustar comentarios internos, bloques <metadata> extensos y coordenadas con una precisión de punto flotante excesiva. Para aligerar el documento, puedes procesarlo directamente con el Optimizador SVG, que aplica tres técnicas de limpieza estructurada:

  1. Supresión de comentarios XML que no aportan valor visual.
  2. Eliminación de etiquetas de metadatos del editor de diseño.
  3. Redondeo de atributos numéricos sin unidades a un número controlado de decimales (entre 0 y 6).
  4. Compactación de espacios en blanco y saltos de línea innecesarios entre etiquetas.

Pasos para optimizar un archivo SVG

Sigue estos pasos prácticos para limpiar y comprimir tu gráfico vectorial:

  1. Comprueba el archivo de entrada: Asegúrate de que el documento esté codificado en UTF-8, tenga un elemento raíz <svg> válido y no supere los 2 MB de tamaño total.
  2. Configura las opciones de limpieza: Marca o desmarca las casillas para retirar comentarios y metadatos según las necesidades de tu proyecto. Ambas opciones vienen activadas por defecto.
  3. Establece la precisión numérica: Selecciona un valor entero de 0 a 6. El estándar de 2 decimales suele ofrecer un equilibrio óptimo entre ahorro de bytes y calidad visual de los trazados.
  4. Ejecuta la optimización: Procesa el contenido para obtener el marcado limpio y las métricas de bytes ahorrados.
  5. Descarga o integra el resultado: Copia el código optimizado o descárgalo para usarlo en tu aplicación web. Si más adelante necesitas rasterizar el gráfico para compatibilidad con plataformas antiguas, puedes usar el Conversor de SVG a PNG.

Ejemplo práctico de reducción de tamaño

Imagina un icono vectorial exportado desde una aplicación de interfaz gráfica. El archivo original contiene bloques de autoría, comentarios de exportación y coordenadas con 6 decimales, ocupando 1.450 bytes. Al procesarlo conservando la precisión en 2 decimales y retirando comentarios y metadatos, el tamaño se reduce a 620 bytes, logrando más del 57 % de ahorro sin deformar curvas ni perder atributos de estilo.

Límites del proceso y seguridad en SVG

Es importante tener claras las restricciones técnicas de esta herramienta:

  • No es un desinfectante de seguridad: Los scripts, enlaces interactivos y controladores de eventos fuera de metadatos o comentarios permanecen en el archivo. No utilices la herramienta como sustituto de un filtro de seguridad contra ataques XSS.
  • Límite de tamaño estricto: El documento SVG no puede superar los 2 MB de tamaño decodificado.
  • Rechazo de DTD y entidades: Cualquier archivo con declaraciones DOCTYPE o entidades externas es rechazado para prevenir problemas de análisis XML.
  • Valores con unidades explícitas: Las dimensiones o propiedades numéricas que contienen sufijos de unidad (como px, em o %) no se redondean automáticamente.

Errores comunes al procesar archivos SVG

  • Usar una precisión decimal de 0 en trazados detallados: Redondear a cero decimales en curvas complejas puede provocar distorsiones visibles en esquinas y trazados cerrados.
  • Subir archivos que no sean XML válido: Fragmentos incompletos o SVG sin etiqueta de cierre causarán errores de procesamiento.
  • Olvidar revisar el resultado visualmente: Comprueba siempre en el navegador que el gráfico mantiene sus proporciones tras el redondeo de coordenadas.

Preguntas frecuentes sobre optimización de SVG

¿Qué formato debe tener el SVG de entrada?

Debe ser un archivo de texto XML válido codificado en UTF-8 o una cadena Base64 válida con elemento raíz SVG y un tamaño máximo de 2 MB.

¿Puedo conservar los metadatos y comentarios?

Sí. Puedes desmarcar las casillas de eliminación de comentarios o de metadatos de forma independiente si necesitas conservar información de autoría.

¿El archivo resultante siempre pesará menos?

En la gran mayoría de los casos sí, especialmente si contiene metadatos o muchos decimales. Sin embargo, en archivos ya minificados el ahorro puede ser mínimo.

Herramienta

Optimizador SVG