Otváranie vektorových grafických súborov SVG. Online prevodník vektorovej grafiky Ako upraviť súbor svg

Koncept vektorových obrázkov drvivej väčšine bežných používateľov PC nehovorí absolútne nič. Dizajnéri sa zasa čoraz viac prikláňajú k využívaniu tohto typu grafiky pre svoje projekty.

Predtým ste na prácu s obrázkami SVG určite museli nainštalovať do počítača jedno zo špecializovaných riešení pre stolné počítače, ako je Adobe Illustrator alebo Inkscape. Teraz sú tieto nástroje dostupné online bez potreby sťahovania.

Vyplnením príslušného dotazu na Google sa môžete zoznámiť s veľkým množstvom rôznych online vektorových editorov. Prevažná väčšina takýchto riešení však ponúka skôr skromné ​​​​možnosti a väčšinou neumožňujú prácu so serióznymi projektmi. Pozrieme sa na najlepšie služby na vytváranie a úpravu obrázkov SVG priamo v prehliadači.

Samozrejme, online nástroje nemôžu úplne nahradiť zodpovedajúce desktopové aplikácie, ale pre väčšinu používateľov bude navrhovaná sada funkcií viac než dostatočná.

Metóda 1: Vektor

Premyslený vektorový editor od tvorcov známej služby Pixlr. Tento nástroj bude užitočný pre začiatočníkov aj pokročilých používateľov pri práci s SVG.

Napriek množstvu funkcií sa v rozhraní Vectr bude dosť ťažké stratiť. Pre začiatočníkov sú k dispozícii podrobné lekcie a rozsiahle pokyny pre každú zložku služby. Medzi nástrojmi editora je všetko pre tvorbu SVG obrázku: tvary, ikony, rámy, tiene, štetce, podpora práce s vrstvami atď. Môžete nakresliť obrázok od začiatku alebo nahrať svoj vlastný.

Exportné možnosti zahŕňajú aj jednu z najvýraznejších vlastností Vectru – podporu priamych odkazov na SVG projekt v editore. Mnohé zdroje vám neumožňujú nahrať vektorové obrázky priamo do seba, no napriek tomu umožňujú ich zobrazenie na diaľku. V tomto prípade možno použiť Vectr ako najviac skutočný hosting SVG, čo vám iné služby neumožňujú.

Treba si uvedomiť, že editor nie vždy spracuje zložitú grafiku správne. Z tohto dôvodu sa niektoré projekty môžu otvoriť vo Vectre s chybami alebo vizuálnymi artefaktmi.

Metóda 2: Skicár

Jednoduchý a užívateľsky prívetivý webový editor na vytváranie obrázkov SVG založený na platforme HTML5. Vzhľadom na súbor dostupných nástrojov možno tvrdiť, že služba je určená výlučne na kreslenie. Pomocou programu Sketchpad môžete vytvárať krásne, dobre navrhnuté obrázky, ale nič viac.

Nástroj má širokú škálu prispôsobiteľných štetcov rôznych tvarov a typov, sadu tvarov, fontov a prekrývacích nálepiek. Editor vám umožňuje plne manipulovať s vrstvami – ovládať ich umiestnenie a režimy prelínania. Ako bonus je aplikácia plne preložená do ruštiny, takže s jej vývojom by ste nemali mať žiadne problémy.

Metóda 3: Metóda kreslenia

Táto webová aplikácia je určená pre základné operácie s vektorovými súbormi. Nástroj navonok pripomína desktopový Adobe Illustrator, ale z hľadiska funkčnosti je tu všetko oveľa jednoduchšie. Method Draw má však aj niektoré funkcie.

Okrem práce s obrázkami SVG vám editor umožňuje importovať rastrové obrázky a na ich základe vytvárať vektorové obrázky. Dá sa to urobiť na základe ručného obkresľovania obrysov perom. Aplikácia obsahuje všetky potrebné nástroje na rozloženie vektorových kresieb. K dispozícii je rozšírená knižnica tvarov, plnofarebná paleta a podpora klávesových skratiek.

Method Draw rozhodne nie je vhodný na vytváranie serióznych vektorových projektov – dôvodom je nedostatok vhodných funkcií. Ale vďaka absencii zbytočných prvkov a dobre organizovanému pracovnému priestoru môže byť služba vynikajúca na rýchle úpravy alebo dolaďovanie jednoduchých SVG obrázkov.

Metóda 4: Gravit Designer

Bezplatný webový editor vektorová grafika pre pokročilých používateľov. Mnoho dizajnérov dáva Gravit na rovnakú úroveň ako plnohodnotné desktopové riešenia, ako je Adobe Illustrator. Faktom je, že tento nástroj je multiplatformový, to znamená, že je plne dostupný na všetkých operačných systémoch počítačov, ako aj ako webová aplikácia.

Gravit Designer sa aktívne vyvíja a pravidelne dostáva nové funkcie, ktoré už stačia na zostavenie zložitých projektov.

Editor vám ponúka všetky druhy nástrojov na kreslenie ciest, tvarov, ciest, textových prekrytí, výplní a rôznych prispôsobiteľných efektov. K dispozícii je rozsiahla knižnica tvarov, tematických obrázkov a ikon. Každý prvok v priestore Gravit má zoznam vlastností dostupných na úpravu.

Všetka táto rozmanitosť je „zabalená“ do štýlového a intuitívneho rozhrania, takže akýkoľvek nástroj je dostupný len niekoľkými kliknutiami.

Vzhľadom na to, že služba je určená pre plnohodnotnú prácu s vektorovou grafikou, možno ju pokojne odporučiť aj profesionálnym dizajnérom. Pomocou aplikácie Gravit môžete upravovať obrázky SVG bez ohľadu na platformu, na ktorej sa nachádzate. Zatiaľ je toto tvrdenie použiteľné iba pre desktopové OS, ale čoskoro sa tento editor objaví na mobilné zariadenia Oh.

Metóda 5: Janvas

Obľúbený nástroj na vytváranie vektorovej grafiky medzi web developermi. Služba obsahuje množstvo nástrojov na kreslenie s vysoko prispôsobiteľnými vlastnosťami. Hlavná prednosť Janvas - schopnosť vytvárať interaktívne obrázky SVG animované pomocou CSS. A v spojení s JavaScriptom vám služba umožňuje vytvárať celé webové aplikácie.

