SVG (Scalable Vector Graphics)

SVG je formát souboru založený na jazyce XML, který slouží k popisu dvourozměrné vektorové grafiky. Na rozdíl od rastrových formátů (jako je TIFF (Tagged Image File Format) nebo JPEG), které jsou složeny z pixelů, SVG definuje obraz pomocí geometrických tvarů, cest, barev a textu.

V rámci naší digitální architektury je SVG preferovaným formátem pro loga, ikony a schémata díky své dokonalé ostrosti při jakémkoliv rozlišení a minimální datové náročnosti.

Klíčové výhody SVG

Nezávislost na rozlišení: Obraz lze libovolně zvětšovat (škálovat) bez ztráty kvality. To je ideální pro responzivní WWW (World Wide Web) stránky zobrazené na mobilech i 4K monitorech.
Editovatelnost: Jelikož jde o textový formát (XML), může náš Vývojový tým měnit barvy nebo tvary přímo v kódu aplikace nebo pomocí CSS.
Přístupnost (Accessibility): Text uvnitř SVG je prohledávatelný vyhledávači a čitelný pro asistivní technologie, což zlepšuje naše SEO (Search Engine Optimization).
Interaktivita a animace: SVG prvky mohou reagovat na akce uživatele (např. změna barvy při přejetí myší) pomocí JavaScriptu.

Technická struktura a integrace

SVG soubory jsou v podstatě textové dokumenty kódované v UTF (Unicode Transformation Format)-8. To umožňuje jejich verzování v systémech jako SVN (Apache Subversion) nebo Git stejně snadno jako u zdrojového kódu.

Příklad kódu SVG

<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>

Využití v systému [[Jira]]

Naše dashboardy v systému Jira využívají SVG pro generování dynamických grafů a diagramů, což šetří přenosové pásmo v naší síti WAN (Wide Area Network) ve srovnání s přenášením statických obrázků.

Bezpečnostní upozornění (SVG a [[Kybernetická bezpečnost|Security]])

Protože je SVG v podstatě XML dokument, může obsahovat skripty (JavaScript). To představuje určité riziko:

XSS (Cross-Site Scripting): Útočník může do SVG vložit škodlivý kód.
Pravidlo: Všechny SVG nahrané uživateli do našeho VPC (Virtual Private Cloud) musí projít sanitizací na bráně UTM (Unified Threat Management), aby se odstranily potenciálně nebezpečné značky `<script>`.

Porovnání: SVG vs. TIFF

Vlastnost	SVG	TIFF (Tagged Image File Format)
Typ	Vektorový	Rastrový
Změna velikosti	Bez ztráty kvality	Ztráta kvality (pixelace)
Velikost souboru	Malá (pro grafiku)	Velká (pro fotografie)
Použití	Ikony, Loga, WWW (World Wide Web)	Tisk, Archivace, Fotografie

Tip pro designéry: Před exportem SVG z grafického editoru vždy použijte nástroj pro minifikaci (např. SVGO). Odstraněním zbytečných metadat můžete zmenšit velikost souboru až o 60 %, což zrychlí načítání našich aplikací přes WAN (Wide Area Network).

— Související stránky: ZIF (Základní informační faktory), WWW (World Wide Web), TIFF (Tagged Image File Format), Vývojový tým, UTF (Unicode Transformation Format), SVN (Apache Subversion), Jira, WAN (Wide Area Network), Kybernetická bezpečnost, VPC (Virtual Private Cloud), UTM (Unified Threat Management)