SVG prošla obvyklým procesem vývoje a schvalování internetových standardů v organizaci W3C, počínaje pracovním návrhem, přes diskuze v pracovní skupině, až po finální normu W3C Recomendation SVG 1.0, vydanou v září 2001. Při návrhu byly využity i zkušenosti získané při používání dvou starších vektorových jazyků (PGML a VML), SVG zdědila to nejlepší z obou.

Vývoj normy

Historie tohoto formátu je poměrně zajímavá, na Interval.cz si dokonce můžete přečíst starší článek o SVG, zveřejněný tehdy ještě před schválením finální normy. Podle zvučných jmen firem, zúčastněných ve skupině, je znát, že potřeba zaplnit slepé místo HTML skutečnou grafikou byla už tehdy silná. Pro mne osobně je velmi zajímavé porovnávat tehdejší sliby firem o vývoji programů podporujících SVG s dnešní všední realitou.

Vycházím-li z uvedených údajů a začnu-li od základů, tedy od webových prohlížečů, pak je zklamáním především Microsoft, na jeho internetových stránkách nenaleznete jedinou zmínku o SVG a o nějaké podpoře nemůže být ani řeči. SVG je ale především o grafice, důležitější je tedy podpora „grafických“ firem. Vcelku nepřekvapuje ani ignorance ze strany Macromedie, která si hýčká svůj vlastní formát a zdá se, že se na zmíněném seznamu ocitla snad omylem.

Jako první prohlížeče jsou zde uvedeny programy od IBM a Corelu. Z dnešního pohledu situace vypadá tak, že v těchto dvou firmách si programátoři nejspíše vybírali dva roky prázdnin. V Javě naprogramovaná aplikace IBM příliš nepokročila od základních prvků standardu. Corel je na tom o něco lépe.

Ale nebojte se, SVG žije, a to hlavně díky společnosti, které nikdo nemůže upřít snad vůbec největší zásluhy o profesionální počítačovou grafiku, společnosti s obrovským grafickým know-how… Tou je samozřejmě Adobe Systems, která nabízí stoprocentní implementaci SVG 1.0 a podporu ve svých aplikacích, které patří mezi naprostou špičku v oboru, což jistě dává určité záruky, co se týče její kompetentnosti a spolehlivosti softwaru.

SVG 1.1

Norma SVG 1.1 ze 14. ledna 2003 v podstatě pouze rozděluje komplexní „velkou“ specifikaci SVG 1.0 na menší části v zájmu implementace SVG na méně výkonná (mobilní) zařízení. Definovány byly dva profily. SVG Basic je subset SVG normy určený pro PDA (omezeny jsou filtry a použití ořezových cest). Ještě ořezanější SVG Tiny je určen pro mobilní telefony – vypouští scripty, filtry, přechody barev, vzorky, průhlednost a CSS formátování.

Povšimněte si jednoho nikoli nevýznamného detailu, v žádném případě nejsou omezeny animace! Je jisté, že je jim přikládána velká důležitost a jsou uživateli vyžadovány. SVG 1.1 má podle mého názoru význam nejenom pro útok na mobilní komunikátory, ale může se uplatnit také pro nové implementace SVG, například nově vznikající nativní SVG funkce v internetových prohlížečích. Naprogramování minimálního subsetu SVG Tiny může být řádově snazší a my, jakožto konstruktéři stránek, přitom budeme velmi přesně vědět, jak bude vypadat konečné zobrazení.

Menší novinky SVG 1.1 zavádí v oblasti zpracování textu. Zlepšení již tak výborných typografických schopností představuje zavedení párového kerningu do definice SVG fontů CEF, dále podporuje ochranu autorství písem a umožňuje používání dalšího formátu internetových písem definovaného v normě CSS 2, tzv. WebFonts.

Návrh SVG 1.2

Ještě v roce 2002 byl publikován první pracovní návrh SVG 1.2. Ten především přináší v současnosti nejvíce požadovanou vlastnost, kterou je schopnost automatického zarovnávání „tekoucího“ textu. Funkce je navrhována podle vzoru nejlepších profesionálních programů pro práci s textem (InDesign, QuarkXPress) tak, že by měla umět „natékat“ text dokonce do celého řetězu textových rámů libovolného tvaru.

Nejdůležitější prohlížeče

V první řadě tu mám několik velmi dobrých zpráv pro vývojáře a grafiky, kteří by chtěli SVG začít používat. Je jasné, že široká podpora v prohlížečích je velmi důležitá. V Adobe Systems, bohudík, svá slova dodržují, SVG Viewer 3 (zdarma k dispozici na adobe.com) je přibalován k poměrně široce používanému Acrobat Readeru od verze 5. V polovině loňského roku bylo napočítáno zhruba 160 miliónů instalací tohoto přehrávače. Zvěsti hovoří i o jiném posílení pozic, SVG Viewer by měl být přidáván také k novým verzím Real Playeru. Na internetu jsem pochytil též nějaké neoficiální zmínky o podpoře v příštích verzích MS Office.

Informace v následující tabulce jsou aktualizované v březnu 2003. Pořadí SVG prohlížečů v tabulce odpovídá kvalitě implementace.

Název Platforma Stupeň implementace
Adobe SVG Viewer 3.076 Linux, MAC OS, Unix, Windows Stoprocentně SVG 1.0, navíc obsahuje vlastní interpretaci JavaScriptu (ECMA) kvůli eliminaci problémů s jeho špatnou implementací v některých prohlížečích.
Apache Batik 1.5 Java Všechny statické prvky, u dynamických prvků (animace a podpora DOM) je udáváno splnění asi 1/3 oficiálních dynamických testů organizace W3C. (Pozn. aut.: Batik je součástí většího projektu Apache Batik SVG Toolkit, který vyvíjí kompletní open-source Java knihovny pro generování, čtení a zobrazování SVG.)
Corel SVG Viewer Preview 167 pouze Windows Chybí animace, podpora SVG fontů, natáčení znaků v textu, přerušované styly tahů, podpora skriptování je neúplná.

