Problemas de exportación
¿Por qué se recorta mi logotipo SVG? Revisa los límites antes de cambiar el diseño
Un borde que desaparece no siempre indica un fallo de exportación. Identifica qué límite lo oculta antes de ampliar o redibujar el logotipo.
La respuesta breve
Compara el SVG exportado por separado con ese mismo archivo colocado en su destino. Si se recorta en ambos casos, revisa el área de exportación, la ventana SVG, los recortes y los efectos. Si se ve completo solo pero se recorta en una web, investiga primero esa colocación. Aumentar el tamaño de visualización no recupera el dibujo que falta.
1. Compara el mismo archivo en dos lugares
Conserva el original aprobado y trabaja sobre una copia. Abre el SVG exportado directamente en un navegador y coloca ese mismo archivo en la página o aplicación de destino. Usa un fondo de contraste si el logotipo tiene partes blancas. Compara el símbolo, las letras y los detalles exteriores, no solo la silueta general.
Si el archivo independiente está completo, pide a quien lo integre que revise el contenedor de la imagen, las dimensiones fijas, las opciones de recorte y los elementos que lo rodean. Envía el SVG original y una captura que muestre la diferencia. No redibujes la marca para compensar un espacio web mal recortado.
Si ambas vistas pierden el mismo borde, empieza por el archivo exportado y su documento de origen. Cambia una sola opción cada vez y guarda una copia de comparación. Así sabrás qué modificación resolvió el problema y evitarás aceptar por accidente un logotipo distinto.
| Síntoma | Primera comprobación |
|---|---|
| Completo por separado, recortado en la web | Contenedor de destino y sus reglas de recorte |
| Corte justo en un borde rectangular exterior | Mesa de trabajo, ventana y relación con viewBox |
| Falta una forma dentro de unos límites completos | Trazado de recorte, máscara u objeto ausente |
| Solo se corta una sombra o desenfoque | Región del efecto además de los límites exteriores |
2. Distingue las coordenadas del dibujo y su área de visualización
El atributo viewBox describe un rectángulo mediante cuatro números: x mínima, y mínima, anchura y altura. Ese rectángulo relaciona las coordenadas del dibujo con la ventana de visualización. No es simplemente una opción de resolución. Cambiar solo la anchura CSS de la imagen amplía o reduce la misma correspondencia.
Por ejemplo, una marca rectangular puede estar diseñada para ocupar de x = 0 a 100 y de y = 0 a 40. Un viewBox que solo cubra de x = 0 a 90 no describe toda el área prevista. Corrige la exportación desde el original o pide a alguien que conozca SVG que ajuste los límites para incluir el dibujo aprobado.
Comprueba toda la extensión visible, no solo el trazado central. Los trazos, los marcadores y los efectos pueden sobrepasar la geometría seleccionada. No apliques un margen universal arbitrario: demasiado espacio adicional hará que el logotipo parezca pequeño al colocarlo con una anchura fija.
Más información: MDN: coordenadas de viewBox · MDN: overflow y recorte de la ventana SVG
3. Revisa el área de exportación en Illustrator
Si el archivo procede de Illustrator, vuelve al documento AI original. Comprueba qué mesa de trabajo o selección se exportó y si sus bordes incluyen la marca aprobada completa. Busca elementos vecinos que no deban formar parte de este archivo de entrega.
Adobe distingue la exportación SVG basada en mesas de trabajo de la basada en los límites de los objetos: con Use Artboards, las mesas determinan las áreas exportadas; sin esa opción, la ventana se define por los límites combinados de los objetos. Elige de forma consciente. Un archivo ajustado al dibujo y otro con margen para colocarlo son entregables diferentes.
Tras corregir el área, vuelve a exportar desde el AI. Adobe recomienda editar ese original en lugar de convertir el SVG exportado en el nuevo documento maestro. No encadenes importaciones y guardados hasta que la vista previa parezca correcta por casualidad.
Más información: Adobe: exportación SVG y Use Artboards
4. Inspecciona los recortes y los efectos por separado
Un trazado de recorte puede ocultar parte del dibujo aunque los límites exteriores del SVG sean amplios. Revisa los grupos de recorte en una copia del original. Desactivar temporalmente el recorte correspondiente puede ayudar a localizar la causa, pero no elimines todos: algunos son esenciales para el diseño aprobado.
Un filtro también tiene una región definida. Un desenfoque o una sombra pueden extenderse fuera del objeto, así que revisa la región del filtro y su sistema de coordenadas cuando solo se corte el efecto. Ampliar el lienzo exterior no siempre corrige una región interna de filtro más pequeña.
La misma precaución se aplica a una máscara o a una ilustración recortada intencionadamente dentro de la marca. Identifica el límite responsable, conserva la construcción deliberada y compara cualquier corrección con la referencia aprobada. Usar overflow visible no basta como estrategia de entrega: la maquetación de destino puede seguir recortando el resultado.
Más información: MDN: trazados de recorte · MDN: regiones de filtro · MDN: coordenadas de los filtros
5. Prueba la corrección sin cambiar la marca
Revisa la exportación corregida tanto al tamaño previsto como ampliada. La vista grande ayuda a detectar una curva cortada; la pequeña permite comprobar si la colocación funciona. Compara proporciones, espaciado, aspecto del trazo y margen aprobado.
Prueba de nuevo el destino real. Diferencia los nombres del archivo original y del corregido, y pide al destinatario que sustituya el recurso antiguo en lugar de limitarse a ver una captura del arreglo. Si el error solo persiste en una aplicación, documenta esa limitación en vez de prometer compatibilidad universal.
El SVG anterior cortaba el trazo inferior en el límite de exportación. Este reemplazo se ha exportado desde el original aprobado y comprobado en el navegador y en la cabecera de destino. El dibujo no ha cambiado; utiliza el nuevo SVG en lugar del adjunto anterior.
6. Organiza los archivos una vez corregidos
Cuando el SVG de origen sea correcto, logopack.app puede ayudarte a organizar el paquete de entrega. Revisa también los archivos de salida elegidos: un original correcto es el punto de partida, no un sustituto de la comprobación de cada resultado.
Con una cuenta gratuita puedes probar la demostración incluida mientras su dibujo SVG permanezca sin cambios. Exportar tu propio diseño requiere un plan de pago. Revisa los planes actuales antes de exportar y conserva los archivos específicos preparados para cada proveedor.
Más información: Abrir el generador · Ver los planes actuales
Antes de enviar el reemplazo
- El mismo SVG se ha probado por separado y en su destino.
- El límite responsable se ha identificado, no supuesto.
- El símbolo, las letras, los trazos y los efectos aprobados están completos.
- No se ha eliminado ningún recorte o máscara intencionado sin revisarlo.
- El reemplazo coincide con el dibujo y el espaciado aprobados.
- El destinatario sabe qué archivo sustituye al anterior.
PONLO EN PRÁCTICA
¿Todo listo para preparar tu paquete?
logopack.app convierte tus diseños SVG en un paquete de logotipos organizado. Previsualiza los archivos, elige entre las opciones de exportación disponibles y revisa el resultado antes de entregarlo.
Empieza con el generador de paquetes de logotipos, explora el ZIP de ejemplo o compara los planes actuales.
Abrir generador