Kodėl verta naudoti SVG failus vietoj JPG

SVG privalumai

Sukūrę svetainę ir pridėdami vaizdus į šią svetainę, viena svarbiausių dalykų, kuriuos turite nustatyti, yra tai, kokie failų formatai yra tinkami naudoti. Priklausomai nuo grafikos, vienas formatas gali būti daug geresnis už kitus.

Daugelis interneto dizainerių yra patogūs JPG failo formatu, ir šis formatas puikiai tinka vaizdams, turintiems gilių spalvų gylį, pvz., Nuotraukas. Nors šis formatas taip pat naudotų paprastą grafinę medžiagą, pavyzdžiui, iliustruotas piktogramas, tai nėra geriausias formatas, naudojamas tame pavyzdyje. Šiems piktogramoms SVG būtų geresnis pasirinkimas. Pažiūrėkime, kodėl:

SVG yra vektorinė technologija

Tai reiškia, kad tai nėra rastra technologija. Vektoriniai vaizdai yra matematikos sukurtų eilučių derinys. Rastriniai failai naudoja pikselius arba mažus spalvų kvadratus. Tai yra viena iš priežasčių, kodėl SVG yra keičiamo dydžio ir puikiai tinka jautrioms svetainėms, kurios turi atitikti įrenginio ekrano dydį. Kadangi vektorinė grafika egzistuoja matematikos pasaulyje, norint pakeisti dydį, jūs tiesiog pakeiskite skaičius. Rastriniai failai dažnai reikalauja žymių pakeitimų, kai kalbama apie dydžio nustatymą. Kai norite patobulinti vektorinį vaizdą, nėra iškraipymų, nes sistema yra matematinė, o naršyklė tik perskaičiuoja šią matematiką ir pateikia linijas taip tolygiai kaip ir anksčiau. Kai priartinate rastrinį vaizdą, prarandate vaizdo kokybę, o failas pradeda nykti, kai pradėsite matyti tuos spalvos taškus. Matematika plečia ir sutaria, taškų nėra. Jei norite, kad jūsų vaizdai būtų nepriklausomi nuo rezoliucijos, SVG suteiks jums tokią galimybę.

SVG yra pagrįstas tekstu

Kai naudojate grafikos redaktorių, kad galėtumėte kurti vaizdą, programa fotografuoja jūsų užpildytą meno kūrinį. SVG veikia kitaip. Jūs vis dar galite naudoti kai kurias programines programas ir pajusite, kad piešiate paveikslėlį, bet galutinis produktas - tai vektorinių linijų ar net žodžių rinkinys (kurie iš tiesų yra tik tie vektoriai, kurie yra ant puslapio). Paieškos sistemos žiūri į žodžius, ypač į raktinius žodžius. Jei įkelsite JPG , jūs apribojate save savo grafikos pavadinimu ir galbūt alt teksto fraze. Naudodamiesi SVG kodavimu, galite išplėsti galimybes ir kurti vaizdus, ​​kurie labiau tinka paieškos varikliams.

SVG yra XML ir veikia kitomis kalbomis

Tai grįžta į teksto kodą. Jūs galite padaryti savo bazinį vaizdą SVG ir naudoti CSS, kad jį poliruoti. Taip, jūs galite turėti vaizdą, kuris iš tikrųjų yra SVG failas, bet jūs taip pat galite koduoti SVG tiesiai į puslapį ir jį redaguoti ateityje. Jūs galite jį pakeisti CSS taip pat, kaip pakeistumėte puslapio tekstą ir tt Tai labai galinga ir leidžia lengvai redaguoti.

SVG galima lengvai redaguoti

Tai tikriausiai yra didžiausias pranašumas. Kai fotografuojate kvadratą, būtent tai ir yra. Norėdami atlikti pakeitimus, turite iš naujo nustatyti sceną ir nufotografuoti naują vaizdą. Prieš tai žinote, turite 40 paveikslėlių kvadratų ir dar neturite to visiškai teisingai. Jei naudojate SVG, jei padarysite klaidą, pakeiskite koordinates ar žodį teksto redagavimo priemonėje, o jūs baigsite. Aš galiu tai pasielgti, nes sukūriau SVG ratą, kuris nebuvo tinkamai išdėstytas. Viskas, ką turėjau padaryti, buvo derinti koordinates.

JPG vaizdai gali būti sunkūs

Jei norite, kad jūsų vaizdas augtų fiziškai, jis taip pat augs failo dydžio. Su SVG, svaras vis dar yra svaras, nesvarbu, koks didelis jūs tai padarysite. Kvadratas, kuris yra 2 colių pločio, sveria tą patį kaip kvadratas, kuris yra 100 colių pločio. Failo dydis nesikeičia, o tai puikiai tinka puslapio veikimo požiūriu!

Kuris yra geresnis?

Taigi, koks geresnis formatas - SVG ar JPG? Tai priklauso nuo paties paveikslėlio. Tai panašu į klausimą "kas yra geriau, plaktukas ar atsuktuvas?" Tai priklauso nuo to, ko reikia atlikti! Tas pats pasakytina apie šiuos vaizdo formatus. Jei jums reikia rodyti nuotrauką, tada JPG yra geriausias pasirinkimas. Jei pridėsite piktogramą, SVG greičiausiai bus geresnis pasirinkimas. Galite sužinoti daugiau apie tai, kada čia reikia naudoti SVG failus .

Originalus straipsnis Jennifer Krynin. Redagavo Jeremy Girard 6/6/17