Prečo používať súbory SVG Namiesto JPG

Výhody SVG

Pri vytváraní webových stránok a pri pridávaní obrázkov na túto lokalitu je potrebné určiť, aké najdôležitejšie veci musíte zistiť, ktoré formáty súborov sú správne. V závislosti od grafiky môže byť jeden formát oveľa lepší ako ostatné.

Mnoho webových dizajnérov je pohodlné vo formáte JPG a tento formát je ideálny pre obrázky, ktoré majú hlbokú farebnú hĺbku, napríklad fotografie. Zatiaľ čo tento formát by fungoval aj pre jednoduchú grafiku, ako ilustrované ikony, nie je to najlepší formát, ktorý sa v tomto prípade používa. Pre tieto ikony by SVG bola lepšou voľbou. Poďme sa pozrieť na to, prečo:

SVG je vektorová technológia

To znamená, že to nie je rasterová technológia. Vektorové obrázky sú kombináciou riadkov vytvorených pomocou matematiky. Rastrové súbory používajú pixely alebo drobné štvorce farieb. To je jeden z dôvodov, že SVG je škálovateľný a ideálny pre citlivé webové stránky, ktoré musia byť prispôsobené veľkosti obrazovky zariadenia. Vzhľadom k tomu, vektorové grafiky existujú vo svete matematiky, zmeniť veľkosť, stačí zmeniť čísla. Rastrové súbory často vyžadujú významnú revíziu, pokiaľ ide o dimenzovanie. Keď chcete priblížiť vektorový obrázok, nedochádza k žiadnemu skresleniu, pretože systém je matematický a prehliadač práve prepočíta matematiku a vykresľuje čiary tak hladko ako kedykoľvek predtým. Pri priblížení rastrového obrázka stratíte kvalitu obrázkov a súbor začína byť fuzzy, keď začnete vidieť tie pixely farby. Matematika sa rozširuje a zmršťuje, pixely nie. Ak chcete, aby vaše snímky boli nezávislé na rozlíšení, SVG vám dáva túto schopnosť.

SVG je založené na texte

Ak použijete grafický editor na vytvorenie obrázka, program odfotografuje vaše dokončené umelecké diela. SVG funguje inak. Môžete stále používať niektoré softvérové ​​programy a cítiť sa ako kreslenie obrázka, ale konečný produkt je kolekcia vektorových riadkov alebo dokonca slov (ktoré sú naozaj len vektory na stránke). Vyhľadávacie nástroje vyhľadávajú slová, konkrétne kľúčové slová. Ak odovzdáte súbor JPG , obmedzíte sa na názov vašej grafiky a možno aj textovú frázu. Vďaka kódovaniu SVG rozširujete možnosti a vytvárate zábery, ktoré sú viac priateľské pre vyhľadávače.

SVG je XML a funguje v rámci iných jazykových formátov

Toto sa vráti k textovému kódu. Svoj základný obrázok môžete vytvoriť v SVG a pomocou CSS ho vyleštiť. Áno, môžete mať obrázok, ktorý je vlastne súbor SVG, ale môžete tiež kódovať SVG priamo do stránky a upravovať ho v budúcnosti. Môžete ho meniť pomocou CSS rovnakým spôsobom, ako by ste zmenili text stránky atď. Toto je veľmi výkonné a umožňuje jednoduchú úpravu.

SVG je ľahko editovateľné

To je pravdepodobne najväčšou výhodou. Keď urobíte fotografiu námestia, je to to, čo to je. Ak chcete urobiť zmenu, musíte vynulovať scénu a vytvoriť nový obrázok. Predtým, ako to viete, máte 40 snímok štvorcov a stále nemáte úplnú pravdu. S SVG, ak urobíte chybu, zmeníte súradnice alebo slovo v textovom editore a ste hotoví. Môžem sa k tomu pripojiť, pretože som nakreslil kruh SVG, ktorý nebol správne umiestnený. Jediné, čo som musel urobiť, bolo upraviť súradnice.

JPG obrázky môžu byť ťažké

Ak chcete, aby váš obraz rástol vo fyzickej veľkosti, bude tiež rásť vo veľkosti súboru. S SVG, libra je stále libra bez ohľadu na to, ako veľká je to. Námestie, ktoré je široké 2 palce, bude mať rovnakú váhu ako štvorcový, ktorý je široký 100 centimetrov. Veľkosť súboru sa nemení, čo je vynikajúce z hľadiska výkonnosti stránky!

Takže čo je lepšie?

Takže čo je lepší formát - SVG alebo JPG? To závisí od samotného obrazu. Je to ako pýtať sa "čo je lepšie, kladivo alebo skrutkovač?" Záleží na tom, čo potrebujete dosiahnuť! To isté platí pre tieto formáty obrázkov. Ak potrebujete zobraziť fotografiu, JPG je najlepšou voľbou pre vás. Ak pridávate ikonu, SVG je pravdepodobne lepšou voľbou. Viac informácií o tom, kedy je vhodné použiť SVG súbory tu .

Originálny článok od Jennifer Krynin. Upravený Jeremy Girard dňa 6/6/17