V šikovných rukách je tento editor skutočne výkonným nástrojom, zatiaľ čo začiatočník kvôli množstvu najrôznejších funkcií s najväčšou pravdepodobnosťou jednoducho nerozumie tomu, čo je čo.

Áno, tento nástroj bohužiaľ nie je zadarmo. Ide však o profesionálne riešenie, ktoré nie je užitočné pre každého.

Metóda 6: DrawSVG

Najpohodlnejšia online služba, ktorá umožňuje webmasterom čo najjednoduchšie vytvárať vysokokvalitné prvky SVG pre svoje stránky. Editor obsahuje pôsobivú knižnicu tvarov, ikon, výplní, prechodov a písiem.

S DrawSVG môžete navrhovať vektorové objektyľubovoľný typ a vlastnosti, zmeniť ich parametre a vykresliť ako samostatné obrázky. Do SVG je možné vložiť multimediálne súbory tretích strán: video a zvuk z počítača alebo sieťových zdrojov.

Tento editor, na rozdiel od väčšiny ostatných, nevyzerá ako port prehliadača desktopovej aplikácie. Na ľavej strane sú hlavné nástroje na kreslenie a navrchu sú ovládacie prvky. Hlavný priestor zaberá plátno na prácu s grafikou.

Musíte pochopiť, že súbor obrázka je súbor údajov vo formáte obyčajného textu vo formáte XML, čo znamená, že obrázok môžete upravovať pomocou ľubovoľného textového editora. Pozri, nie je ťažké to študovať.

Ako otvoriť výkres SVG?

SVG je webovo špecifický formát na popis vektorových primitív na webovej stránke. Samozrejme, medzi divákmi SVG sú vlajkovými loďami moderné prehliadače (najnovšie verzie Opera, Firefox, Chrome, ako aj verzie IE 9). Prehliadače podporujú takmer všetky prvky SVG (vrátane animácií a ECMAScript) a úroveň podpory Opery má tendenciu byť 100%.

Tabuľka zobrazujúca úroveň podpory SVG rôzne prehliadače od júla 2010:

Z týchto údajov vyplýva, že otvorenie SVG je najlepšie vykonať pomocou prehliadača Opera. Najnovšia verzia. Tento prehliadač má verzie pre Windows aj Linux, takže nikto by nemal mať problémy.

Vo všeobecnosti takmer všetky programy na prezeranie a úpravu obrázkov podporujú SVG, no väčšina z nich nevie prehrávať animácie, nieto ešte skripty.

Ako upraviť kresbu SVG?

SVG existuje od roku 1999, no aktívne sa začalo rozvíjať až mnoho rokov po svojom vzniku vďaka podpore najväčších IT spoločností na svete. Formát nie je ani zďaleka nový, takže každý softvér, ktorý sa rešpektuje, je jednoducho povinný tento formát podporovať.

Tabuľkový zoznam vektorového grafického softvéru, mnoho položiek zoznamu podporuje SVG:

Nižšie je uvedený zoznam najpopulárnejších programov, ktoré vám umožňujú vytvárať a upravovať SVG.

Inkscape (Inkscape)

Inkscape je program na vytváranie a úpravu vektorových obrázkov, ktorého hlavnou náplňou je tvorba technických ilustrácií a diagramov. Napísané v C++ a GTK+. Schopný uložiť vytvorené obrázky vo formáte SVG 1.1. Inscape je vydaný pre mnohé platformy (Windows, Linux, Mac OS), patrí do kategórie bezplatných softvér, distribuovaný pod GNU General Public License.

Program vám umožňuje používať všetky filtre a nástroje potrebné pre dizajnéra: geometrické primitíva (polygóny, kruhy, čiary, krivky, kocky atď.), štetce, výplne, guma. Okrem toho vizuálny editor, existuje aj textový, ktorý umožňuje vizuálne vidieť a upravovať strom XML prvkov.

Inkscape sa aktívne vyvíja už dlhé roky, vývojári sú v kontakte a vymieňajú si skúsenosti s kolegami z Gimpu, Scribusu.

Inkscape pre akýkoľvek OS si môžete zadarmo stiahnuť na oficiálnej stránke inkscape.org.

Image Magick

Takmer všetky funkcie Image Magick, grafického nástroja konzoly, sa vzťahujú aj na SVG. Image Magick je zadarmo, existujú knižnice pre mnoho aplikácií, ktoré vám umožňujú kontaktovať tento nástroj prostredníctvom vlastného rozhrania. Napríklad - Imagick v PHP.

Platené programy pre prácu s SVG

Adobe Illustrator CS2

Vyvinutý spoločnosťou "Adobe Systems, Inc." Adobe Illustrator CS2 prichádza s výkonnými nástrojmi na úpravu SVG. Program nie je zadarmo a už vôbec nie lacný, stojí viac ako 600 dolárov, ale má bezplatnú demo verziu obmedzenú na 30 dní. Na prvý pohľad sa zdá, že neponúka veľa v spôsobe práce s SVG cez Inkscape, okrem toho, že nadšenci Photoshopu ocenia mieru podobnosti medzi týmito dvoma programami. Nepochybne Adobe na dlhú dobu svojej práce vytvorili najpohodlnejšie rozhranie pre dizajnérov.

CorelDRAW Graphics Suite

S vývojom SVG nemohla Corel Corp. stáť bokom. Sada CorelDRAW Graphics Suite obsahuje podporu pre škálovateľnú vektorovú grafiku. Cena je takmer 300 dolárov, ale existuje demo verzia. Vydané len pre Windows.

Corel tiež ponúka kúpu Corel WebDraw (Jasc WebDraw), program viac zameraný na vektorovú webovú grafiku a profesionálnych webdizajnérov. Cena je 180 dolárov.

Sketsa SVG editor

Celý program je napísaný v jazyku Java a beží pod Windows, Linux, Mac OS. Na rozdiel od iných vektorových grafických programov vo všeobecnosti je Sketsa striktne orientovaná na SVG. Má pomerne príjemné a užívateľsky prívetivé rozhranie. Stojí však takmer 90 dolárov.

Mayura Žreb 4.3

Existujú aj jednoduchšie platené riešenia. Napríklad - Mayura Draw za 39 dolárov, veľkosť distribučnej súpravy je iba 1,3 mb. Program podporuje všetky hlavné nástroje na úpravu grafiky SVG, jednoduché a relatívne rýchle.