Takzvané „mobilní“ přehrávače

  • Bitflash SVG Player pro Palm OS, Pocket PC a Symbian implementuje kompletně SVG Basic nebo SVG Tiny.
  • Intesis e-SVG 1.4 pro Pocket PC a UniOP.
  • ZOOMON SVG Player 1.3 pro RTOS a Symbian – úplná implementace SVG Tiny.

Vývojové nástroje

Musím přiznat, že počítačová grafika (DTP, předtisková příprava a internet) je mou pracovní náplní a můj pohled je tím samozřejmě ovlivněn. Přicházím do kontaktu především s „velkými“ grafickými aplikacemi a zbývající produkty znám pouze zprostředkovaně, tak mne prosím nekamenujte, pokud některé vynechám. Samozřejmě uvítám, pokud mi o případném opomenutém a kvalitním softwaru dáte vědět.

A abych nezapomněl – co je SVG? SVG je podtřída XML, takže samozřejmě můžete využít kterýkoli z editorů XML, ale i jakýkoli textový editor. Hodně moderních editorů HTML a obecně editorů zdrojových kódů pravděpodobně bude umět alespoň barevně odlišovat různé prvky (elementy, atributy, data) zdrojové struktury.

O zkušenosti se zpracováním SVG v některých grafických aplikacích se s vámi podělím v některém z příštích článků. Podrobný seznam programů pro práci s SVG najdete na webu W3C. Zde uvádím abecední seznam nejzajímavějších aplikací:

  • Adobe Illustrator 10 – exportuje a importuje všechny statické vlastnosti SVG 1.0. Výborná podpora filtrů a jejich WYSIWYG editování. Špatná optimalizace textových objektů. Vytváření hyperlinků a nastavování reakcí na události uživatelského rozhraní (přiřazení rutin JavaScriptu). (Komerční, MAC OS a Windows.)
  • Adobe InDesign 2 – v podstatě identické exportní možnosti s AI10, bez SVG filtrů. (Komerční, MAC OS a Windows.)
  • Bernard Herzog Sketch 0.6.14 – exportuje a importuje statické SVG. (Freeware, Linux/Unix.)
  • Bitflash Brilliance – nativní SVG Tiny a SVG Basic editor, tzn. SVG je jeho vnitřní a základní grafický formát. Podporuje animace. (Komerční, Windows.)
  • Corel Draw 11 – exportuje a importuje statické SVG 1.0. Vytváření hyperlinků. (Komerční, MAC OS a Windows.)
  • JASC WebDraw 1 – nativní SVG editor, tzn. SVG je jeho vnitřní a základní grafický formát. Podpora filtrů a jejich WYSIWYG editování. Umí dokonce SVG deklarativní animace. Integrace s ostatními programi od JASC. (Komerční, Windows, Linux se připravuje.)
  • Mayura Draw 4.1 – export SVG. (Shareware, Windows.)

Vkládání SVG do stránek

SVG grafika může být vložena v samostatném souboru nebo umístěna v XHTML/XML souboru spolu s jinými XML dialekty (mixed XML namespace, multi-namespace XML grammar) za použití standardizovaného mechanismu pro přepínání jmenných prostorů XML. My se zatím omezíme na první popsaný způsob.

Je žádoucí držet se normy HTML 4, použijeme tedy element <object>. Ten je vymyšlen tak, abychom v případě, kdy není k dispozici software pro zobrazení vkládaného obsahu, mohli nabídnout alternativní řešení. Tím může být klasický rastrový obraz (GIF, JPEG, PNG) nebo třeba chybové hlášení s výzvou k instalaci prohlížeče, jak je tomu v následujícím kódu:

<object width=“256″ height=“256″
    data=“svg_demo.svg“ type=“image/svg+xml“
    standby=“Please wait, loading from the Net!“>
  <p>CHYBA!</p>
  <p><strong>NELZE</strong> zobrazit SVG grafiku!</p>
  <h2>Prosím, nainstalujte na tento počítač
    <a href=“http://www.adobe.com/svg/viewer/install/“>SVG plug-in</a>!
  </h2>
</object>

Toto je naprosto čisté, elegantní řešení a osobně jsem je vyzkoušel s Adobe SVG plug-inem na všech možných MAC/PC platformách.

Ovšem pozor, věc má jeden velmi nepříjemný háček, který se projeví v prohlížečích MS Internet Explorer 4 až 6 ve Windows. Jde o to, že Adobe plug-in v této konfiguraci při stahování grafiky z internetu není schopen nalézt žádný soubor připojený uvnitř SVG kódu (jedno zda obrázek, soubor se scripty nebo CSS). Chyba je velmi zákeřná v tom, že při zkoušení na lokálních discích vše bezvadně funguje! Když jsem si dopisoval s dotyčnými vývojáři, tak mi to nejdřív nevěřili, a poté, co jsem je konečně přesvědčil, z debaty vyplynulo pouze provizorní řešení – prozatím používat starší způsob vkládání pomocí elementu <embed>.

<embed src=“svg_demo.svg“ type=“image/svg+xml“
    pluginspage=“http://www.adobe.com/svg/viewer/install/“
    height=“128″ width=“128″>

Typ MIME a přípony souboru

Normalizovaný typ MIME je image/svg+xml, doporučená přípona souborů je svg. SVG soubory mohou být také komprimovány pomocí GZIP, v takovém případě mají mít příponu svgz.

Další informace

Starší komentáře ke článku

Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.

Žádný příspěvek v diskuzi

Odpovědět