Samme logo er måske kun 24 pixels højt i en navigationsbjælke, men skal blæses op til to meters bredde på en messebagvæg. Valget mellem PNG og SVG begynder med, hvilken type scene filen skal ind i: På websider og i produktbrugerflader er SVG førstevalget – logoet er registreret som kurver og tegnes af softwaren igen i enhver størrelse. Uploadindgange, der kun tager imod bitmap (avatarer på sociale medier, visse Office-dokumenter), skal have en gennemsigtig PNG. Plakater, skilte og tryksager bruger SVG eller en vectorfil eksporteret fra den, så intet sløres ved forstørrelse. Har du kun en PNG ved hånden, behøver du ikke kassere alt og begynde forfra – fastslå formatet for scenen, og supplér det, der mangler.
Hovedpointer
- Til websider, brugerflader og situationer med gentagen skalering og omfarvning: brug SVG. Grafikken er registreret som kurver, tegnes igen ved forstørrelse, og kanterne forbliver skarpe.
- Til indgange, der kun accepterer bitmap (avatarer på sociale medier, visse kontorprogrammer): brug en gennemsigtig PNG – kræv ikke, at platformen understøtter SVG.
- Grafiske logoer og ordmærker fortjener en SVG-hovedfil; fotografiske maskotter og brandbilleder med komplekse teksturer bevares bedst som højopløst PNG.
- SVG er ikke nødvendigvis mindre end PNG: Filstørrelsen afhænger af grafikkens kompleksitet – vælg efter anvendelse, ikke efter volumen.
Start valget i tre anvendelsesscenarier
De tre hyppigste afleveringsopgaver dækker næsten alle steder, en logofil ender.
Navigationslogo på websider. Logoet i topbjælken, sidefoden og mobilvisningen vises i forskellige størrelser og skærmtætheder. SVG passer bedst her: Browseren tegner kurverne i realtid, så alt fra lille ikonbredde til stor banner i sidefoden forbliver skarpt; skal farven ændres, gøres det direkte i filen eller koden, og samme fil kan uændret gives videre til en designer.
Avatar på sociale medier i lille størrelse. Avatar-upload accepterer typisk kun JPG og PNG, så en PNG med gennemsigtig baggrund er rigeligt: Når platformen besærer avataren til cirkel eller kvadrat, kommer der ikke en hvid firkant rundt om logoet. Avataren vises i begrænset størrelse, og bitmapopløsningen er mere end nok – scenarioet kræver ikke SVG.
Plakater og tryksager i stort format. Plakater, roll-ups og butiksskilte forstørrer logoet mange gange. SVG løser skaleringen ved roden: Kurverne er uafhængige af opløsning, og outputstørrelsen afgøres af anvendelsen. Har du kun en lille PNG, giver direkte forstørrelse slør og takkede kanter – det er netop her, en vectorfil er nødvendig.
Hvor forskellene mellem PNG og SVG viser sig
Den grundlæggende forskel er måden, grafikken registreres på. PNG bruger et pixelgitter: Hvert punkt gemmer én farve, filen har et fast antal pixels uanset størrelse, og forstørres den ud over det oprindelige pixelantal, kan softwaren kun trække de eksisterende pixels fra hinanden – kanterne bliver slørede og takkede. SVG beskriver grafikken med kurver og former: hvor linjen begynder, hvordan kurven bøjer, og hvilken farve området fyldes med; ved forstørrelse tegner softwaren grafikken igen efter beskrivelserne, og kanterne forbliver glatte.
Gennemsigtig baggrund understøtter begge formater, blot på forskellige måder. PNG bevarer hullerne omkring logoet med en transparenskanal; SVG har af natur ingen „bund“ – grafikken er selv blot en mængde kurver. Den største skillelinje er den senere redigering: En SVG kan åbnes og helt omfarves, kurvepunkter justeres og former deles og sættes sammen igen; en PNG kan kun bearbejdes pixel for pixel, og allerede én ny farve kræver lapning af områder i et bitmapprogram.
Filstørrelsen misforstås ofte. For enkel grafik skal SVG kun gemme få kurver og er typisk lille; en bitmap med rige farveovergange og synlig støj bliver ved vektorisering opløst i en mængde fragmenterede kurver og kan blive langt større end den oprindelige PNG. „SVG er mindre“ holder ikke – det, der holder, er „SVG for enkel grafik er lille“.
En tabel over scenarier og formatvalg
Materialets type bestemmer valget mere end formatparametre. Her er anbefalinger for tre almindelige typer brandgrafik:
| Materialetype | Grafiske træk | Anbefaling | Begrundelse |
|---|---|---|---|
| Grafisk logo, ordmærke | Skarpe konturer, få farvefelter | Forbered en SVG-hovedfil og gem desuden en gennemsigtig PNG | Rengjorte, redigerbare kurver; SVG dækker skalering, PNG fallback til steder uden SVG |
| Fotografisk maskot | Fortløbende farveovergange, rige skygger | Behold højopløst PNG | Vektorisering opløser den i fragmenterede kurver, der er svære at redigere, og den frie skalering med få kurver går tabt |
| Brandbillede med kompleks tekstur | Mange detaljer, tydelig kornethed | Primært bitmap, vektorisér delvist efter behov | En hel konvertering betaler sig sjældent; ved behov for større formater gen-eksportérrs en bitmap i højere opløsning først |
Én tommelfingerregel rækker: Jo skarpere konturerne og jo færre farvefelter, desto mere er det værd at vektorisere; jo tættere billedet er på et fotografi, desto bedre er det at lade det forblive bitmap.
Sådan skaffer du en SVG, når du kun har en PNG
Når behovet for SVG er fastslået, fylder selve konverteringen kun en lille del af arbejdet. Upload PNG-filen med Billede-til-vektor: Værktøjet tager imod PNG, JPG og WebP med bredde og højde på mindst 256 pixels; efter login konverteres ét billede ad gangen, og SVG-filen downloades, når det er færdigt. Skærmbilleder af upload, kontrol og download gennemgås trin for trin i den tilhørende artikel „Sådan konverterer du PNG og JPG til SVG“ – den gentages ikke her.
Efter konverteringen skal resultatet ordnes efter anvendelse. Resultatpanelet tilbyder forstørrelse i 1×, 2× og 4×; læg før aflevering mærke til, om kurver, udskæringer og tynde linjer er rene. To ting skal du indstille dig på fra starten: Tekst bliver til konturkurver – konverteringen gendanner ikke en redigerbar originalfont, og ændret tekst skal tastes ind igen i et designværktøj. Og kantkvaliteten bestemmes af originalbilledet: En stærkt komprimeret PNG giver ru kanter, så skift til et skarpere originalbillede før konvertering; metoderne til at rense den slags originaler op gennemgås særskilt i „Hvad gør jeg ved ru kanter, når et logo er blevet vektoriseret“.
Sådan samler du en brandfil-pakke
Når formatet står fast, samles logoet i en gruppe navngivne filer, så ingen modtager behøver at bede om mere frem og tilbage. En minimal, brugbar pakke ser sådan ud:
| Fil | Anvendelse | Eksempel på navn |
|---|---|---|
| SVG-hovedfil | Eneste kildefil til websider, materialer, forstørrelse og senere redigering | acme-logo.svg |
| Gennemsigtig PNG | Avatarer på sociale medier, kontordokumenter m.m., hvor kun bitmap accepteres | acme-logo-transparent.png |
| Forhåndsvisning på mørk bund | Kontrollerer logoets læsbarhed på mørk baggrund | acme-logo-preview-dark.png |
| Forhåndsvisning på lys bund | Kontrollerer logoets udtryk på lys baggrund | acme-logo-preview-light.png |
Brug et ensartet præfiks plus et anvendelsessuffiks i navnene, og opdatér versionsnummeret ved ændringer i stedet for at kopiere til nye navne – ellers ender pakken før eller siden med både logo-final-2.png og logo-endelig-udgave.png side om side. Forhåndsvisningerne på lys og mørk bund lægges bedst i samme mappe, så modtageren med ét blik kan bekræfte, at logoet virker på begge baggrunde.
Trykkeriets filer behandles særskilt. Kræver trykkeriet en vektor-PDF, en bestemt farvetilstand eller beskæring, laves produktionsfilerne i den tilhørende designproces: Med SVG som kilde fuldføres konvertering og eksport i designsoftwaren, og farvestandarderne bekræftes punkt for punkt med trykkeriet. Billede-til-vektor-værktøjet leverer en SVG-fil – ikke trykte produktionsfiler.
Ofte stillede spørgsmål
Er SVG altid mindre end PNG?
Nej, filstørrelsen afhænger af indholdets kompleksitet. SVG for enkel grafik gemmer kun få kurver og er typisk lille; bitmaps med rige overgange, skygger og støj bliver ved vektorisering til mange fragmenterede kurver og kan ende med at være større. Vælg format efter anvendelse og skaléringsbehov – ikke efter volumen.
PNG sløres ved forstørrelse – skal den altid gøres til vektor?
Se på, hvad logoet skal bruges til fremover. Skal det kun sjældent forstørres én gang, er en gen-eksporteret PNG i højere opløsning nok; først ved gentagen skalering, samlet omfarvning, tryk eller som langvarig brandhovedfil er en SVG pengene værd. Fotografiske logoer giver ved konvertering kun svært redigerbare fragmentkurver – der er en højopløst bitmap mere praktisk.
Hvad gør jeg, når trykkeriet vil have PDF?
Følg trykkeriets konkrete krav i den tilhørende designproces: Placér SVG-hovedfilen i designsoftwaren, eksportér den til den påkrævede PDF-type, og bekræft farvetilstand og beskæring punkt for punkt med trykkeriet. Billede-til-vektor-værktøjet leverer en SVG-fil; trykkets produktions-PDF laves i designfasen.
Kun en PNG i hånden? Skaf først en SVG
Begynd med det, der mangler i pakken: Findes kun en PNG-version, skaffer du først en SVG med Billede-til-vektor, kontrollerer den i forhåndsvisningerne på lys og mørk bund og beslutter derefter, om den kan være hovedfil. Derefter har websiden, avataren og plakaten alle fået filer i det rette format.
