Tworząc obrazki SVG, bardzo często zdarza się, że programy graficzne zapisują nadmiarowe informacje do takich obrazków.

Informacje te nie tylko zwiększają niepotrzebnie wielkość tych plików, ale także potrafią popsuć stronę internetową na którą takie obrazki zostaną wgrane.

Posłużymy się przykładem obrazka utworzonego w programie CorelDRAW X5

Pierwszy i ostatni zaznaczony prostokąt, to dane opisowe programu, które zwiększają rozmiar pliku.

Drugi zaznaczony prostokąt, zawiera dołączone style do kolorowania obrazka. Należy je BEZWZGLĘDNIE usunąć ponieważ mogą nadpisywać style strony WWW.

Trzecie zaznaczony prostokąt zawiera atrybut ID, który będzie problemem jeżeli taki obrazek zostanie wyświetlony co najmniej dwukrotnie na stronie. Ponieważ atrybuty ID muszą być unikalne na stronach WWW.

Wszystkie zaznaczone dane możemy usunąć ręcznie, edytując plik SVG np. w notatniku,

lub skorzystać ze strony, która zrobi to za nas i pozwoli od razu zobaczyć efekt końcowy np:

https://jakearchibald.github.io/svgomg/

Optymalizacja SVG za pomocą strony SVG-OMG

1. Otwieramy stronę programu - https://jakearchibald.github.io/svgomg/
2. Otwieramy plik SVG
   
3. Sprawdzamy domyślne ustawienia:
   
4. Program załaduje plik SVG i włączy zapamiętane ustawienia. Należy BEZWZGLĘDNIE ODZNACZYĆ  opcję ‘Remove viewBox’
   
5. Jeżeli zobaczymy, że po optymalizacji obraz w pliku SVG się zmienił, należy odznaczyć opcję ‘Round/rewrite paths’
   
6. Jeżeli po wykonaniu powyższych czynność obrazek wyświetla się prawidłowo w podglądzie, możemy go zapisać używając ikony znajdującej się w prawym dolnym rogu okna podglądu pliku.
   
   
   Tak przygotowany plik nie sprawi nam kłopotu na stronie WWW.