Online editor SVG

Pri kopírovaní materiálu uveďte aktívny odkaz na článok.

Prezentačné formáty vektorovej grafiky dávajú dizajnérom a umelcom obrovské príležitosti, ale prítomnosť mnohých proprietárnych formátov pre rôzne grafické editory spôsobuje vážne ťažkosti pri výmene súborov.

Preložiť napríklad formát SVG do AI alebo PDF do AI, aby ste mohli pracovať v známom formáte, môže byť pre vás skutočný problém. Ďalšia možnosť je tiež možná, keď budete požiadaní o odoslanie práce vo formáte, ktorý váš grafický editor nedokáže exportovať, napríklad budete musieť previesť formát AI na vektor SVG. Ale s našou službou to nie je problém a ponúkame vám online konvertor, ktorý dokáže previesť vektorovú grafiku nasledujúcich formátov: AI, CDR, CDT, CCX, CMX, SVG, FIG, CGM, AFF, WMF, SK, SK1, PLT, DXF, DST, PES, EXP, PCS.

S našim online službu zabudnete, že úloha prevodu vektora do iného formátu môže spôsobiť určité ťažkosti. Ak chcete preložiť napríklad eps do ai, stačí vybrať súbor v počítači alebo poskytnúť odkaz naň, potom vybrať požadovaný formát a kliknúť na tlačidlo „previesť“. Za pár sekúnd si môžete stiahnuť vektor v požadovanom formáte z našej stránky do svojho počítača.

Na prevod grafických vektorových súborov používa náš online konvertor balík UniConvertor, ktorý podporuje väčšinu vektorových formátov. Konverzia súborov vektorového formátu Corel Draw (CDR) je realizovaná pomocou grafického balíka LibreDraw, ktorý poskytuje kvalitnú prácu s formátom a podrobnejšie sa s ním môžete zoznámiť preštudovaním nášho materiálu „Konverzia z CDR (Corel Draw )“. Môžete sa tiež stretnúť s úlohou previesť raster na vektor, napríklad potrebujete previesť jpg na ai alebo png na ai, čo môžete tiež ľahko urobiť na našej službe. Stačí zadať obrázok v rastrovom formáte ako zdrojový súbor, vybrať požadovaný vektorový formát a náš konvertor vykoná túto konverziu za vás v priebehu niekoľkých sekúnd. Ako program sledovania rastra na vektor naša služba využíva softvérový produkt Potrace. Viac o možnostiach sledovača Potrace sa dozviete v našom článku „ Konverzia grafického obrázka na vektorový formát“. S našou službou môžete vždy voľne prevádzať vektorové obrázky medzi formátmi bez toho, aby ste sa museli obávať inštalácie ďalšieho softvéru do počítača.

Podporované formáty vektorovej grafiky:

SVG (Scalable Vector Graphics) je veľmi výkonný škálovateľný vektorový grafický súbor napísaný v značkovacom jazyku XML. Poďme zistiť, aké softvérové ​​riešenia možno použiť na zobrazenie obsahu objektov s týmto rozšírením.

Vzhľadom na to, že Scalable Vector Graphics je grafický formát, je prirodzené, že prezeranie týchto objektov podporujú predovšetkým prehliadače obrázkov a grafické editory. Napodiv, stále vzácni diváci obrázkov sa vyrovnávajú s úlohou otvorenia SVG, pričom sa spoliehajú iba na svoju vstavanú funkčnosť. Okrem toho je možné objekty študovaného formátu prezerať pomocou niektorých prehliadačov a množstva ďalších programov.

Metóda 1 Gimp

Najprv sa pozrime na to, ako zobraziť výkresy študovaného formátu v bezplatnom grafickom editore Gimp.

Metóda 2: Adobe Illustrator

Ďalším programom, ktorý dokáže zobrazovať a upravovať obrázky tohto formátu, je Adobe Illustrator.

Metóda 3: XnView

Vzhľadom na prehliadače obrázkov, ktoré pracujú so skúmaným formátom, začneme programom XnView.

Existuje ďalší spôsob, ako zobraziť SVG v XnView. Vykonáva sa pomocou vstavaného prehliadača.

Metóda 4: IrfanView

Ďalším prehliadačom obrázkov, na príklade ktorého sa pozrieme na prezeranie typu študovaných výkresov, je IrfanView. Na zobrazenie SVG v uvedenom programe je potrebný aj plugin CAD Image DLL, ktorý však na rozdiel od XnView nie je v uvedenej aplikácii pôvodne nainštalovaný.

Obrázok v tomto programe môžete zobraziť pretiahnutím súboru z "Prieskumník" na obal IrfanView.

Metóda 5: OpenOffice Draw

SVG dokáže zobraziť aj aplikácia Draw z kancelárskeho balíka OpenOffice.

Obrázok si môžete pozrieť aj pretiahnutím súboru do štartovacieho prostredia OpenOffice.

Môžete ho spustiť aj cez shell Draw.

Metóda 6: LibreOffice Draw

Podporuje škálovateľné zobrazenie vektorovej grafiky a konkurenta OpenOffice − kancelársky balík LibreOffice, ktorý obsahuje aj aplikáciu na úpravu obrázkov s názvom Draw.

Ďalší spôsob otvárania zahŕňa pretiahnutie súboru z Správca súborov do štartovacieho prostredia LibreOffice.

Aj v LibreOffice, rovnako ako v predchádzajúcom softvérovom balíku, ktorý sme opísali, si môžete prezerať SVG cez prostredie Draw.

Metóda 7: Opera

SVG je možné prezerať v rôznych prehliadačoch, pričom prvý sa nazýva Opera.

Metóda 8: Google Chrome

Ďalším prehliadačom, ktorý dokáže vykresliť SVG, je Google Chrome.

Metóda 9: Vivaldi

Ďalším webovým prehliadačom, ktorý bude použitý ako príklad na zobrazenie SVG, je Vivaldi.

Metóda 10: Mozilla Firefox

Poďme definovať, ako zobraziť SVG v inom populárnom prehliadači - Mozilla Firefox.

Metóda 11: Maxthon

