SVG vs PNG pro loga: který formát použít (a kdy)

Jaký je rozdíl mezi SVG a PNG?

Rozdíl je vektor vs rastr. SVG (Scalable Vector Graphics) popisuje logo jako tvary — body, křivky a výplně — definované matematikou. Překresluje se v jakékoli velikosti, ve které se objeví, takže zůstává všude ostré. Jako kód je navíc pro čistou geometrii většiny log maličké, často jen pár kilobajtů.

PNG (Portable Network Graphics) je rastr: pevná mřížka pixelů s danou šířkou a výškou. Podporuje průhlednost, takže logo čistě sedí na jakékoli barvě — ale zobrazené větší, než bylo vyexportováno, se pixely roztáhnou a okraje změknou.

Kdy použít SVG?

Udělejte ze SVG svůj master a výchozí formát pro cokoli na obrazovce:

• Weby a webové aplikace — logo v hlavičce, patičce a hero. Moderní prohlížeče vykreslí SVG dokonale ostré na každé obrazovce, včetně retina a 4K.
• Kdekoli musí logo škálovat — responzivní rozvržení a displeje s vysokou hustotou.
• Jako jediný zdroj, ze kterého exportujete vše ostatní.
• Favicony, protože moderní prohlížeče SVG faviconu přijmou.

Kdy použít PNG?

PNG použijte, když potřebujete rastr pevné velikosti nebo místo, které SVG nevezme:

• Profilové obrázky a titulní fotky sociálních sítí — většina platforem přijme jen rastrové nahrání, tak vyexportujte čtvercové PNG ve velikosti, kterou každá doporučuje.
• Některé e-mailové klienty a nástroje na podpisy, které SVG spolehlivě nevykreslí.
• Dokumenty, prezentace a tržiště, které berou jen rastrové obrázky.
• Rychlé náhledy a miniatury.

SVG vs PNG v přehledu

A co EPS, PDF, AI — a JPG?

SVG a PNG pokryjí web, ale kompletní balík loga obvykle obsahuje pár dalších:

• PDF — vektorový formát, který přijme téměř každá tiskárna i kancelářský nástroj. Nejbezpečnější soubor pro tiskárnu.
• EPS — starší vektorový formát, o který některé tiskárny stále žádají. Ber ho jako tiskový kompatibilní export, ne jako něco na denní použití.
• AI (Adobe Illustrator) — pracovní/zdrojový soubor. Pokud logo dělal designér, nech si AI (nebo SVG) archivované jako editovatelný originál.
• JPG — pro loga se mu vyhni. JPG nemá průhlednost, takže kolem značky vynutí barevný box, a jeho komprese je ztrátová, což rozmaže ostré okraje. Je stavěný na fotky, ne na loga.

Dá se PNG převést zpět na SVG?

Ne čistě. Převod PNG na SVG znamená trasování pixelů do tvarů, které zřídka odpovídá originálu a často vytvoří zamotané cesty. Pokud máte SVG, vždy začněte tam. Pokud máte jen PNG v nízkém rozlišení, obvykle je lepší značku znovu postavit jako vektor než ji automaticky trasovat.

A co favicony a ikony aplikací?

Favicona je jen velmi malá verze vašeho loga, takže ji exportujte ze SVG: SVG faviconu pro moderní prohlížeče plus malá PNG (třeba 32×32 a 180×180 Apple touch icon) pro širokou kompatibilitu. Totéž platí pro ikony aplikací — vygenerujte velikosti, o které si každá platforma řekne, z vektorového masteru. Viz jak vytvořit faviconu z loga.

Krátká odpověď

Navrhněte a uložte logo jako SVG, používejte ho na webu, exportujte PNG pro rastrová umístění pevné velikosti, tiskárnám dejte PDF nebo EPS a JPG úplně vynechte. Když si necháte vektorový master, můžete jakoukoli velikost či formát vyrobit později bez ztráty kvality.

Vytvořte logo a exportujte SVG, PNG a faviconu — zdarma

Časté dotazy

Je SVG pro loga lepší než PNG?

Pro logo obvykle ano: SVG je vektor, takže zůstane ostré v jakékoli velikosti a je pro jednoduché značky maličké. PNG se pořád hodí pro rastrová umístění pevné velikosti, jako avatary a nástroje, které SVG neumí.

Ztrácí SVG logo kvalitu při zvětšení?

Ne. SVG popisuje tvary matematikou, takže se ostře překresluje v jakékoli velikosti — od favicony po billboard — bez rozmazání nebo pixelizace.

Proč vypadá moje PNG logo rozmazaně?

PNG má pevnou pixelovou velikost. Zobrazení větší, než bylo vyexportováno, nebo na displeji s vysokou hustotou pixely roztáhne a změkčí okraje. Vyexportujte větší PNG, nebo použijte SVG.

Který formát dám tiskárně?

Vektorový soubor — obvykle PDF (nebo EPS, pokud si o něj řeknou) — aby ho tiskárna čistě zvětšila na libovolnou velikost. SVG si nechte jako master, ze kterého je generujete.