Na navrhnutie akejkoľvek webovej stránky je potrebná statická grafika a množstvo animácií a interaktívnych prvkov, ktoré v prvom rade zatraktívňujú informácie na nej uvedené, a za druhé, prispievajú k lepšiemu vnímaniu materiálu.
Grafické informácie sa prenášajú oveľa pomalšie ako textové informácie a doba načítania obrázkov je priamo úmerná veľkosti ich grafických súborov, preto rýchle načítanie webových stránok znamená malú veľkosť vložených grafických obrázkov. To posledné sa dosahuje optimálnym výberom formátu grafický súbor, ako aj prostredníctvom optimalizácie, ktorej úlohou je nájsť kompromis medzi rýchlosťou načítania stránky a kvalitou obrázkov na nej uvedených. Možnosti optimalizácie však nie sú neobmedzené a vysokokvalitné obrázky majú spravidla pôsobivý objem, v dôsledku čoho je dosiahnuté Vysoká kvalita obrázky zobrazené na webe sú napriek malým rozmerom stále vážnym problémom.
Otázka však nie je len vo veľkosti a kvalite - vývoj dizajnu webovej stránky sa ukazuje ako záležitosť, ktorá vyžaduje, aby dizajnér poznal širokú škálu rôznych technológií a softvérových produktov, pretože pre rôzne typy grafických informácií je to Na ich vytvorenie je potrebné použiť rôzne formáty súborov a rôzne technológie. Na statickú grafiku sa používajú formáty GIF, JPG alebo PNG, ktoré je možné vytvárať v rôznych grafických balíkoch. Pri animovaných objektoch sa používajú animačné formáty GIF a Flash a tieto objekty sa vyvíjajú špecializovane softvérových aplikácií(špecifické pre každý z uvedených typov formátov). Interaktívne prvky (rollovery, ImageMaps atď.) Sú spravidla vytvárané aj v špecializovaných aplikáciách a predstavujú súbor grafických obrázkov, ktorých spojenie je nadviazané v doplnkovom súbore s kódom HTML.
Úspešným riešením týchto problémov môže byť prechod na grafiku Formát SVG(Scalable Vector Graphics), založené na XML, takže akýkoľvek obrázok SVG môže byť reprezentovaný ako sada príkazové riadky(Obrázok 1) a samotný súbor SVG je možné otvoriť v ľubovoľnom textovom editore vrátane poznámkového bloku. Túto relatívne novú technológiu pôvodne vyvinula spoločnosť Adobe špeciálne pre web a dnes je o ňu veľký záujem mobilné zariadenia, ktorá 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 prijala W3C štandard SVG 1.1 ako odporúčanie a na tento momentŠpecifikácia SVG 1.2 je vo vývoji (http://www.w3.org/TR/SVG12/).
so zodpovedajúcim obrázkom
Technológia SVG vám umožňuje kombinovať textové, grafické, animačné a interaktívne komponenty v jednom formáte a je založená na troch typoch grafických obrázkov: vektorových tvaroch, obrázkoch a texte. Tvary, ako je obvyklé vo vektorovej grafike, sú reprezentované buď rovnými alebo zakrivenými kontúrami, alebo grafickými primitívami (obdĺžniky, elipsy atď.) A obrázky sú importované bitové mapy. Formát SVG navyše podporuje rôzne typy animácií (pripomínajúce GIF a flash animácie) a interaktívne objekty, ako sú rollovery, mapy odkazov a ďalšie navigačné prvky. A odkedy tento štandard je založený na XML, súbor SVG spolu s prvkami určenými na vizuálne zobrazenie môže obsahovať aj rôzne metadáta.
Výhody a nevýhody používania formátu SVG
Použitie formátu SVG vám umožňuje vyvinúť kompaktnejšie, rýchlejšie sa načítavajúce, vysokokvalitné a univerzálne grafické prvky pre web a mobilné zariadenia, ktoré žiadny iný grafický formát nemôže poskytnúť. Medzi hlavné výhody grafického formátu SVG patria nasledujúce:
- obrázky vysokej kvality bez ohľadu na ich veľkosť kvôli 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 vám umožní získať vysokokvalitný obraz grafických informácií o rôznych typoch zariadení (stolné počítače, vreckové počítače atď.) .), a tiež umožňuje starostlivejš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ácie GIF, a ešte viac vo formáte Flash. Ak bol napríklad súbor GIF testovaný na článok komprimovaný v režime kompresie LZW 26 kB, veľkosť zodpovedajúceho súboru SVG bola 1220 bajtov a pri kompresii 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ého znázornenia webu má použitie formátu SVG mnoho ďalších nesporných výhod.
Pre vývojárov sú teda dôležitými výhodami:
- možnosť kombinovať v jednom vývojovom formáte statické, animačné a interaktívne prvky, ako aj kombináciu vektorových a rastrových objektov;
- zdokonalená práca s textom vrátane párovania, zakriveného textu a neobmedzeného používania písem;
- efektívnejšia kontrola presnosti farieb a najširšie možnosti z hľadiska použitia gradientových výplní s vysokým rozlíšením, tieňov, filtrov atď. vo webových obrázkoch;
- textová povaha formátu SVG a jeho podpora kaskádových štýlov, čo výrazne zjednodušuje proces aktualizácie webovej stránky a v prípade potreby umožňuje vykonať na nej zmeny bez použitia špeciálnych programov;
- integrácia s databázami XML (Extensible Markup Language) a CSS (Cascading Style Sheets), ktorá vám 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ď.;
- žiadne problémy s indexovaním - súbory SVG sú indexované akýmkoľvek vyhľadávacím nástrojom (na rozdiel napríklad od súborov SWF).
Používatelia ocenia vysokú kvalitu a rýchle načítanie obsahu SVG. Okrem toho je možné skopírovať text umiestnený na obrázku SVG, a tým si uložiť niekoľko užitočných informácií pre seba, ako aj vyhľadať text v obrázku, ktorý môže byť v niektorých prípadoch mimoriadne potrebný, napríklad pri hľadaní požadované meno na mape alebo kresbe ...
Napriek tomu, ako obvykle, spolu s plusmi technológie SVG existujú aj mínusy a veľmi vážne.
- Dodávatelia webového prehliadača slabo podporujú obrázky SVG. Výsledkom je, že aby si používatelia mohli prezerať grafiku SVG z prehliadača, sú nútení dodatočne nainštalovať doplnok tretej strany, ktorý poskytuje túto funkciu, napríklad program Adobe SVG Viewer. Teoreticky to nie je ťažké - zodpovedajúce doplnky sa ľahko inštalujú, sú bezplatné, majú malý objem a dajú sa rýchlo stiahnuť cez internet. V praxi je všetko oveľa komplikovanejšie, pretože väčšina používateľov internetu nevie o existencii týchto možností, a preto nemôže zobrazovať daný pohľad grafika - bez doplnku to jednoducho nie je vidieť. Situácia sa však postupne mení a v minulom roku implementovali podporu formátu SVG dvaja poprední vývojári webových prehliadačov. Na jar Opera Software vydal verziu 8 prehliadača Opera s podporou SVG 1.0 Tiny; v novšej verzii Opery 9.0 je implementovaná čiastočná podpora formátu SVG 1.0 Basic. Druhým vývojárom, ktorý zahrnul podporu pre SVG, je The Mozilla Organization - ako súčasť jej Prehliadač Firefox 1.5 obsahuje projektový modul Mozilla SVG, ktorý poskytuje prehliadač grafiky SVG od špecifikácie 1.1. V polovici roku 2005 okrem toho vývojári prehliadača Safari, bežiaci na počítačoch so systémom Mac OS X, začali aktívne pracovať na zavedení podpory pre SVG 1.1;
- V porovnaní s inými grafickými formátmi je formát SVG vývojármi grafického softvéru stále málo podporovaný, aj keď také popredné grafické balíky ako Adobe ilustrátor, Corel DRAW atď., Vám umožňujú exportovať grafiku do súborov SVG. Súbory SVG je možné samozrejme vytvárať v ľubovoľnom textovom editore, čo je však z hľadiska rýchlosti a nízkych nákladov na vývoj nepraktické. V prípade potreby je možné súbor upraviť v textovom editore (čo je mimochodom možné iba vtedy, ak máte hlboké znalosti technológie XML), ale je nerozumné ho vytvárať od začiatku, pretože bude vyžadovať nadmerné investícia času a úsilia. Vyžaduje si to jednoduchý a pohodlný spôsob, ako rýchlo 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í, takýchto produktov je však veľmi málo a nie sú dostatočne známe.
V dôsledku toho nastáva veľmi smutná situácia - mnoho používateľov si zatiaľ nemôže prezerať grafiku SVG z dôvodu nedostatku podpory pre webové prehliadače na správnej úrovni, weboví vývojári prakticky nevyvíjajú grafiku SVG, bez ohľadu na to, ako atraktívne sú, a vývojári softvéru nenadchýnajú webových dizajnérov rôznymi aplikáciami špecifickými pre SVG. Výsledkom je začarovaný kruh: „Ak nie je žiadny obsah, potom ľudia nepotrebujú implementáciu SVG a ak neexistuje žiadna implementácia, potom neexistuje žiadny obsah“ - takto bola situácia opísaná na jednom zo stretnutí konzorcia W3C.
Môžete sa však pozrieť na situáciu z druhej strany: podpora SVG (aj keď ešte nie v plnom rozsahu) dvoma obľúbenými internetovými prehliadačmi, ako aj záujem o technológiu popredných vývojárov naznačujú, že ľady sa prelomili a SVG má skutočný š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 súvislosti s rastúcim záujmom o technológiu SVG vo vzťahu k mobilným zariadeniam, kde sú požiadavky na veľkosť a kvalitu obrázkov oveľa vyššie. Opera Software napríklad očakáva, že najskôr implementuje plnú podporu SVG na stolné počítače a až potom ju presunie na mobilné platformy. Preto je načase premýšľať o použití SVG a webových dizajnérov - v opačnom prípade riskujú, že budú v blízkej budúcnosti medzi zaostávajúcimi.
Doplnky na prezeranie grafiky SVG
Ako už bolo uvedené, väčšina používateľov bude zatiaľ musieť použiť jeden z vhodných doplnkov na úplné zobrazenie grafiky SVG v okne internetového prehliadača, z ktorých najznámejšie sú bezplatné. Moduly Adobe SVG Viewer a Corel SVG Viewer. Prvý z nich - Adobe SVG Viewer - je dodávaný ako samostatná aplikácia, je kompaktný a pohodlný, funguje na rôznych platformách, podporuje veľký počet internetových prehliadačov, a preto je medzi používateľmi oveľa obľúbenejší. Program Corel SVG Viewer je súčasťou softvéru Corel Smart Graphics Studio, ale je k dispozícii aj ako bezplatný softvér.
Existujú aj ďalšie možnosti zobrazenia 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 aplikácií na prezeranie obrázkov vo formáte SVG nájdete na stránke http://wiki.svg.org/Viewer_Implementations.
Adobe SVG Viewer
Vývojár: 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
Práca pod kontrolou: Windows 95/98 / Me / NT / 2000 / XP, Mac OS 8.6 / 9 / X, Linux, Solaris
Podpora prehliadača: internet Explorer verzia 4.0 a vyššia, Netscape Navigator alebo Communicator 4.5 až 4.78 (okrem verzií 6.x)
Prehliadač Corel SVG
Vývojár: Corel Corp
Veľkosť distribúcie: 4,9 MB
Spôsob distribúcie: freeware (modul je možné stiahnuť z: 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 alebo novší, Netscape Navigator alebo Communicator verzie 4.79, 7.02
Programy na vytváranie grafiky SVG
Všetky programy na vytváranie grafiky SVG je možné rozdeliť do troch veľkých skupín. Prvá obsahuje obľúbené dvojrozmerné grafické balíčky zamerané na prácu s vektorovou grafikou a zároveň umožňujúce export obrázkov do formátu SVG. Najpopulárnejšie z nich sú Adobe Illustrator a CorelDRAW; okrem toho takýto export do jedného alebo druhého stupňa 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 pomocou použitia dosiahnuť jedinečné efekty. priehľadných fólií, výplní, rôznych filtrov atď. Ale tieto aplikácie vyžadujú seriózne špeciálne školenie, a preto sú väčšinou navrhnuté pre profesionálnych dizajnérov. Navyše nie sú všeobecne zamerané na dizajn SVG (aj keď vám umožňujú prijímať grafiku vo formáte Scalable Vector Graphics) - tieto aplikácie, ktoré umožňujú pohodlné vizuálne vytváranie a zobrazovanie obrázkov, ich neumožňujú upravovať v texte. úroveň, ktorá je relevantná vo vzťahu k grafike SVG. Dôležitým faktom je, že podpora formátu Scalable Vector Graphics v nich nie je úplne implementovaná, v dôsledku čoho nie je možné všetky prvky vektorového obrázku exportovať do SVG bez chýb.
Druhú skupinu softvérových produktov tvoria balíky určené výhradne na vytváranie grafiky SVG. Majú oveľa menej možností, pokiaľ ide o vizuálny vývoj vektorových obrázkov, aj keď obsahujú všetky potrebné nástroje. Ale na druhej strane poskytujú pohodlné nástroje na úpravu zdrojového kódu a umožňujú vám pracovať s objektmi SVG paralelne - 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 učenie 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 kúpiť cez internet. Existuje však veľmi málo programov s takýmito schopnosťami a nižšie sa budeme podrobne zaoberať iba štyrmi, o ktoré je najväčší záujem a sú navrhnuté pre rôzne kategórie používateľov. S kompletný zoznam Aplikácie dostupné na vytváranie grafiky SVG sú k dispozícii na stránke http://wiki.svg.org/Design_Tools.
A nakoniec, do tretej skupiny môžu byť zaradené akékoľvek textové editory, vrátane bežného poznámkového bloku. Ako bolo uvedené vyššie, formát Scalable Vector Graphics je založený na formáte XML, ktorý vám podľa potreby umožňuje vytvárať a upravovať súbory SVG na textovej úrovni v textovom editore.
Plne vybavené grafické aplikácie na vytváranie grafiky SVG
Adobe Illustrator CS2
Vývojár: Adobe Systems, Inc.
Veľkosť distribúcie: Verzia Macintosh - 428,9 MB, verzia Windows - 398,6 MB
Spôsob distribúcie: shareware (30-dňová ukážka balíka je k dispozícii na: http://www.adobe.com/products/tryadobe/main.jsp#product=27)
Cena: 665 USD
Práca pod kontrolou: Windows 2000 s aktualizáciou Service Pack 3 alebo Windows XP, Mac OS X 10.2.4 až 10.2.7, Java RuntimeŽivotné prostredie 1.4.1
Od 9. verzie v programe Adobe Illustrator (obr. 3) je implementovaný import a export súborov SVG a na oveľa vyššej úrovni v porovnaní s podobnými grafickými aplikáciami. Balíček podporuje všetky existujúce kusovníky SVG, kódovanie ISO 8859-1, UTF-8 a UTF-16, rôzne možnosti export textu a umožňuje vám exportovať obrázky v bežnom formáte SVG aj v komprimovanom SVGZ.
V grafike SVG vytvorenej v jeho prostredí môžete použiť prechody, priesvitky, ako aj celú sériu špeciálne poskytovaných efektov SVG (efekt => filtre SVG) vo forme rôznych tieňov, rozmazania atď. Obrázky s takýmito efektmi zostanú zachované ich ostrosť pri zobrazení vo webovom prehliadači s akýmkoľvek zväčšením. Illustrator okrem statickej grafiky umožňuje aj príjem interaktívnej grafiky vo formáte SVG - na tento účel je k dispozícii špeciálna paleta interaktivity SVG (otvoríte ju z ponuky Okno => Interaktivita SVG), v ktorej sú akcie pre interaktívne objekty sú dané. Stojí za zmienku, že práca na interaktívnych prvkoch SVG v programe Illustrator vyžaduje znalosť jazyka Java Script a porozumenie základným princípom 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).
Grafická sada CorelDRAW 12
Vývojár: Corel Corp.
Veľkosť distribúcie tiva: 200 MB
Spôsob distribúcie: shareware (demo verziu je možné stiahnuť z webových stránok internetových obchodov, napríklad na: http://allsoft.ru/Download.php?ver=17605)
Cena: 290 USD (Allsoft.ru)
Práca pod kontrolou: Windows NT / 2000 / XP
Slávna aplikácia pre profesionálny rozvoj vektorová grafika CorelDRAW (obrázok 4), zahrnutý v programe CorelDRAW Graphics Suite 12, poskytuje základnú úroveň importu a exportu vo formátoch SVG a SVGZ, a preto ho možno použiť na vytváranie statickej a interaktívnej grafiky SVG.
do súboru SVG v programe CorelDRAW
Aplikácia implementuje podporu pre nerozpoznané údaje, atribúty a metadáta a tiež poskytuje možnosti Náhľad Súbory SVG v prehliadači pred exportom. Kódovanie Unicode je navyše možné 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 súborov a ďalších.
Žrebovanie Mayury 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 USD
Práca pod kontrolou: Windows 95/98 / Me / NT / 2000 / XP
Mayura Draw (obr. 5) je veľmi jednoduchý a lacný vektorový grafický program určený pre bežného používateľa. Výsledné vektorové obrázky, ak je to žiaduce, je možné exportovať do formátu SVG, a preto sa z nich 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 na základe grafických primitív, lineárnych a zakrivených ciest a textu. Zoznam jeho schopností obsahuje praktické nástroje na zarovnávanie, distribúciu a usporiadanie objektov, kontrolu priehľadnosti, používanie sprievodcov a pravítok na presné umiestnenie objektov a množstvo transformácií.
Š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: Komerčná licencia 449 dolárov, akademická licencia 249 dolárov
Práca pod kontrolou: Windows 2000 / XP
Profesionálny balík XStudio (obr. 6) je praktický nástroj na vytváranie univerzálnej grafiky SVG pre web a mobilné zariadenia a poskytuje plnú kontrolu nad projektom SVG ako celkom a nad vektorovými obrázkami, animáciami, skriptmi atď. pohodlné, intuitívne a vysoko prispôsobiteľné používateľské rozhranie, poskytuje širokú škálu nástrojov, je rýchle, umožňuje 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 z neho robí najlepšie profesionálne riešenie tohto druhu. Balík XStudio je dodávaný s podrobnou dokumentáciou, doplnený sériou návodov a je ľahké sa ho naučiť.
Ryža. 6. Kombinácia vytvárania vizuálneho obrazu s úpravou zdrojového kódu
v programe EvolGrafiX XStudio
Aplikácia má všetky potrebné možnosti na vytváranie a spracovanie vektorových obrázkov a v tomto ohľade je veľmi podobná balíku Adobe Illustrator. XStudio je zároveň zameraný priamo na prípravu statickej, interaktívnej a animovanej grafiky SVG, a preto je spolu s klasickými nástrojmi pre prácu s vektorovými objektmi doplnený o špecifické možnosti SVG. Vstavaný panel s nástrojmi Document Object Model (DOM) poskytuje hierarchickú reprezentáciu objektov SVG, pohodlný editor XML vám umožňuje opraviť zdrojový kód na textovej úrovni a editor skriptov vám umožňuje doplniť ho skriptmi Java. Práca s kódom je organizovaná veľmi pohodlne: fragmenty kódu vybratého objektu sa automaticky zvýraznia, je možné vyhľadávať text a nastavovať záložky atď. Všetky zmeny kódu sa okamžite prejavia v okne vizuálneho náhľadu a vizuálnych zmenách - 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ázok 7) je najsľubnejší open source vektorový editor, ktorý je multiplatformový a predstavuje účinný nástroj na vývoj grafiky v súlade so štandardom Scalable Vector Graphics. Inkscape je veľmi podobný CorelDRAW svojou vektorovou funkčnosťou aj rozhraním. Implementuje podporu pre alfa kanály, prácu s vrstvami, používanie efektívneho textu, efektné výplne s prechodom, veľký počet filtrov a efektov, množstvo transformácií, pohodlnú prácu s cestami a objektmi, zoskupovanie objektov a mnoho ďalších. Import údajov z Súbory JPEG, PNG a TIFF a vložte ich do obrázkov SVG.
vstavaný editor Inkscape
Na rozdiel od CorelDRAW je však Inkscape umiestnený ako aplikácia pre návrhárov SVG, takže spolu s klasickou tvorbou vizuálnej grafiky poskytuje možnosť priameho spracovania kódu XML v integrovanom textovom editore. Program je nakonfigurovaný tak, aby ukladal obrázky do bežných a komprimovaných súborov SVG, aj keď ich je možné previesť na bežné vektorové súbory a bitmapové formáty.
Balíček Inkscape má pohodlné ruské rozhranie, ľahko sa učí a prichádza s dobrým systém pomoci, vrátane rôznych prípadov použitia, a navyše, túto aplikáciu zadarmo - to všetko ho robí veľmi atraktívnym pre široký okruh používateľov. Hlavnými nevýhodami programu sú jeho nízka rýchlosť a zvýšené požiadavky na systémové zdroje.
Corel WebDraw
Vývojár: Corel Corp
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é riešenie na vytváranie vysokokvalitnej grafiky a animácií SVG pre profesionálnych dizajnérov. Vďaka intuitívnemu rozhraniu je program atraktívny pre široký okruh používateľov.
Aplikácia ponúka rozsiahlu sadu štandardných grafických nástrojov typických pre plnohodnotnú aplikáciu vektorovej grafiky: základné tvary (elipsa, obdĺžnik, hviezda atď.), Pero, polygón, lomená čiara, text atď. Spolu s vektorovými objektmi vám WebDraw umožňuje pridávať do objektov SVG externé bitové mapy. Okrem obvyklých výplní a prekrytia hotových štýlov môžete použiť aj zložité prechody, výplne vrátane vzorov, ktoré ste vytvorili sami. Na dosiahnutie efektívnejších obrázkov môžete použiť filtre - dostatočne jednoduché (rozmazanie a prekrytie tieňov) aj zložité (textúrovanie a osvetlenie). Mreže, vodítka a pravítka sú k dispozícii na presné umiestnenie objektov a vstavaný panel nástrojov DOM (Document Object Model) predstavuje objekty SVG v hierarchickom strome, čo výrazne zjednodušuje správu.
WebDraw je vybavený všestrannou časovou osou animácií, ktorá je postavená na vrchole objektový model SVG DOM (Document Object Model), ktorý vám umožní 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 upravovať počiatočný a koncový bod animácie, ako aj trvanie každej fázy animácie, priamo na časovej osi. Pretože sa kľúčové body animácie (doba prevádzky) vkladajú vždy, keď nastavíte parametre animácie pre atribút alebo vlastnosť objektu, je možné ich presunúť do iných častí scenára, aby sa automaticky upravila distribúcia efektov animácie v priebehu času.
Balíček 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 SVG poskytuje dodatočnú flexibilitu a kontrolu nad obsahom súborov. Automatická kontrola zmeny v zdrojový kód pomáha dosiahnuť zaručené správne správanie sa vytvorenej grafiky a nájdené chyby sú označené farbou, čo návrhárovi ušetrí hodiny 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ôžete v aplikácii WebDraw importovať, upravovať a optimalizovať súbory SVG vytvorené v prostredí iných aplikácií.
Sketsa SVG Editor 3.2.3
Vývojár: KIYUT
Veľkosť distribúcie: 5,99 MB
Spôsob distribúcie: shareware (ukážka, ktorá k obrázku pridá značku - http://www.kiyut.com/products/sketsa/sketsa.zip)
Cena: 49 USD
Práca pod kontrolou: Windows 2000/XP, Java VM (JRE) 1.5 a novší (http://www.java.com/getjava), UNIX a Linux
Sketsa (obrázok 9) je jedným z najpopulárnejších editorov SVG a umožňuje vám vytvárať profesionálnu grafiku SVG vrátane optimalizácií SVGZ. Balíček ú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žňujú vytvárať a transformovať akékoľvek vektorové objekty na základe ciest aj grafických primitívov a textu, ktoré je v prípade potreby možné ľahko doplniť rastrovými obrázkami. Je možné ovládať priehľadnosť, používať gradientové výplne a filtre. To všetko úspešne dopĺňajú špecializované možnosti SVG, vďaka ktorým je možné ľubovoľný obrázok upravovať nielen vizuálne, ale aj v textovom režime. Balíček poskytuje vstavaný textový editor XML na úpravu kódu SVG. Na uľahčenie správy objektov slúži vstavaný panel nástrojov DOM (Document Object Model), ktorý je hierarchickou stromovou sadou objektov v dokumente SVG, ktorá vám umožňuje vybrať ľubovoľný objekt dokumentu a upraviť jeho vlastnosti.
Pojem vektorové obrázky drvivému počtu bežných používateľov počítačov nehovorí vôbec nič. Dizajnéri sú zase čím ďalej tým viac náchylní používať na svoje projekty práve tento typ grafiky.
Predtým, aby ste mohli pracovať s obrázkami SVG, by ste si určite museli do počítača nainštalovať jedno zo špecializovaných riešení pre stolné počítače, ako napríklad Adobe Illustrator alebo Inkscape. Teraz sú tieto nástroje k dispozícii online, bez toho, aby ste ich museli sťahovať.
Po vyplnení príslušnej žiadosti na Googli sa môžete zoznámiť s veľkým počtom všetkých druhov vektorových online editorov. Ale drvivá väčšina takýchto riešení ponúka skôr skromné možnosti a najčastejšie neumožňuje prácu s vážnymi projektmi. Priamo v prehliadači sa pozrieme na najlepšie služby na vytváranie a úpravu obrázkov SVG.
Online nástroje samozrejme nemôžu úplne nahradiť zodpovedajúce desktopové aplikácie, ale pre väčšinu používateľov bude navrhovaný súbor funkcií viac než dosť.
Metóda 1: Vectr
Premyslený vektorový editor od tvorcov služby Pixlr, ktorý je mnohým známy. Tento nástroj bude užitočný pre začiatočníkov aj pre skúsených používateľov pri práci s SVG.
Napriek množstvu funkcií bude veľmi ťažké stratiť sa v rozhraní Vectr. Pre začiatočníkov existujú podrobné lekcie a rozsiahle pokyny pre každý z komponentov služby. Medzi nástrojmi editora je všetko pre vytváranie obrázku SVG: tvary, ikony, rámy, tiene, štetce, podpora práce s vrstvami atď. Môžete nakresliť obrázok od začiatku alebo nahrať svoj vlastný.
Možnosti exportu tiež obsahujú jednu z najvýraznejších vlastností Vectra - podporu priamych odkazov na projekt SVG v editore. Mnoho zdrojov neumožňuje odosielanie vektorových obrázkov priamo na seba, ale napriek tomu umožňuje ich vzdialené zobrazenie. V tomto prípade môže byť Vectr použitý ako skutočný SVG hosting, čo ostatné služby neumožňujú.
Je potrebné poznamenať, že editor nie vždy zaobchádza so zložitou grafikou 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 ľahko použiteľný webový editor na vytváranie obrázkov SVG na platforme HTML5. Vzhľadom na rozsah dostupných nástrojov je možné tvrdiť, že služba je výlučne na kreslenie. Pomocou aplikácie Sketchpad môžete vytvárať krásne a prepracované obrázky, ale nič viac.
Nástroj má širokú škálu prispôsobiteľných štetcov rôznych tvarov a typov, sadu tvarov, písiem a samolepiek na prekrytie. 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 by ste nemali mať problémy s jej zvládnutím.
Metóda 3: Metóda Draw
Táto webová aplikácia slúži na základné operácie s vektorovými súbormi. Navonok sa tento nástroj podobá stolnému programu Adobe Illustrator, ale z hľadiska funkčnosti je tu všetko oveľa jednoduchšie. Metóda Draw však obsahuje niektoré zvláštnosti.
Okrem práce s obrázkami SVG vám editor umožňuje importovať bitmapy a vytvárať na ich základe vektor. To sa dá urobiť na základe ručného sledovania obrysov perom. Aplikácia obsahuje všetky potrebné nástroje na vytváranie vektorových kresieb. K dispozícii je rozsiahla knižnica tvarov, farebná 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 kvôli absencii nepotrebných prvkov a dobre organizovanému pracovnému priestoru je možné službu vynikajúco využiť na rýchle úpravy alebo presné spresnenie jednoduchých obrázkov SVG.
Metóda 4: Gravit Designer
Bezplatný webový editor vektorovej grafiky pre pokročilých používateľov. Mnoho dizajnérov stavia Gravit na rovnakú úroveň ako plnohodnotné riešenia pre stolné počítače, ako napríklad Adobe Illustrator. Faktom je, že tento nástroj je multiplatformový, to znamená, že je plne dostupný vo všetkých operačných systémoch počítačov, ako aj vo webových aplikáciách.
Gravit Designer je v aktívnom vývoji a pravidelne dostáva nové funkcie, ktoré už stačia na rozloženie komplexných projektov.
Editor vám ponúka všetky druhy nástrojov na kreslenie obrysov, 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 gravitačnom priestore má zoznam vlastností, ktoré je možné zmeniť.
Celá táto rozmanitosť je „zabalená“ do štýlového a intuitívneho rozhrania, takže akýkoľvek nástroj je k dispozícii iba niekoľkými kliknutiami.
Vzhľadom na to, že služba je navrhnutá pre plnohodnotnú prácu s vektorovou grafikou, možno ju bezpečne odporučiť aj profesionálnym dizajnérom. Pomocou Gravit môžete upravovať umenie SVG bez ohľadu na platformu, na ktorej sa nachádzate. Toto tvrdenie zatiaľ platí iba pre desktopové operačné systémy, čoskoro sa však tento editor objaví na mobilných zariadeniach.
Metóda 5: Janvas
Populárny nástroj vektorovej grafiky medzi webovými vývojármi. Služba obsahuje množstvo nástrojov na kreslenie s vysoko prispôsobiteľnými vlastnosťami. Hlavnou črtou Janvas je schopnosť vytvárať interaktívne obrázky SVG animované pomocou pomocou CSS... A v spojení s JavaScriptom vám služba dokonca umožňuje vytvárať celé webové aplikácie.
V schopných rukách je tento editor skutočne silným nástrojom, zatiaľ čo začiatočník kvôli množstvu všetkých druhov funkcií s najväčšou pravdepodobnosťou jednoducho nepochopí, čo je čo.
Áno, tento nástroj, bohužiaľ, nie je bezplatný. Je to však 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 správcom webu vytvárať vysoko kvalitné prvky SVG pre svoje stránky čo najjednoduchšie. Editor obsahuje pôsobivú knižnicu tvarov, ikon, výplní, prechodov a písem.
Pomocou DrawSVG môžete navrhovať vektorové objekty akéhokoľvek druhu a vlastností, meniť ich parametre a vykresľovať ako samostatné obrázky. Do SVG je možné vložiť multimediálne súbory tretích strán: video a audio z počítača alebo zo sieťových zdrojov.
Tento editor, na rozdiel od väčšiny ostatných, nevyzerá ako port prehliadača desktopovej aplikácie. Vľavo sú základné nástroje na kreslenie a v hornej časti sú ovládacie prvky. Hlavný priestor zaberá plátno na prácu s grafikou.
Mali by ste pochopiť, že obrazový súbor je sada bežných textových údajov vo formáte XML, čo znamená, že obrázok môžete upraviť ktokoľvek. textový editor... Pozri, nie je ťažké to študovať.
Ako otvoriť výkres SVG?
SVG je webový formát na opis vektorových primitív na webovej stránke. Vlajkovou loďou medzi prehliadačmi SVG sú samozrejme moderné prehliadače (najnovšie verzie Opera, Firefox, Chrome a tiež IE 9). Prehliadače podporujú takmer všetky prvky SVG (vrátane animácií a ECMAScript) a Opera má takmer 100% podporu.
Tabuľka ukazujúca úroveň podpory SVG rôzne prehliadače od júla 2010:
| Prehliadač | Úroveň podpory |
|---|---|
| Opera 10.53 | 95 % |
| Chrome 4 | 82 % |
| Safari 4.0.5 | 82 % |
| Firefox 3.6 | 62 % |
| Internet Explorer 9 predchádzajúci 3 | 52.55 % |
Z týchto údajov vyplýva, že je najlepšie otvoriť SVG s najnovšou verziou prehliadača Opera. Tento prehliadač má verzie pre Windows aj Linux, takže nikto by nemal mať problémy.
Všeobecne platí, že takmer všetky programy na prezeranie a úpravu obrázkov podporujú SVG, ale väčšina z nich nedokáže reprodukovať animáciu, nieto skripty.
Ako upraviť výkres SVG?
SVG existuje od roku 1999, ale aktívne sa začal rozvíjať až mnoho rokov po svojom vzniku, a to vďaka podpore najväčších iT-spoločností na svete. Formát nie je ani zďaleka nový, takže každý softvér rešpektujúci rešpekt, ktorý s ním pracuje, je jednoducho povinný podporovať tento formát.
Tabuľka so zoznamom softvéru pre vektorovú grafiku, mnohé z položiek zoznamu podporujú formát SVG:
| názov | Vývojár | cena |
|---|---|---|
| AutoTrace | Martin Weber | zadarmo |
| Ľahká stopa | Skupina Easy Trace | Vylepšenie 1 500 €, 750 € |
| Voľnou rukou | Macromedia | 399 dolárov, upgrade 99 dolárov |
| Ilustrátor | Systémy Adobe | 499 dolárov, inovácia 169 dolárov |
| MagicTracer | Algoritmy MagicTracer | $59 |
| MST Viewer | Technológia MS | Len na komerčné použitie |
| PhotoLine | Computerinsel GmbH | 59 € |
| Potrace | Peter Selinger | zadarmo |
| Súprava nástrojov R2V | AlgoLab | $99 |
| Ras2Vec | Davide Libenzi | zadarmo |
| Image2XAML | Roman Kalachik | zadarmo |
| Rastrovo do vektora | Rastrovo do vektora | $99 |
| RasterVect | RasterVect | $79 |
| RaveGrid | RaveGrid | zadarmo na osobné použitie (komerčná verzia k dispozícii) |
| Scan2CAD Pro | Mäkká väzba Intn "l | 469 dolárov, upgrade 190 dolárov |
| Silhouette Pro | Free Soft S.A. | $359 |
| Streamline Adobe | Systémy Adobe | ? |
| Vektorové kúzlo | Vektorové kúzlo | 7,95 dolára / mesiac, 295 dolárov / licencia, žetóny |
| Vextractor | VextraSoft | $99 |
| VPHybridCAD | softelec | $1400 |
| Freeware WinTopo | SoftSoft | zadarmo |
| WiseImage | Konzistentný softvér | $1400 |
| RasVector | Daniel Lu | GPL |
| Xara xtreme | Xara Group Ltd. | 79$ Verzia Windows, Verzia Linuxu je bezplatná |
| XTrace | Ronny Schütz | 25 $ za Amigu (k dispozícii je demo) |
| Vektor Teraz | AutoDWG | $120.00 |
| Prezentácia dizajnu | Prezentácia dizajnu | Platba za použitie |
Nasleduje zoznam najobľúbenejších programov na vytváranie a úpravu SVG.
Inkscape
Inkscape je program na vytváranie a úpravu vektorových obrázkov, hlavnou oblasťou použitia je vytváranie technických ilustrácií a diagramov. Napísané v C ++ a GTK +. Vytvorené obrázky je možné uložiť vo formáte SVG 1.1. Inscape je k dispozícii pre mnoho platforiem (Windows, Linux, Mac OS) a je zaradený do kategórie bezplatných softvér, je distribuovaný pod licenciou GNU General Public License.
Program vám umožňuje použiť všetky filtre a nástroje potrebné pre projektanta: geometrické primitívy (mnohouholníky, kruhy, čiary, krivky, kocky atď.), Štetce, výplň, gumu. Okrem vizuálneho editora existuje aj textový editor, ktorý vám umožňuje vizuálne vidieť a upravovať strom prvkov XML.
Inkscape sa už mnoho rokov aktívne rozvíja, vývojári kontaktujú a vymieňajú si skúsenosti s kolegami z Gimpu, Scribusu.
Inkscape pre akýkoľvek OS si môžete zadarmo stiahnuť na oficiálnom webe inkscape.org.
Obrazová mágia
Takmer všetky funkcie konzoly Image Magick na prácu s grafikou siahajú do SVG. Image Magick je bezplatný, pre mnohé aplikácie existujú knižnice, ktoré vám umožňujú kontaktovať tento nástroj prostredníctvom vlastného rozhrania. Napríklad - Imagick v PHP.
Platený softvér pre prácu s SVG
Adobe Illustrator CS2
Vyvinutý spoločnosťou Adobe Systems, Inc. Adobe Illustrator CS2 obsahuje pomerne silné nástroje na úpravu SVG. Program nie je bezplatný 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 nemá v oblasti práce s SVG v porovnaní s Inkscape žiadne špeciálne výhody, ibaže milovníkom Photoshopu sa bude páčiť úroveň podobnosti medzi týmito dvoma programami. Bossno, Adobe pre dlho vytvorilo užívateľsky najpríjemnejšie rozhranie pre dizajnérov.
Grafická sada CorelDRAW
S vývojom SVG spoločnosť Corel Corp. Sada CorelDRAW Graphics Suite obsahuje podporu škálovateľnej vektorovej grafiky. Cena je takmer 300 dolárov, ale existuje demo verzia. K dispozícii iba pre Windows.
Corel ponúka aj kúpu Corel WebDraw (Jasc WebDraw), viac zameraný na vektorovú webovú grafiku a profesionálnych webových dizajnérov. Cena je 180 dolárov.
Sketsa SVG Editor
Program je kompletne napísaný v jazyku Java, funguje pod Windows, Linux, Mac OS. Na rozdiel od iných programov vektorovej grafiky vo všeobecnosti je Sketsa striktne orientovaná na SVG. Má pomerne príjemné a užívateľsky prívetivé rozhranie. Stojí to však takmer 90 dolárov.
Žrebovanie Mayury 4.3
Existujú aj jednoduchšie platené riešenia. Napríklad - Mayura Draw za 39 dolárov, veľkosť distribučnej sady je iba 1,3 MB. Program podporuje všetky hlavné nástroje na úpravu grafiky SVG, ľahké a relatívne rýchle.
Online editor SVG
Dátum: 2010.05.27 o 14:20:46Pri kopírovaní materiálu vložte aktívny odkaz na článok.
SVG (Scalable Vector Graphics) je veľmi výkonný škálovateľný súbor vektorovej grafiky napísaný v značkovacom jazyku XML. Poďme zistiť, aké softvérové riešenia je možné použiť na zobrazenie obsahu objektov s týmto rozšírením.
Vzhľadom na to, že škálovateľná vektorová grafika je grafický formát, je prirodzené, že zobrazenie týchto objektov v prvom rade podporujú prehliadače obrázkov a grafické editory. Je zvláštne, že až doteraz sa diváci vzácnych obrázkov vyrovnávajú s úlohou otvoriť SVG a spoliehať sa iba na svoje vstavané funkcie. Objekty študovaného formátu je navyše možné prezerať pomocou niektorých prehliadačov a mnohých ďalších programov.
Metóda 1: Gimp
Najprv sa pozrime na to, ako si zobraziť kresby študovaného formátu v bezplatnom grafickom editore Gimp.
Metóda 2: Adobe Illustrator
Ďalším programom, ktorý môže zobrazovať a upravovať obrázky v uvedenom formáte, je Adobe Illustrator.
Metóda 3: XnView
Naše skúmanie prehliadačov obrázkov pracujúcich so študovaným formátom začneme programom XnView.
Existuje ďalší spôsob zobrazenia SVG v XnView. Vykonáva sa pomocou vstavaného prehliadača.
Metóda 4: IrfanView
Ďalším prehliadačom obrázkov, na ktorého príklade zvážime zobrazenie študovaného typu obrázkov, je IrfanView. Na zobrazenie SVG v pomenovanom programe je tiež potrebný doplnok CAD Image DLL, ale na rozdiel od XnView nie je pôvodne nainštalovaný v zadanej aplikácii.
Obrázok v tomto programe je možné zobraziť potiahnutím súboru z "Prieskumník" do shellu IrfanView.
Metóda 5: Draw OpenOffice
SVG môže zobrazovať aj aplikácia Draw z kancelárskeho balíka OpenOffice.
Obrázok si môžete tiež prezrieť potiahnutím a vložením súboru do spúšťacieho shellu OpenOffice.
Môžete ho tiež spustiť cez shell Draw.
Metóda 6: LibreOffice Draw
Podporuje škálovateľný vektorový grafický displej a konkurenta OpenOffice - kancelársky balík LibreOffice, ktorý má aj aplikáciu na úpravu obrázkov s názvom Draw.
Ďalším spôsobom otvorenia je presunutie súboru z Správca súborov do spúšťacieho shellu LibreOffice.
Tiež v LibreOffice, ako v predchádzajúcom softvérovom balíku, ktorý sme popísali, si môžete prezerať SVG prostredníctvom shellu Draw.
Metóda 7: Opera
SVG je možné zobraziť v mnohých prehliadačoch, z ktorých prvý sa nazýva Opera.
Metóda 8: Google Chrome
Ďalším prehliadačom, ktorý dokáže vykresľovať SVG, je Google Chrome.
Metóda 9: Vivaldi
Vivaldi je ďalší webový prehliadač, ktorý slúži ako príklad na prezeranie súborov SVG.
Metóda 10: Mozilla Firefox
Poďme zistiť, ako vykresliť SVG v inom populárnom prehliadači - Mozilla Firefox.
Metóda 11: Maxthon
Pomerne neobvyklým spôsobom si môžete zobraziť SVG v prehliadači Maxthon. Faktom je, že v tomto webovom prehliadači je aktivácia otváracieho okna v zásade nemožná: ani pomocou grafických ovládacích prvkov, ani stlačením klávesových skratiek. Jedinou možnosťou zobrazenia SVG je zadanie adresy tohto objektu v adresný riadok prehliadač.
Táto možnosť otvárania vektorov umiestnených lokálne na pevnom disku je samozrejme oveľa nepohodlnejšia a náročnejšia ako v iných prehliadačoch.
Metóda 12: Internet Explorer
Zoberme si možnosti zobrazenia SVG aj na príklade štandardného prehliadača pre operačné systémy Windows line pre Windows 8.1 vrátane - Internet Explorer.
Napriek tomu, že SVG je formát vektorového obrázku, väčšina moderných prehliadačov obrázkov ho nemôže zobraziť bez nainštalovania ďalších doplnkov. Tiež nie všetky grafické editory pracujú s týmto typom obrázkov. Tento formát však môžu zobrazovať takmer všetky moderné prehliadače, pretože bol kedysi vytvorený predovšetkým na uverejňovanie obrázkov na internete. Je pravda, že v prehliadačoch je možné iba prezeranie, nie úprava objektov so zadaným rozšírením.
Od autora: Obrázky SVG nie sú také všadeprítomné ako naše obľúbené bitmapové formáty PNG a JPG, ale výhody vektorovej grafiky priťahujú čoraz viac dizajnérov. Dizajnéri vo svojich projektoch stále častejšie používajú vektorovú grafiku. Predtým sme potrebovali stiahnuť desktopové aplikácie, ako sú Adobe Illustrator a Inkscape, ale v roku 2017 môžete navrhovať vektorovú grafiku bez toho, aby ste museli opustiť prehliadač. Ak ste hľadali bezplatný editor SVG, môžete začať s týmito šiestimi bezplatnými nástrojmi.
Vectr
Vectr – dobrá voľba pre začiatočníkov i pokročilých používateľov SVG. Rozhranie je prehľadné a nepreplnené množstvom nástrojov, ktoré nebudete používať. Editor je vhodný pre tých, ktorí začínajú s vektorovou ilustráciou. Užívateľ by sa nemal stratiť medzi nástrojmi, ktorým nie je jasné, na čo sa používa. Sada obsahuje niekoľko lekcií. Aj keď ste s SVG úplná nula, máte schopnosť rýchlo sa učiť.
Všetko vyššie uvedené však neznamená, že Vectr má slabú funkčnosť. Obsahuje všetky základné sady na vytváranie pravidelných obrázkov: tvary, text, vrstvy, tiene, rámy, pozadia atď. Nedá sa to porovnať s plnohodnotným editorom pre stolné počítače, ale na rýchle návrhy a úpravy je to viac než dosť. Môžete vytvoriť obrázok od začiatku alebo nahrať existujúci.
Pri načítavaní zložitých ilustrácií do Vectru sa môžu vyskytnúť chyby (mapy alebo podrobné diagramy). Editor nie vždy zvláda zložitú grafiku dobre. Na jednoduchšie SVG (ikony, logá a pod.) Však tento editor postačí.
JavaScript. Rýchly štart
Ak online verzia nemá potrebné funkcie, môžete si stiahnuť desktopovú verziu aplikácie. Editor je k dispozícii pre Windows, Mac, Linux a Chromebooky.
Asi najlepšia funkcia vo Vectre je, že môžete prepojiť a vložiť obrázky priamo z webu Vectr, čo z neho robí účinný SVG hosting. Mnoho služieb blokuje načítanie súborov SVG, takže je to veľké plus. Obrázky SVG od spoločnosti Vectr môžete zobrazovať na vzdialených serveroch, ako sú WP, Medium, Tumblr atď., Ktoré blokujú priame načítanie formátu SVG, ale umožňujú ich diaľkové zobrazenie.
Vectr vám umožňuje zdieľať vektorovú grafiku na paneli editora, aby ostatní mohli upravovať vami vytvorenú grafiku. To znamená, že môžete napríklad vytvoriť šablónu loga SVG, ktorú si už používatelia budú finalizovať sami. To všetko v prehliadači.
Za týmto účelom Vectr nedávno vydal verziu editora vo formulári plugin pre WP.
RollApp
Na rozdiel od iných nástrojov v zozname, keď prejdete na domovská stránka RollApp, editor sa pred vami neotvorí. RollApp je balík aplikácií a editor SVG je len jednou z aplikácií. Skvelý nástroj, toto je verzia prehliadača Inkscape.
Na prácu s RollApp potrebujete účet. Môžete zaregistrovať nový alebo sa prihlásiť pomocou pomocou google, Facebook, Amazon. Veľmi výhodné, nenávidím vytváranie tisícov nových účtov, len aby som videl túto aplikáciu.
Inkscape v celej svojej kráse! RollApp je bezpochyby najbohatšou aplikáciou v zozname. Inkscape vo svojom prehliadači doslova používate! Neporovnával som všetko do najmenších podrobností, ale táto aplikácia vyzerá ako VŠETKY funkcie Incscape, ako sú vrstvy, objekty, text, cesty, filtre, efekty, rozšírenia atď.
Veľké súbory sa nespracovávajú tak rýchlo, pretože akcie sa vykonávajú na aplikačných serveroch a prostredníctvom internetu. Stručne povedané - ak potrebujete upravovať veľké a zložité súbory, RollApp nie je ideálny, ale pre ostatné úlohy mimo základnej sady je tento editor lepší ako ostatné.
BoxySVG
Ak už dávno čítate SitePoint, mali by ste sa v editore vyznať. BoxySVG, pretože za posledných 12 mesiacov sme o tom už hovorili. Nebudem robiť podrobnú kontrolu, pretože to už bolo vykonané v tento článok.
JavaScript. Rýchly štart
Preskúmať Základy JavaScriptu na praktickom príklade vytvorenia webovej aplikácie
Čo je dôležité, od Alexovej recenzie, BoxySVG pridal inšpektor kódu, čo z neho robí jeden z najaktuálnejších nástrojov SVG pre webových vývojárov.
Janvas
Pred par rokmi Janvas bol veľmi obľúbený editor SVG. Tento editor bohužiaľ nebol vyvinutý nedávno, ale napriek tomu stále funguje. Web sa pohybuje dopredu a Janvas stojí na mieste, takže záujem oň vyprchal. Alex zo servera SitePoint s týmto nástrojom trochu pracoval v rokoch 2013-14 (vrátane platenej verzie) a chvíľu dokonca odpovedal na otázky. google stránka+. Janvas bol dosť silný nástroj.
Hlavným problémom Janvasu je, že je trochu zastaraný. Prehliadače sa vyvíjajú a aplikácie, ktoré ich nenasledujú, sú každým dňom menej stabilné. Janvas má mnoho funkcií: tvary, text, nástroje na kreslenie, cesty, masky a vrstvy. Používatelia na fórach však tvrdia, že mnohé z týchto funkcií neprinášajú požadovaný výsledok.
Dobrou správou je, že nová verzia bude vydaná ako aplikácia pre Chrome. Dúfajme, že problémy vyriešia.
DrawSVG
Možno ste si už vybrali bezplatný online editor SVG. Ak nie, tak pokračujte. DrawSVG- Plne kompatibilný editor SVG s mnohými funkciami. Veľmi sa mi páči, že dizajn tejto aplikácie je skutočne prispôsobený pre web a nevyzerá ako port desktopovej aplikácie pre prehliadač. Ponuka sa nachádza vľavo, kliknutím otvoríte ponuku druhej úrovne atď.
S DrawSVG môžete kresliť, upravovať a vykresľovať objekty. Môžete kresliť jednoduché tvary, existujú Bézierove krivky, rovný a zakrivený text, veľa štýlov ťahov a výplní atď. SVG je možné exportovať aj do formátu PNG.
Úprava SVG
Úprava SVG- starý otec online editorov vektorovej grafiky, sa objavil v polovici roku 2000. Neexistuje žiadna funkcia servera, všetko funguje v prehliadači. Svoju prácu nemôžete uložiť bez pridania vlastných funkcií.
Avšak pre editora, ktorého život začal ako veľmi obmedzený a nenápadný program pre vektorové kreslenie, sa funkcia úprav SVG neustále zlepšovala.
Pomocou úpravy SVG môžete kresliť jednoduché tvary (čiary, obdĺžniky, kruhy, mnohouholníky, čiary od ruky atď.), Používať cesty, vrstvy, prechody, môžete zobrazovať a upravovať zdroje SVG, exportovať do formátu PNG, JPEG, BMP, WEBP , atď.
Záver
Okrem týchto 6 editorov SVG existuje ešte niekoľko ďalších, ale len málo z nich ponúka viac funkcií ako päť vyššie uvedených.
Ak sa chcete vážne zaoberať SVG a tieto nástroje nemajú potrebnú funkcionalitu, môžete si kedykoľvek stiahnuť desktopový editor SVG, ako napríklad Illustrator alebo Inkscape. Pre ľahkosť, rýchlosť a flexibilitu však všetky vyššie uvedené editory ponúkajú užitočnú sadu funkcií.
PS: Môžete tiež skúsiť Obr... Je to skôr nástroj na tvorbu používateľského rozhrania, nie editor SVG. Má však veľkú sadu nástrojov a generuje dobre optimalizovaný kód SVG.