====== 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]]** nebo JPEG), které jsou složeny z pixelů, SVG definuje obraz pomocí geometrických tvarů, cest, barev a textu.

V rámci naší **[[ZIF|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]]** 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]]**.
  * **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]]-8**. To umožňuje jejich verzování v systémech jako **[[SVN]]** nebo Git stejně snadno jako u zdrojového kódu.

==== Příklad kódu SVG ====
<code>
<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" />
</svg>
</code>

==== 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]]** 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]]** musí projít sanitizací na bráně **[[UTM]]**, aby se odstranily potenciálně nebezpečné značky `<script>`.



===== Porovnání: SVG vs. TIFF =====

^ Vlastnost ^ SVG ^ [[TIFF]] ^
| **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]]** | 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]]**.

---
**Související stránky:** [[ZIF]], [[WWW]], [[TIFF]], [[Vývojový tým]], [[UTF]], [[SVN]], [[Jira]], [[WAN]], [[Kybernetická bezpečnost]], [[VPC]], [[UTM]]