Pomerne nezvyčajným spôsobom si môžete prezrieť SVG v prehliadači Maxthon. Faktom je, že v tomto webovom prehliadači je aktivácia otváracieho okna v podstate nemožná: ani pomocou grafických ovládacích prvkov, ani stlačením klávesových skratiek. Jediný spôsob, ako zobraziť SVG, je zadať adresu tohto objektu adresný riadok prehliadač.

nepochybne, túto možnosť otváranie vektorových kresieb lokálne umiestnených na pevnom disku je oveľa nepohodlnejšie a náročnejšie ako v iných prehliadačoch.

Metóda 12: Internet Explorer

Zvážte možnosti zobrazenia SVG aj pomocou príkladu štandardného prehliadača pre operačné systémy Rad Windows až po Windows 8.1 vrátane - Internet Explorer.

Napriek tomu, že SVG je vektorový formát obrázkov, väčšina moderných prehliadačov obrázkov ho nedokáže zobraziť bez inštalácie ďalších doplnkov. Tiež nie všetky grafické editory pracujú s týmto typom obrázkov. Takmer všetky moderné prehliadače však dokážu zobraziť tento formát, pretože bol vytvorený naraz, predovšetkým na uverejňovanie obrázkov na internete. Je pravda, že v prehliadačoch je možné iba prezerať a nie upravovať objekty so zadanou príponou.

Pre dizajn akejkoľvek webovej stránky je potrebná statická grafika a rôzne animačné a interaktívne prvky, ktoré po prvé poskytujú väčšiu atraktívnosť informácií na nej prezentovaných a po druhé prispievajú k lepšiemu vnímaniu materiálu.

Grafické informácie sa prenášajú oveľa pomalšie ako textové informácie a čas načítania obrázkov je priamo závislý od veľkosti ich grafických súborov, takže rýchle načítanie webových stránok znamená ich malú veľkosť. grafické obrázky. To posledné sa dosiahne optimálnym výberom formátu grafický súbor, ako aj z dôvodu optimalizácie, ktorej úlohou je nájsť kompromis medzi rýchlosťou načítania stránky a kvalitou obrázkov na nej prezentovaných. Možnosti optimalizácie však nie sú neobmedzené a vysokokvalitné obrázky bývajú veľké, takže dosiahnuť Vysoká kvalita obrázky prezentované na webe s ich malou veľkosťou sú stále vážnym problémom.

Otázkou však nie je len veľkosť a kvalita – vývoj dizajnu webovej stránky sa ukazuje ako záležitosť, ktorá od dizajnéra vyžaduje znalosť širokého spektra rôznorodých technológií a softvérových produktov, keďže napr. odlišné typy grafické informácie musia na svoju tvorbu využívať rôzne formáty súborov a rôzne technológie. Pre statickú grafiku sa používajú formáty GIF, JPG alebo PNG, ktoré je možné vytvárať v rôznych grafických balíkoch. Pre animované objekty sa používajú animačné formáty GIF a Flash a takéto objekty sa vyvíjajú v špecializovanom prostredí softvérové ​​aplikácie(špeciálne pre každý z vymenovaných typov formátu). Interaktívne prvky (rollovery, odkazové mapy ImageMap a pod.) sa tiež spravidla vytvárajú v špecializovaných aplikáciách a predstavujú súbor grafických obrázkov, medzi ktorými je vzťah vytvorený v doplnkovom súbore s HTML kódom.

Úspešným riešením týchto problémov môže byť prechod na grafický formát SVG (Scalable Vector Graphics - škálovateľná vektorová grafika), založený na jazyku XML, takže každý obrázok SVG môže byť reprezentovaný množinou príkazové riadky(obr. 1) a samotný súbor SVG je možné otvoriť v ľubovoľnom textovom editore vrátane poznámkového bloku. Toto relatívne Nová technológia pôvodne vyvinutý spoločnosťou Adobe špeciálne pre web a dnes je oň veľký záujem pre mobilné zariadenia, pričom poskytuje tvorbu vysokokvalitnej statickej, animovanej a interaktívnej grafiky. Preto nie je prekvapujúce, že ho aktívne podporuje konzorcium W3C (http://www.w3.org/Graphics/SVG) – v roku 2003 bol štandard SVG 1.1 prijatý W3C ako odporúčanie a na v momente vývoja špecifikácie SVG 1.2 (http://www.w3.org/TR/SVG12/).

Technológia SVG umožňuje kombinovať text, grafiku, animáciu a interaktívne komponenty v jednom formáte a je založená na troch typoch grafických obrázkov: vektorové tvary, kresby a text. Formy, ako je vo vektorovej grafike zvykom, sú buď priamočiare a krivočiare obrysy, alebo grafické primitíva (obdĺžniky, elipsy atď.) a kresby sú importované bitmapové obrázky. Okrem toho podporuje formát SVG rôzne druhy animované (pripomínajúce GIF a flash animácie) a interaktívne objekty, ako sú rollovery, mapy odkazov a ďalšie navigačné prvky. A odvtedy tento štandard je založený na jazyku XML, potom môže súbor SVG spolu s prvkami určenými na vizuálne zobrazenie obsahovať aj rôzne metadáta.

Výhody a nevýhody používania formátu SVG

Používanie formátu SVG vám umožňuje vyvíjať menšiu, rýchlejšie sa načítavajúcu, vysokokvalitnú a všestrannú grafiku pre web a mobilné zariadenia, ktorú nemôže poskytnúť žiadny iný grafický formát. Medzi hlavné výhody grafického formátu SVG patria:

• obrázky vysokej kvality bez ohľadu na ich veľkosť, vďaka vektorovej povahe formátu SVG. Obrázky je možné neobmedzene zmenšovať alebo zväčšovať bez straty kvality (obr. 2) v súlade s veľkosťou displeja, čo umožňuje získať kvalitný obraz grafických informácií na rôznych typoch zariadení (stolné počítače, PDA atď.). ), a tiež umožňuje dôkladnejšie skúmať jednotlivé detaily - to je dôležité napríklad pri práci s technickými výkresmi;
• oveľa menšie veľkosti súborov v porovnaní s formátmi GIF, JPG, PNG a animáciou GIF a ešte viac s formátom Flash. Napríklad, ak bol testovaný súbor GIF komprimovaný LZW pre článok 26 kB, potom veľkosť zodpovedajúceho súboru SVG mala 1 220 bajtov a po komprimácii vo formáte SVGZ to bolo iba 685 bajtov.

