Grafiko Bektore Grafikoak erabiltzearen onurak
Scalable Vector Graphics, edo SVG, eginkizun garrantzitsua da gaur egun diseinatu den webguneetan. SVG-a zure web diseinuan lanean ari ez bazara, hona hemen zergatik hasi beharko zenituzkeen, baita fitxategi horiek onartzen ez dituzten arakatzaile zaharrak ere.
Ebazpena
SVGren onura handiena bereizmen independentzia da. SVG fitxategiak bektore grafikoak izanik, pixel oinarritutako raster-irudien ordez, tamainaz aldatu ahal izango dira irudiaren kalitatea galdu gabe. Hau oso lagungarria da itxura ona duten webguneak sortzeko eta pantailako tamainu eta gailuen aukera zabalean lan egiteko .
SVG fitxategiak gora edo behera eskalatu daitezke zure webgunearen erantzukizunaren tamaina eta diseinuaren beharretara egokitzeko eta ez duzu kalterik kalterik kalterik egin beharrik kalitateaz.
Fitxategiaren tamaina
Raster irudiak erabiltzean (JPG, PNG, GIF) erronketako bat irudi sentikorren gainean irudi horien tamaina da. Arratzeko irudiek ez dutelako bektoreek egiten duten neurria eskalatzen, irudiak pixeletan oinarritutako irudiak zabaldu beharko lirateke. Irudi bat txikiagoa izan dadin eta haren kalitatea mantendu ahal izateko, baina hori ez da egia irudiak handiagoak egiteko. Azken emaitza askotan jendeak pantailan ikusten ari diren baino askoz ere handiagoa den irudiak izaten ditu askotan, eta horrek esan nahi du fitxategi handiegia deskargatzeko beharrik ez izatea.
SVG-k erronka hau du. Bektore grafikoak eskalagarriak direlako, tamaina-tamainaren txikiak izan ditzakezu irudiak handiak izan daitezkeen edozein izanik ere. Horrek azken finean eragin positiboa izango du gune baten performance orokorrean eta deskargatzeko abiadan.
CSS estilismoa
SVG kodea ere zuzenean gehitu daiteke orrialde baten HTMLan. Honek "SVG inlinea" deritzo. SVG inlinea erabiltzearen abantaila bat da, grafikoak zure kodean oinarritutako arakatzaileak marrazten dituenez gero, ez dago HTTP eskaera egiteko beharra irudi-fitxategi bat lortzeko. Beste prestazio bat da SVG inlinea CSS-rekin estekatua izan daitekeela.
SVG ikonoaren kolorea aldatu behar duzu? Edizio-softwarearen zenbait irudi ireki eta esportatu eta berriro kargatu behar duzu, SVG fitxategia CSS lerro gutxi batzuekin bakarrik alda dezakezu.
CSS estilo batzuk ere erabil ditzakezu SVG grafikoetan, pasatzean estatuetan edo zenbait diseinu beharretara aldatzeko. Grafiko horiek animatu ditzakezu orri batera mugimendu eta elkarreragin batzuk gehitzeko.
animazioak
SVG fitxategi inlinatuak CSS-rekin estilizatu daitezkeelako, CSS animazioak ere erabil ditzakezu. CSS transformazioak eta trantsizioak bi modu erraz daude SVG fitxategien bizitza gehitzeko. Flash-antzeko esperientzia aberatsak lor ditzakezu orrialde batean, gaur egun erabiltzen diren Flashen webguneen desabantailekin .
SVG erabilerak
SVG bezain indartsua denez, grafikoek ezin dute zure webgunean erabiltzen ari zaren beste irudi formatu bat ordezkatu. Kolore sakoneko sakonera duten argazkiak JPG edo agian PNG fitxategi bat izan behar dute oraindik, baina ikonoak bezalako irudi sinpleak ezin hobeak dira SVG gisa exekutatzeko.
SVG ere egokia izan daiteke ilustrazio konplexuagoetarako, adibidez, enpresaren logotipoak edo grafikoak eta grafikoak. Grafiko guztiak eskalagarria izateko gai izango dira, CSS-rekin estilizatu ahal izango dira eta artikulu honetan agertzen diren beste abantailak.
Nabigatzaile zaharren laguntza
SVG euskarri modernoa oso ona da nabigatzaile modernoetan. Grafiko horien laguntza benetan falta duten nabigatzaile bakarrak Internet Explorer bertsio zaharragoak dira (bertsioa 8 eta beherago) eta Android bertsio zaharrago batzuk. Guztietan, arakatze-biztanleriaren ehuneko txikia oraindik ere arakatzaile horiek erabiltzen ditu eta kopuru hori jarraitzen du. Horrek esan nahi du SVG erabil daiteke nahiko webgune seguruan segurtasunez.
SVGrako atzerapen bat eman nahi baduzu, Grumpicon bezalako tresna bat erabil dezakezu Filament taldetik. Baliabide hau zure SVG irudi-fitxategiak hartuko ditu eta nabigatzaile zaharrentzako PNG atzerapenik sortu.
Jeremy Girard-ek argitaratua 17/07/17