En god eksport begynder der, hvor billedet skal bruges. Denne guide forklarer, hvordan du vælger en skala, klargør din SVG og tjekker PNG'en, før du bruger den.
1. Start med destinationen
Før du konverterer, skal du tjekke de pixeldimensioner, der anmodes om af det websted, dokument, e-mail-system eller designprogram, der skal modtage billedet. Dette værktøj skalerer SVG'ens gengivne dimensioner med en valgt multiplikator; det tilbyder ikke tilpassede felter for bredde og højde. Hvis en platform anmoder om en bredde på 1200 pixels, kan du sammenligne det mål med SVG'ens viste bredde og vælge en multiplikator, der kommer tæt på uden at skabe en unødvendig stor fil.
2. Forstå skalafaktorerne
Valgene er 1x, 2x, 3x, 4x og 8x. En multiplikator påvirker både bredde og højde: en kilde på 200 × 100 gengivet ved 2x bliver til 400 × 200 pixels. Pixelantallet vokser med kvadratet på multiplikatoren, så 8x producerer 64 gange så mange pixels som 1x. Større uddata kan bruge væsentligt mere hukommelse og ser måske ikke bedre ud, når den oprindelige kunst eller måldisplayet ikke har brug for det.
3. Vælg en faktor til skærme
Til standard grænsefladegrafik er 1x eller 2x ofte et praktisk udgangspunkt; 2x kan hjælpe på skærme med høj tæthed, når mållayoutet skalerer billedet ned. Vælg 3x eller 4x kun når designet har brug for de ekstra pixeldimensioner. Brug 8x selektivt, fordi meget store lerreter kan tage længere tid at gengive eller overskride browsergrænser.
4. Beslut om baggrunden skal være gennemsigtig
Vælg Gennemsigtig, når PNG'en skal placeres over en farvet side, en præsentation eller et andet billede. Vælg Hvid, når destinationen forventer et hvidt rektangel, eller når en ensfarvet baggrund gør kunsten lettere at inspicere. PNG understøtter gennemsigtighed, men en målapplication kan vise gennemsigtige pixels over et skakbrætmønster eller flade dem ud, når du indsætter billedet.
5. Forbered SVG'en før eksport
Åbn kilden i et vektoreditor og tjek, at den har en fornuftig viewBox og synlig kunst inde i den viewBox. Konverter eller indlejre skrifttyper, hvis designet skal se identisk ud på enheder, der mangler disse skrifttyper. Hold tilknyttede billeder og eksterne ressourcer tilgængelige; denne browserkonverter gengiver muligvis ikke fjerntliggende skrifttyper, tilknyttede billeder, scripts eller andre eksterne afhængigheder fra en SVG-fil.
6. Konverter og inspicer eksemplet
Vælg én SVG-fil, vælg en skala og baggrund, og konverter den derefter. Tjek at hele tegningen er synlig, at tekst og fine linjer forbliver læselige, og at eksemplet har den forventede baggrund. Hvis resultatet er beskåret, skal du tjekke SVG viewBox og dimensioner i den oprindelige fil. Konverteren behandler én fil ad gangen og tilbyder en PNG-download for den fil.
7. Tjek pixels og filstørrelse
Brug PNG'en i den tilsigtede sammenhæng og inspicer den i den størrelse, den faktisk vil blive vist i. En stor pixeldimension forbedrer ikke automatisk et lille ikon på skærmen. Hvis PNG'en er for stor, skal du vende tilbage til SVG'en og eksportere med en lavere faktor. Hvis den ser blød ud, skal du bekræfte, at destinationen ikke forstørrer et lille rasterbillede efter konverteringen.
8. Behold den redigerbare kilde
Gem den oprindelige SVG ved siden af PNG'en. SVG'en bevarer vektorstier og er generelt bedre til senere redigeringer, farveændringer og ændring af størrelse. PNG'en er en praktisk kopi med fast størrelse til destinationer, der har brug for rasterbilleder. Ved at beholde begge kan du oprette en anden PNG i en anden størrelse uden gentagne gange at skalere et allerede rasteriseret billede.