Ale nie je to len tak. V porovnaní s tradičnými možnosťami grafické znázornenie Na webe má použitie formátu SVG mnoho ďalších nepopierateľných výhod.

Takže pre vývojárov sú dôležité výhody:

• možnosť kombinácie vývoja statických, animovaných a interaktívnych prvkov v jednom formáte, ako aj kombinácie vektorových a rastrových objektov;
• vylepšené spracovanie textu, vrátane kerningu, zakriveného textu a neobmedzeného počtu písiem;
• viac efektívne riadenie presnosť farieb a najširšie možnosti z hľadiska použitia prechodových výplní vo webových obrázkoch s vysokým rozlíšením, tiene, filtre atď.;
• textová povaha formátu SVG a jeho podpora pre kaskádové štýly, čo značne zjednodušuje proces aktualizácie webovej stránky a umožňuje vám v prípade potreby vykonať zmeny bez potreby špeciálne programy;
• integrácia s databázami postavenými na štandardoch XML (Extensible Markup Language) a CSS (Cascading Style Sheets), ktorá umožňuje ukladať obrázky SVG do databázy a vytvárať pomocou nich dynamické webové stránky – rôzne pre rôzne platformy, osobné nastavenia atď. d. ;
• žiadne problémy s indexovaním – súbory SVG sú indexované akýmikoľvek vyhľadávacími nástrojmi (na rozdiel napríklad od súborov SWF).

Používatelia si užijú vysokú kvalitu a rýchle načítanie SVG obsahu. Okrem toho je možné skopírovať text nachádzajúci sa na obrázku SVG, a tým uložiť niektoré užitočné informácie, ako aj vyhľadávať text v obrázku, čo môže byť v niektorých prípadoch mimoriadne potrebné, napríklad pri hľadaní požadovaného meno na mape alebo kresbe.

Avšak, ako obvykle, spolu s výhodami technológie SVG existujú aj nevýhody, a to veľmi vážne.

• Výrobcovia internetových prehliadačov nepodporujú obrázky SVG. Výsledkom je, že na zobrazenie grafiky SVG z prehliadača sú používatelia nútení dodatočne nainštalovať doplnok tretej strany, ktorý túto možnosť poskytuje, ako napríklad SVG Viewer od spoločnosti Adobe. Teoreticky to nie je ťažké - príslušné zásuvné moduly sa ľahko inštalujú, sú bezplatné, majú malú veľkosť a dajú sa rýchlo stiahnuť cez web. V praxi je všetko oveľa komplikovanejšie, pretože väčšina používateľov internetu o existencii týchto funkcií nevie, a preto ich nemôže zobraziť tento druh grafika - bez pluginu to jednoducho nevidno. Situácia sa však postupne mení a v uplynulom roku dvaja poprední vývojári webových prehliadačov zaviedli podporu formátu SVG. Na jar Opera Software vydala verziu 8 Prehliadač Opera, ktorý podporuje SVG 1.0 Tiny; vo verzii Opera 9.0, ktorá sa objavila o niečo neskôr, bola implementovaná čiastočná podpora formátu SVG 1.0 Basic. Druhým vývojárom, ktorý zahrnul podporu pre SVG, bola Mozilla Organization – modul projektu Mozilla SVG, ktorý poskytuje prezeranie grafiky SVG špecifikácie 1.1, bol zahrnutý v prehliadači Firefox 1.5. Okrem toho v polovici roku 2005 vývojári prehliadača Safari bežiaceho na počítačoch pod Ovládanie Mac OS X;
• v porovnaní s inými grafickými formátmi je formát SVG stále slabo podporovaný vývojármi grafického softvéru, hoci popredné grafické balíky ako Adobe Illustrator, CorelDRAW atď. umožňujú exportovať grafiku do súborov SVG. Súbory SVG je samozrejme možné vytvárať v akomkoľvek textovom editore, čo je však z hľadiska rýchlosti a lacnosti vývoja nepraktické. V prípade potreby je vhodné súbor upravovať v textovom editore (čo je mimochodom možné iba vtedy, ak máte hlboké znalosti technológie XML), ale nie je rozumné vytvárať ho od začiatku, pretože by to vyžadovalo príliš veľa času. a úsilie. To si vyžaduje jednoduché a pohodlné prostriedky na rýchle vizuálny vývoj grafika vo formáte Scalable Vector Graphics s možnosťou úpravy programového kódu zodpovedajúceho obrázku v rovnakom prostredí, ale takýchto produktov je veľmi málo a nie sú dostatočne známe.

V dôsledku toho vzniká veľmi smutná situácia - mnohí používatelia si stále nemôžu prezerať grafiku SVG kvôli nedostatočnej podpore webových prehliadačov na správnej úrovni, weboví vývojári prakticky nevyvíjajú grafiku SVG, bez ohľadu na to, aká je atraktívna, a vývojári softvéru nepripúšťajú webovým dizajnérom množstvo aplikácií zameraných špeciálne na SVG. Výsledkom je začarovaný kruh: „Ak neexistuje žiadny obsah, potom ľudia nepotrebujú implementáciu SVG, a ak nie je implementácia, potom nie je žiadny obsah“ - takto bola opísaná situácia na jednom zo stretnutí konzorcia W3C.

Na situáciu sa však môžete pozrieť aj z druhej strany: podpora SVG (aj keď ešte nie v plnom rozsahu) zo strany dvoch populárnych internetových prehliadačov, ako aj záujem o technológiu od popredných vývojárov naznačujú, že „ľady sa prelomili“ a SVG reálna šanca stať sa jedným z populárnych formátov na prezentáciu webových informácií. Táto šanca sa zvyšuje aj vďaka rastúcemu záujmu o technológiu SVG vo vzťahu k mobilným zariadeniam, kde sú požiadavky na veľkosť a kvalitu obrazu oveľa vyššie. Opera Software má napríklad v úmysle najskôr implementovať plná podpora SVG formát na desktopoch a až potom preniesť na mobilné platformy. Preto je načase zamyslieť sa nad využitím SVG a webových dizajnérov – inak im hrozí, že budú v blízkej budúcnosti medzi zaostávajúcimi.

Pluginy na prezeranie grafiky SVG

