Dobrý export sa začína tam, kde sa bude obrázok používať. Tento sprievodca vysvetľuje, ako zvoliť mierku, pripraviť súbor SVG a skontrolovať PNG pred jeho použitím.
1. Začnite pri cieľ
Pred prevodom skontrolujte pixelové rozmery požadované webovou stránkou, dokumentom, e-mailovým systémom alebo dizajnovou aplikáciou, ktorá obrázok prijme. Tento nástroj škáluje vykreslené rozmery SVG pomocou vybraného násobku; neposkytuje vlastné polia pre šírku a výšku. Ak platforma požaduje šírku 1200 pixelov, porovnajte tento cieľ so zobrazenou šírkou SVG a vyberte násobok, ktorý sa blízko priblíži bez vytvorenia zbytočne veľkého súboru.
2. Pochopte faktory mierky
Možnosti sú 1x, 2x, 3x, 4x a 8x. Násobok ovplyvňuje šírku aj výšku: zdroj 200 × 100 vykreslený pri 2x sa stane 400 × 200 pixelov. Počet pixelov rastie s kvadrátom násobku, takže 8x produkuje 64-krát viac pixelov ako 1x. Väčší výstup môže spotrebovať výrazne viac pamäte a nemusí vyzerať lepšie, keď pôvodná grafika alebo cieľový displej to nepotrebujú.
3. Vyberte faktor pre displeje
Pre štandardnú grafiku rozhrania je 1x alebo 2x často praktickým východiskom; 2x môže pomôcť na displejoch s vysokou hustotou, keď cieľové rozloženie obrázok zmenšuje. Zvoľte 3x alebo 4x iba vtedy, keď design potrebuje dodatočné pixelové rozmery. Používajte 8x selektívne, pretože veľmi veľké plátna môžu trvať dlhšie pri vykresľovaní alebo prekročiť limity prehliadača.
4. Rozhodnite, či by pozadie malo byť priehľadné
Zvoľte Priehľadné, keď musí byť PNG umiestnený nad farebnou stránkou, prezentáciou alebo iným obrázkom. Zvoľte Biele, keď cieľ očakáva biely obdĺžnik alebo keď pevné pozadie uľahčuje kontrolu grafiky. PNG podporuje priehľadnosť, ale cieľová aplikácia môže zobraziť priehľadné pixely nad šachovnicovým vzorom alebo ich pri vložení obrázka sploštiť.
5. Pripravte SVG pred exportom
Otvorte zdroj vo vektorovom editore a skontrolujte, či má zmysluplný viewBox a viditeľnú grafiku vo vnútri tohto viewBoxu. Preveďte alebo vložte písma, ak musí design vyzerať identicky na zariadeniach, ktorým tieto písma chýbajú. Udržujte prepojené obrázky a externé zdroje dostupné; tento konvertor v prehliadači nemusí vykresliť vzdialené písma, prepojené obrázky, skripty alebo iné externé závislosti zo súboru SVG.
6. Preveďte a skontrolujte náhľad
Vyberte jeden súbor SVG, zvoľte mierku a pozadie a potom ho preveďte. Skontrolujte, či je celá kresba viditeľná, či text a jemné čiary zostávajú čitateľné a či má náhľad očakávané pozadie. Ak je výsledok orezaný, skontrolujte SVG viewBox a rozmery v pôvodnom súbore. Konvertor spracováva jeden súbor za druhým a ponúka stiahnutie PNG pre daný súbor.
7. Skontrolujte pixely a veľkosť súboru
Použite PNG v zamýšľanom kontexte a skontrolujte ho vo veľkosti, v ktorej sa skutočne zobrazí. Veľký pixelový rozmer automaticky nezlepšuje malú ikonu na obrazovke. Ak je PNG príliš veľký, vráťte sa k SVG a exportujte s nižším faktorom. Ak vyzerá rozostrene, overte, či cieľ po prevode nezväčšuje malý rastrový obrázok.
8. Ponechajte si upraviteľný zdroj
Uložte pôvodné SVG vedľa PNG. SVG zachováva vektorové cesty a je vo všeobecnosti lepší pre neskoršie úpravy, prefarbovanie a zmenu veľkosti. PNG je pohodlná kópia s pevnou veľkosťou pre ciele, ktoré potrebujú rastrové obrázky. Ponechanie oboch vám umožňuje vytvoriť ďalšie PNG v inej veľkosti bez opakovaného škálovania už rastrizovaného obrázka.