Zašto koristiti SVG datoteke umjesto JPG

Prednosti SVG

Dok kreirate web stranicu i dodate slike na toj web lokaciji, jedan od najvažnijih stvari koje morate odrediti je koji su formati datoteka tačni za korištenje. U zavisnosti od grafike, jedan format može biti mnogo bolji od ostalih.

Mnogi web dizajneri uživaju u JPG formatu, a ovaj format je savršen za slike koje imaju duboku dubinu boja, kao što su fotografije. Iako bi ovaj format funkcionisao i za jednostavnu grafiku, kao ilustrirane ikone, nije najbolji format koji se koristi u tom slučaju. Za te ikone, SVG bi bio bolji izbor. Hajde da pogledamo tačno zašto:

SVG je vektorska tehnologija

To znači da nije raster tehnologija. Vektorske slike predstavljaju kombinaciju linija kreiranih pomoću matematike. Raster datoteke koriste piksele ili male kvadrate boje. Ovo je jedan od razloga zbog kojih je SVG skalabilan i savršen za odgovarajuće web stranice koje moraju da skali zajedno sa veličinom ekrana uređaja. Pošto vektorska grafika postoji u svetu matematike, da biste promenili veličinu, jednostavno promenite brojeve. Raster datoteke često zahtevaju značajan remont kada je u pitanju dimenzioniranje. Kada želite da uvećate vektorsku sliku, ne postoji izobličenje, jer je sistem matematički i pretraživač jednostavno ponovo izračunava matematiku i čini linije glatkim kao i uvek. Kada zumirate rastersku sliku, izgubite kvalitet slike, a datoteka počinje da bude nejasna dok počnete da vidite te piksele boje. Math se širi i ugovara, pikseli ne. Ako želite da vaše slike budu nezavisne, SVG će vam pružiti tu mogućnost.

SVG je zasnovan na tekstu

Kada koristite grafički editor da biste napravili sliku, program snima sliku vašeg završenog umetničkog dela. SVG radi drugačije. I dalje možete da koristite neke softverske programe i osećate se kao da crtate sliku, ali konačni proizvod je kolekcija vektorskih linija ili čak reči (što su zapravo samo vektori na stranici). Pretraživači gledaju na reči, konkretno ključne riječi. Ako uploadujete JPG , ograničavate se na naslov vaše grafike i možda alt tekstualnu frazu. Sa SVG kodiranjem, proširite se na mogućnosti i kreirajte slike koje su više pretraživačima.

SVG je XML i radi unutar drugih formata jezika

Ovo se vraća na tekstualni kod. Možete napraviti svoju osnovnu sliku u SVG-u i koristiti CSS za poliranje. Da, možete imati sliku koja je zapravo SVG datoteka, ali takođe možete kodirati SVG direktno na stranicu i urediti u budućnosti. Možete ga promijeniti CSS-om na isti način na koji biste izmenili tekst stranice, itd. Ovo je vrlo moćno i omogućava jednostavno uređivanje.

SVG je jednostavno uređen

Ovo je verovatno najveća prednost. Kada slikate kvadrat, to je ono što jeste. Da biste napravili promenu, morate resetovati scenu i napraviti novu sliku. Pre nego što to saznate, imate 40 slika kvadrata i još uvek nemate pravo. Sa SVG-om, ako napravite grešku, promenite koordinate ili reč u tekstualnom editoru, a vi ste završili. Mogu se odnositi na to jer sam nacrtao SVG krug koji nije bio pravilno pozicioniran. Sve što sam morao uraditi je da podesite koordinate.

JPG slike mogu biti teške

Ako želite da vaša slika poraste u fizičkoj veličini, ona će takođe porasti u veličini datoteke. Sa SVG-om, funta je i dalje funta bez obzira koliko je velika. Kvadrat koji je 2 inča širok će teći isto kao kvadrat koji je širok 100 inča. Veličina datoteke se ne menja, što je odlično sa stanovišta performansi stranice!

Pa koja je bolje?

Dakle, koji je bolji format - SVG ili JPG? To zavisi od same slike. To je kao da pitate "šta je bolje, čekić ili odvijač?" To zavisi od onoga što morate da postignete! Isto važi i za ove formate slika. Ako vam je potrebno prikazati fotografiju, onda je JPG najbolji izbor za vas. Ako dodate ikonu, onda je SVG vjerovatno bolji izbor. Možete saznati više o tome kada je prikladno koristiti SVG datoteke ovdje .

Originalni članak Jennifer Krynin. Uredio Jeremy Girard 6/6/17