Preserve the coordinate system
The viewBox defines how an SVG scales into different layout sizes. Removing it can make a graphic behave like a fixed-size image or crop unexpectedly. Width and height attributes may be changed for a specific component, but the viewBox should normally remain intact.
After optimization, test the file at more than one CSS size. Fine strokes, filters and clipping paths can expose problems that are not visible in a single large preview.
Remove data with a clear purpose
Editor comments, generator metadata, hidden layers and excessive decimal precision often add bytes without affecting the rendered image. Removing them is usually safe for a static asset and makes the source easier to inspect.
IDs, classes and data attributes may be required by CSS, JavaScript, masks, gradients or animation. If another file targets the SVG internals, review the optimized markup before replacing the original.
- Keep viewBox unless you have tested a fixed-size replacement
- Check gradients, masks, filters and clip paths
- Preserve IDs used by CSS or scripts
- Compare the final file at its real display size
Handle accessibility in the final page
An SVG used as a normal image should receive useful alternative text from the surrounding HTML when it conveys information. Decorative graphics should be hidden from assistive technology instead of repeating nearby text.
Keep the unoptimized source in version control or a design archive. The optimized file is a delivery asset and may intentionally discard editor information needed for future revisions.