Kako (i zašto) SVG ide preuzeti 2018. godinu
2018. će biti godina SVG-a. Format slikovnih datoteka neprestano raste u popularnosti i upotrebi u posljednjih nekoliko godina, ali 2018. je godina kad će se zaista probiti.
Imate kombinaciju korisnika s zaslonom visoke rezolucije i potrebnim vremenom za munjevito brzo učitavanje. I dok bi prelazak na SVG mogao zvučati kao velika stvar; nije.
SVG je jednostavan za upotrebu i implementaciju, a ne morate stvarno mijenjati postojeće datoteke; samo dodajte nove slike kao SVG. Evo što sve trebate znati kada je u pitanju SVG.
Istražite dizajnerske resurse
SVG je napravljen za Internet
Mozilla to opisuje ovako:
SVG je jezik zasnovan na XML-u za opis vektorskih slika. To je u osnovi označavanje, poput HTML-a, osim što imate mnogo različitih elemenata za definiranje oblika koje želite da se pojave na vašoj slici i efekata koje želite primijeniti na te oblike. SVG je za označavanje grafike, a ne sadržaja. Na najjednostavnijem kraju spektra, imate elemente za stvaranje jednostavnih oblika, poput i. Naprednije SVG značajke uključuju (transformirajte boje pomoću matrice transformacije, ) (animirani dijelovi vaše vektorske grafike, ) i (nanesite masku preko vrha slike.)
Ključne prednosti SVG-a za web dizajnere uključuju mogućnost stvaranja jednostavnih SVG rendera u uređivaču koda ili teksta, dok se složena grafika može crtati u programu kao što je Adobe Illustrator; SVG tekst je dostupan; SVG-ovi su jednostavni za stil i pisanje; i stvarate pomoću vektorskog formata koji se dobro čini u bilo kojoj veličini. SVG formati podržani su modernim preglednicima, otporni su na budućnost i vrlo su stisljivi.
Neki od nedostataka su u tome što se projektiranje SVG-ova može komplicirati i u početku ih je malo teže stvoriti. Drugo je pitanje što neki degradirani preglednici jednostavno ne razumiju što jesu.
Trebate bolje razumijevanje SVG-a? Imamo početnički vodič za SVG.
Kako dizajneri koriste SVG
Jedna od prednosti SVG-a je što s njim možete učiniti puno različitih stvari. SVG se može koristiti za:
- Logos
- Pozadine, uzorci i teksture
- Animacija
- Reaktivne slike
- ikone
Dizajneri mogu koristiti SVG za bilo koji element u dizajnu u kojem je vektorski format primjenjivo rješenje. Mogu zamijeniti JPG, PNG i GIF, među ostalim formatima.
Pravilo vektorskih formata
Postoji dobra šansa da ćete koristiti više vektorskih formata. SVG nije rezolucija neovisna. A to je ogroman bonus jer znate da će vaše slike izgledati sjajno bilo gdje.
Ono što je posebno lijepo u radu sa SVG slikama je da ne morate stvarno mijenjati svoj tijek rada da biste ih implementirali. Ako dizajnirate u softveru kao što su Illustrator ili Sketch, postupak - osim konačnog izvoza - je identičan. Jedna zamisao je da ćete vjerojatno željeti bilo koji tekstualni element pretvoriti u obrise u Illustratoru, ali to već čini mnogo ljudi.
Prilikom pripremanja SVG datoteka, morate zapamtiti jednu ključnu stvar. Da biste bili što sitniji, pobrinite se da izbrišete sve nepotrebne smeće. (Očistite onu kartonu!) SVG na webu ima sjajne savjete za crtanje elemenata i spremanje SVG datoteka na najbolji mogući način.
Tekst temeljen format dobar je za SEO
Korištenje SVG-a dolazi s ponekim bonusom za pametne dizajnere. Kako SVG koristi stvarni tekst u oblikovanju, tražilice mogu bolje čitati slike.
Da, alt informacije možete dodati s drugim slikama, ali postoji samo toliko mjesta za ključne riječi. Uz SVG možete stvoriti više slika prilagođenih pretraživanju i samo prenijeti. Google indeksira sav SVG sadržaj, uključujući samostalne datoteke i kada su SVG ugrađeni izravno u HTML.
SVG je lagan
Za razliku od nekih drugih tipova datoteka koje se temelje na vektoru, a koje mogu brzo postati velike, SVG-ovi se kodiraju. Kod je brz. To je tako jednostavno. Pa ... skoro.
Kada su u pitanju oni maštoviti vektorski crteži koje ste spremili kao SVG, provjerite veličine datoteke prije nego što se previše udaljite. Iako PNG formati mogu narasti gotovo eksponencijalno kad se doda transparentnost, SVG-ovi imaju tendenciju rasta na temelju broja staza i ispunjenja slike.
Ako je SVG velik, razmislite o njegovom izvozu i JPG ili PNG. (Čak i ako se čini kontradiktornim. Stvarnost je da će većina dizajnera i dalje koristiti miks vrsta datoteka sa slikama; samo očekujte da će koristiti više SVG-a nego što ste imali u prošlosti.)
Uređivanje je jednostavno
Ako ste navikli crtati ikone ili logotipe ili bilo što drugo u softveru za crtanje vektora, za vas se ništa ne mijenja.
Ali ako napišete SVG, čeka vas poslastica. Samo promijenite riječ ili koordinate ili boju u uređivaču teksta i bum, promjena je izvršena. Teško je učiniti uređivanje ikakvim lakšim od toga.
Stvaranje fotografija ili animiranih slika pomoću SVG
Za razliku od većine ostalih formata slike, koji vam omogućuju da imate nepokretnu ili pokretnu sliku, SVG omogućuje bilo koji. Možete stvoriti fotografiju ili animaciju. I sve djeluje na isti način. (Ovaj sjajni primjer je vodič za animiranje elementa na SVG putu!)
Te male prednosti pomažu gurnuti SVG u prvi plan dizajnera. Ne morate naučiti novi alat ili tehniku; s SVG-om već imate na raspolaganju sve što vam treba.
Zaključak
Evo velikog razloga 2018. će biti godina koju SVG počinje preuzimati: praktična je.
Sa svima koji koriste zaslone visoke rezolucije, vektorski formati zaista su takav put. Sve važi besprijekorno i ne morate brinuti o pikseliranju. SVG-ovi stvaraju sjajne logotipe (statičke ili responzivne), grafikone i pozadine, ikone i male slike i animacije. Datoteke su male i brzo se učitavaju, a nema velike krivulje učenja kada je u pitanju implementacija SVG-ova u vaš web dizajn.
Sada možete doslovno početi koristiti SVG slike.
 SVG ide preuzeti 2018. godinu){kind=link}