Ako už bolo spomenuté, väčšina používateľov bude musieť na zobrazenie SVG grafiky v celom rozsahu v okne internetového prehliadača použiť jeden z vhodných zásuvných modulov, z ktorých najznámejšie sú bezplatné moduly Adobe SVG Viewer a Corel SVG Viewer. Prvý z nich, Adobe SVG Viewer, prichádza ako samostatná aplikácia, je kompaktný a pohodlný, funguje ďalej rôzne platformy, podporuje veľké množstvo internetových prehliadačov, a preto je medzi používateľmi oveľa obľúbenejší. Corel SVG Viewer je súčasťou Corel Smart Graphics Studio, ale je dostupný aj ako freeware.

Existujú aj ďalšie možnosti prezerania grafiky SVG - môžete napríklad použiť zodpovedajúce moduly z balíkov Amaya (http://www.w3.org/Amaya/), Apache Batik (http://xml.apache.org /batik), KDE KSVG (http://www.kde.org) a ďalšie. Úplný zoznam prehliadačov SVG nájdete na stránke http://wiki.svg.org/Viewer_Implementations .

Adobe SVG Viewer

Vývojár: Spoločnosť Adobe Systems Inc.

Veľkosť distribúcie: 2,25 MB

Spôsob distribúcie: freeware (http://download.adobe.com/pub/adobe/magic/svgviewer/win/3.x/3.03/en/SVGView.exe)

Cena: je zadarmo

Pracujte pod kontrolou: Windows 95/98/Me/NT/2000/XP, Mac OS 8.6/9/X, Linux, Solaris

Podpora prehliadača: Internet Explorer 4.0 alebo novší, Netscape Navigator alebo Communicator 4.5 až 4.78 (okrem 6.x)

Corel SVG Viewer

Vývojár: Corel Corporation

Veľkosť distribúcie: 4,9 MB

Spôsob distribúcie: freeware (modul je možné stiahnuť na: http://www.corel.com/servlet/Satellite?pagename=Corel/Downloads/Details&id=1042152917172)

Cena: je zadarmo

Práca pod kontrolou: Windows 98/NT/2000/Me/XP

Podpora prehliadača: Microsoft Internet Explorer 5.5 a novší, Netscape Navigator alebo Communicator verzie 4.79, 7.02

Programy na vytváranie grafiky SVG

Všetky programy na vytváranie grafiky SVG možno rozdeliť do troch veľkých skupín. Prvá obsahuje obľúbené balíky dvojrozmernej grafiky, ktoré sú zamerané na prácu s vektorovou grafikou a zároveň umožňujú exportovať obrázky do formátu SVG. Najpopulárnejšie z nich sú Adobe Illustrator a CorelDRAW; okrem toho takýto export do tej či onej miery podporuje mnoho ďalších aplikácií: AutoCAD, Microsoft Visio atď. Hlavnou výhodou tejto skupiny aplikácií je, že majú pokročilé nástroje na vytváranie vektorových obrázkov a umožňujú vám dosiahnuť jedinečné efekty pomocou priehľadnosti, prechodových výplní, rôznych filtrov atď. Tieto aplikácie však vyžadujú seriózne špeciálne školenie a, teda vo väčšej miere určené pre profesionálnych dizajnérov. Navyše sa vo všeobecnosti nezameriavajú na dizajn SVG (hoci umožňujú získať grafiku vo formáte Scalable Vector Graphics) - poskytujú pohodlné vizuálne vytváranie a zobrazovanie obrázkov, tieto aplikácie neumožňujú ich úpravu v texte. úroveň, čo platí pre grafy SVG. Podstatné je aj to, že v nich nie je plne implementovaná podpora formátu Scalable Vector Graphics, v dôsledku čoho nie je možné bezchybne exportovať všetky prvky vektorového obrázka do SVG.

Druhú skupinu softvérových produktov tvoria balíky určené výhradne na tvorbu SVG grafiky. Majú oveľa menšie možnosti z hľadiska vizuálneho vývoja vektorových obrázkov, hoci obsahujú všetky potrebné nástroje. Ale na druhej strane poskytujú pohodlné prostriedky na úpravu zdrojového kódu a umožňujú paralelnú prácu s objektmi SVG – vo vizuálnom režime aj na úrovni kódu a medzi týmito možnosťami prezentácie informácií môžete jednoducho prepínať. Všetky aplikácie z tejto skupiny sú veľmi jednoduché a prístupné a ich zvládnutie si nevyžaduje veľa času. Navyše majú relatívne malé distribúcie (v porovnaní s aplikáciami prvej skupiny), takže sa dajú bez problémov zakúpiť aj cez internet. Existuje však veľmi málo programov s takýmito schopnosťami a nižšie sa budeme podrobne zaoberať iba štyrmi, ktoré sú najviac zaujímavé a sú určené pre rôzne kategórie používateľov. OD úplný zoznam aplikácie dostupné na vytváranie grafiky SVG nájdete na: http://wiki.svg.org/Design_Tools.

A napokon do tretej skupiny môžeme zaradiť ľubovoľné textové editory vrátane bežného poznámkového bloku. Ako je uvedené vyššie, formát Scalable Vector Graphics je založený na XML, čo vám v prípade potreby umožňuje vytvárať a upravovať súbory SVG na úrovni textu v textovom editore.

Plnohodnotné grafické aplikácie, ktoré vám umožňujú vytvárať grafiku SVG

Adobe Illustrator CS2

Vývojár: Spoločnosť Adobe Systems Inc.

Veľkosť distribúcie: Verzia pre Macintosh - 428,9 MB, verzia pre Windows - 398,6 MB

Spôsob distribúcie: shareware (30-dňová ukážka balíka je dostupná na: http://www.adobe.com/products/tryadobe/main.jsp#product=27)

Cena: 665 dolárov

Práca pod kontrolou: Windows 2000 s balíkom Service Pack 3 alebo Windows XP, Mac OS X 10.2.4 až 10.2.7, Java Runtime Environment 1.4.1

Počnúc 9. verziou implementuje Adobe Illustrator (obr. 3) import a export súborov SVG, a to na oveľa vyššej úrovni ako podobné. grafické aplikácieúrovni. Balík podporuje všetky existujúce špecifikácie SVG, kódovanie ISO 8859-1, UTF-8 a UTF-16, rôzne možnosti exportu textu a umožňuje exportovať obrázky v bežnom formáte SVG aj v komprimovanom formáte SVGZ.

V SVG grafike vytvorenej v jej prostredí môžete využiť prechody, priehľadnosť, ako aj celý rad SVG efektov špeciálne upravených na to (Efekt=>SVG filtre) vo forme rôznych tieňov, rozostrení atď. efekty si zachovávajú jasnosť pri prezeraní vo webovom prehliadači pri akomkoľvek zväčšení. Okrem statiky ilustrátorská grafika umožňuje získať interaktívnu grafiku vo formáte SVG - na tento účel je k dispozícii špeciálna paleta Interaktivita SVG (môžete ju otvoriť z ponuky Okno => Interaktivita SVG), ktorá nastavuje akcie pre interaktívne objekty. Stojí za zmienku, že práca na interaktívnych prvkoch SVG v Illustratore vyžaduje znalosť jazyka Java Script a pochopenie základných princípov objektovo orientovaného programovania. Okrem toho pomocou formátu Scalable Vector Graphics v tomto programe môžete vytvárať dynamickú dátovú grafiku (Dynamic Data-Driven Graphics).

CorelDRAW Graphics Suite 12

Vývojár: Corel Corp.

Veľkosť distribútora tiva: 200 MB

Spôsob distribúcie: shareware (demo verziu si môžete stiahnuť z online obchodov, napríklad na: http://allsoft.ru/Download.php?ver=17605)

Cena: 290 dolárov (Allsoft.ru)

Práca pod kontrolou: Windows NT/2000/XP

Známa aplikácia na vývoj profesionálnej vektorovej grafiky CorelDRAW (obr. 4), ktorá je súčasťou balíka CorelDRAW Graphics Suite 12, poskytuje na základnej úrovni import a export vo formátoch SVG a SVGZ, a preto ju možno použiť na vytváranie statických a interaktívnu grafiku SVG.

Aplikácia implementuje podporu pre nerozpoznané údaje, atribúty a metadáta a tiež poskytuje možnosť Náhľad SVG súbory v prehliadači pred exportom. Okrem toho je možné použiť kódovanie Unicode pre metódy kódovania UTF-8 a UTF-16 a rôzne možnosti exportu textu a bitmapových obrázkov. Najnovšia verzia výrazne zlepšila podporu exportu symbolov, textu, tieňov, ciest, vrstiev, vložených binárnych obrázkov a ďalších.

Mayura Žreb 4.3

Vývojár: Softvér Mayura

Veľkosť distribúcie: 1,3 MB

Spôsob distribúcie: shareware (demo verzia - http://www.mayuradraw.com/mdraw.zip)

Cena: 39 dolárov

Práca pod kontrolou: Windows 95/98/Me/NT/2000/XP

Mayura Draw (obrázok 5) je veľmi jednoduchý a lacný vektorový grafický program určený pre širokú verejnosť. Vektorové obrázky získané v ňom, ak je to potrebné, je možné exportovať do formátu SVG, a preto sa môže stať Mayura Draw možné riešenie na vývoj statickej grafiky SVG. Program podporuje všetky hlavné nástroje vektorovej grafiky a umožňuje vám získať vektorové obrázky založené na grafických primitívoch, lineárnych a krivočiarych obrysoch a texte. Zoznam jeho funkcií zahŕňa pohodlné nástroje na zarovnávanie, rozmiestňovanie a usporiadanie objektov, ovládanie priehľadnosti, používanie vodítok a pravítok na presné umiestňovanie objektov a rôzne transformácie.

Špecializované balíky na vytváranie grafiky SVG

EvolGrafiX XStudio 6.1

Vývojár: EvolGrafiX

Veľkosť distribúcie: 7,25 MB

Spôsob distribúcie: http://www.evolgrafix.de/htDocs/files/trials/xstudio6x/XStudio6-Trial.exe)

Cena: 449 USD komerčná licencia, 249 USD akademická licencia

Práca pod kontrolou: Windows 2000/XP

Profesionálny balík XStudio (obr. 6) je pohodlný nástroj na vytváranie rôznorodej grafiky SVG pre web a mobilné zariadenia a poskytuje plnú kontrolu nad projektom SVG ako celkom, ako aj nad vektorovými obrázkami, animáciami, skriptami atď. užívateľsky prívetivé, intuitívne a ľahko prispôsobiteľné užívateľské rozhranie, poskytuje širokú škálu nástrojov, Má vysoká rýchlosť funguje, umožňuje vám vytvárať grafiku SVG všetkých existujúcich špecifikácií a podporuje všetky štýly škálovateľnej vektorovej grafiky. To všetko v kombinácii s relatívne nízkou cenou za profesionálny balík nám umožňuje považovať ho za najlepšie profesionálne riešenie tohto druhu. XStudio prichádza s podrobnou dokumentáciou, doplnenou o sériu tutoriálov, a je ľahké sa ho naučiť.

Ryža. 6. Spojenie vizuálnej tvorby obrazu s úpravou zdrojového kódu
v EvolGrafiX XStudio

Aplikácia má všetky potrebné funkcie na vytváranie a spracovanie vektorových obrázkov a v tomto smere je veľmi podobná balíku Adobe Illustrator. XStudio je zároveň zamerané priamo na prípravu statickej, interaktívnej a animovanej SVG grafiky, a preto je spolu s klasickými nástrojmi na prácu s vektorovými objektmi doplnené o špecifické schopnosti SVG. vstavaný panel nástrojov Document Object Model (DOM) poskytuje hierarchické znázornenie objektov SVG, pohodlný editor XML umožňuje opraviť zdrojový kód na úrovni textu a editor skriptov umožňuje jeho doplnenie o Java skripty. Práca s kódom je organizovaná veľmi pohodlne: fragmenty kódu vybraného objektu sa automaticky zvýrazňujú, je možné vyhľadávať text a nastavovať záložky atď. Akékoľvek zmeny kódu sa okamžite prejavia vo vizuálnom prezeracom okne a vizuálne zmeny sa prejavia odráža v okne editora.

inkscape

Vývojár: IOSN (International Open Source Network)

Veľkosť distribúcie: 8,7 MB

Cena: je zadarmo

Práca pod kontrolou: Windows 9x/NT/2000/XP, Mac OS X, Linux

Inkscape (obr. 7) je najsľubnejší vektorový editor založený na modeli Open Source, ktorý je multiplatformový a je výkonným nástrojom na vývoj grafiky v súlade so štandardom Scalable Vector Graphics. S ich funkčnosť práca s vektorovými obrázkami, ako aj rozhranie, Inkscape je veľmi podobný CorelDRAW. Implementuje podporu pre alfa kanály, prácu s vrstvami, používanie plávajúceho textu, veľkolepé prechodové výplne, veľké číslo filtre a efekty, rôzne transformácie, pohodlná práca s kontúrami a objektmi, zoskupovanie objektov a mnoho iného. Je možné importovať údaje z súbory JPEG, PNG a TIFF a ich vkladanie do obrázkov SVG.

Na rozdiel od CorelDRAW je však Inkscape umiestnený ako aplikácia pre SVG dizajnérov, takže spolu s klasickou vizuálnou tvorbou grafiky poskytuje možnosť priamo spracovávať XML kód vo vstavanom prostredí textového editora. Program je nakonfigurovaný tak, aby ukladal obrázky ako bežné a komprimované súbory SVG, hoci ich možno v prípade potreby previesť na bežné vektorové a rastrové formáty.

Balík Inkscape má pohodlné rusifikované rozhranie, ľahko sa učí a prichádza s dobrým systém pomoci, ktorá zahŕňa množstvo príkladov použitia a okrem toho túto aplikáciu zadarmo - to všetko ho robí veľmi atraktívnym pre široké spektrum používateľov. Hlavnou nevýhodou programu je nízka rýchlosť a zvýšené nároky na systémové prostriedky.

Corel WebDraw

Vývojár: Corel Corporation

Veľkosť distribúcie: 15,6 MB

Spôsob distribúcie: shareware (30-dňová ukážka – http://www5.jasc.com/pub/wdw102ev.exe)

Cena: 179 dolárov na stiahnutie, 199 dolárov CD

Práca pod kontrolou: Windows 98/NT4/2000/Me/XP

Corel WebDraw (obrázok 8), lepšie známy ako Jasc WebDraw, je komplexné vysokokvalitné riešenie grafiky a animácií SVG pre profesionálnych dizajnérov. A intuitívne rozhranie programu ho robí atraktívnym pre široké spektrum používateľov.

Aplikácia má rozsiahlu sadu štandardných grafických nástrojov, ktoré sú typické pre plnohodnotnú vektorovú grafickú aplikáciu: základné tvary (elipsa, obdĺžnik, hviezda atď.), pero, mnohouholník, lomená čiara, text atď. Spolu s vektorovými objektmi vám WebDraw umožňuje doplniť objekty SVG externými bitmapami. Okrem obvyklých výplní a uloženia hotových štýlov môžete použiť zložité prechody, výplne vrátane vzorov vytvorených sami. Ak chcete získať pôsobivejšie obrázky, môžete použiť filtre – pomerne jednoduché (rozmazanie a tieňovanie), ako aj zložité (textúrovanie a osvetlenie). Mriežky, vodidlá a pravítka slúžia na presné umiestnenie objektov, zatiaľ čo vstavaný panel s nástrojmi Document Object Model (DOM) zobrazuje objekty SVG v hierarchickom strome, čo výrazne zjednodušuje správu.

WebDraw je vybavený univerzálnym storyboardom Animation Timeline, ktorý je postavený na základe objektového modelu SVG DOM (Document Object Model), ktorý vám umožňuje kedykoľvek vybrať a animovať takmer akýkoľvek atribút alebo vlastnosť objektu všetkých typov. . Mechanizmus drag and drop vám umožňuje priamo na časovej osi upravovať počiatočné a koncové body animácie, ako aj trvanie každej fázy animácie. Keďže animácie kľúčového času sa vkladajú zakaždým, keď nastavíte možnosti animácie pre atribút alebo vlastnosť objektu, možno ich presunúť do iných častí scenára za účelom automatické ladenie rozloženie efektov animácie v čase.

Balík vám umožňuje pracovať s grafikou SVG v dvoch verziách: so sadou vizuálne zobrazených grafických objektov a so zodpovedajúcim zdrojovým kódom. Úprava zdrojového kódu vo vstavanom textovom editore pre súbory SVG poskytuje dodatočnú flexibilitu a kontrolu nad obsahom súborov. Automatická kontrola zmeny v zdrojovom kóde pomáhajú zabezpečiť zaručenú správnosť správania vytvorenej grafiky a nájdené chyby sú farebne označené, čo dizajnérovi ušetrí mnoho hodín hľadania medzi stovkami riadkov kódu. Výsledok akýchkoľvek zmien v zdrojovom kóde sa okamžite zobrazí na obrazovke. Voliteľne môže WebDraw importovať, upravovať a optimalizovať súbory SVG vytvorené v iných aplikáciách.

Sketsa SVG Editor 3.2.3

Vývojár: KIYUT

Veľkosť distribúcie: 5,99 MB

Spôsob distribúcie: shareware

Cena: 49 dolárov

Pracujte pod kontrolou: Windows 2000/XP, Java VM (JRE) 1.5 alebo vyšší (http://www.java.com/getjava), UNIX a Linux

Aplikácia Sketsa (obr. 9) je jedným z najpopulárnejších editorov SVG a umožňuje vytvárať profesionálnu grafiku SVG, vrátane tej optimalizovanej vo formáte SVGZ. Balík úspešne kombinuje jednoduchosť a pohodlie so širokou škálou funkcií a je kompatibilný so systémami Windows, Mac a Linux.

Sketsa podporuje klasickú sadu nástrojov typických pre každú vektorovú aplikáciu, ktorá vám umožňuje vytvárať a transformovať akékoľvek vektorové objekty na základe kontúr aj grafických primitív a textu, ktoré je možné v prípade potreby jednoducho doplniť rastrovými obrázkami. Je možné ovládať priehľadnosť, používať prechodové výplne a filtre. To všetko úspešne dopĺňajú špecializované schopnosti SVG, vďaka ktorým je možné ľubovoľný obrázok upravovať nielen vizuálne, ale aj v textovom režime. Ak chcete upraviť kód SVG, balík má vstavaný textový editor xml. Pre pohodlie správy objektov je tu zabudovaný panel s nástrojmi Document Object Model (DOM), čo je hierarchická stromová množina objektov v dokumente SVG, ktorá vám umožňuje vybrať ľubovoľný objekt v dokumente a upraviť jeho vlastnosti. .