Ang SVG ay nangangahulugang Scalable Vector Graphics. Ito ang open standard ng W3C para sa mga larawan na inilarawan bilang mga instruksyon at hindi mga pixel: gumuhit ng bilog dito, sundan ang kurbang ito, punan ang hugis na iyon gamit ang kulay na ito, ilagay ang salitang ito gamit ang typeface na iyon. Dahil ang larawan ay isang hanay ng mga direksyon, maaari itong iguhit sa anumang laki nang hindi lumalabo o nagiging bloke-bloke, kaya madalas na SVG ang gamit para sa mga logo, icon, mapa at chart.
Kung paano nag-iimbak ng larawan ang SVG
Ang SVG file ay XML: nababasang text na maaari mong buksan sa anumang editor. Ang isang elementong <path> ay naglalaman ng maikling string ng mga utos sa pagguhit, ang <rect>, <circle> at <polygon> ay gumagawa ng mga halatang bagay, ang <text> ay naglalaman ng totoong text na maaaring piliin, at ang <g> ay naggugrupo ng mga elemento para mailipat o maistilo nang sabay-sabay. Ang attribute na viewBox ang nagde-define ng coordinate system, na siyang dahilan kung bakit malinis ang pag-scale ng buong drawing.
Dahil ito ay text, napakadaling i-compress ng SVG; ang gzipped SVG (minsan may extension na .svgz) ay kadalasang maliit na bahagi lang ng orihinal na laki. Dahil text din ito, maaaring istiluhan ang SVG gamit ang CSS, i-animate, at i-script. Itinuturing ito ng browser bilang bahagi ng dokumento at hindi bilang isang hindi-nakikitang laman na larawan.
Ang huling kakayahang iyon ay may aspeto ng seguridad na dapat malaman: ang SVG ay maaaring maglaman ng elementong <script>. Kahit saan tumatanggap ng SVG bilang user upload, kailangan itong i-sanitize o ihain sa paraang hindi ito maipapatupad, kaya may ilang site na tumatanggi sa SVG kahit tinatanggap nila ang lahat ng raster format.
Hindi angkop ang SVG bilang lalagyan para sa mga litrato. Maaari kang mag-embed ng raster image sa loob nito, pero magkakaroon ka lang ng pixel na larawan na binalot sa XML at mawawala ang benepisyo ng pag-scale.
Anong metadata ang dala ng SVG
Ang SVG ay may nakalaang elementong <metadata>, at dahil hindi itinatakda ng standard kung ano ang dapat ilagay dito, marami ang inilalagay ng mga editor. Kadalasan ay naglalaman ito ng RDF gamit ang mga Dublin Core term: dc:title, dc:creator, dc:date, dc:description, dc:rights at isang licence URI. Ang mga elementong <title> at <desc> ay maaari ring ilagay sa root o sa anumang indibidwal na hugis, kung saan nagsisilbi rin silang accessibility text para sa mga screen reader.
Pagkatapos ay naroon ang sariling bookkeeping ng editor, at ito ang kadalasang pinakamalaking bahagi. Ang Inkscape ay sumusulat ng sarili nitong namespace: window geometry ng dokumento, antas ng zoom at posisyon ng cursor noong huli itong na-save, mga gabay na linya, grid settings, pangalan at visibility ng mga layer, at isang inkscape:version string. Ang Illustrator ay nag-e-embed ng XMP packet na may sarili nitong document identifiers at history. Wala sa mga ito ang gumuguhit ng kahit ano.
Dalawang praktikal na punto ang sumusunod. Ang data ng editor ay madaling maging karamihan ng file, kaya ang pagpapatakbo ng SVG sa isang optimiser bago i-publish ay kadalasang nagpapababa nito nang kalahati. At ang mga pangalan ng layer ay text na ikaw ang sumulat: ang <g inkscape:label="client logo v3 REJECTED"> ay hindi nakikita sa larawan ngunit lubos na nakikita sa file.
Kailan gagamit ng SVG
Gamitin ang SVG para sa anumang iginuhit at hindi kinunan ng litrato: mga logo, icon, diagram, chart, ilustrasyon, mapa. Ito ang tamang pagpili para sa web, kung saan isang file lang ang nagsisilbi sa lahat ng screen density, at para sa print, kung saan maaari itong i-scale sa anumang laki.
Gamitin ang PNG o JPG para sa mga litrato at sa anumang may tuloy-tuloy na tono. Mag-export din ng flat na kopyang raster kapag kailangan mo ng larawan na mabubuksan sa software na masyadong luma o limitado para sa SVG, at alisin ang metadata ng editor bago mag-publish, para parehong lumiit ang file at dahil hindi palaging para sa publiko ang mga pangalan ng layer.