Media Lab SiteGrinder 2.0.7: tvorba webových stránek přímo v Adobe Photoshopu - Grafika.cz - vše o počítačové grafice

30. října 2007, 00.00 | Nová verze pluginu pro Adobe Photoshop na automatizovanou tvorbu webových stránek přináší řadu změn a inovací. Protože se jedná o opravdu dost neobvyklý
produkt, podíváme se na celkové schopnosti a funkce SiteGrinderu trochu podrobněji.

SiteGrinder společnosti Media Lab je svým způsobem unikátní plugin pro Adobe Photoshop a Photoshop Elements, jehož úkolem je co nejvíce automatizovat sestavování a tvorbu webových stránek přebíraných přímo z konkrétního designu dané stránky či websitu. Zjednodušeně řečeno, SiteGrinder umí převést grafický soubor Photoshopu přímo do podoby reálné webové stránky, respektive HTML dokumentu.

SiteGrinder existuje ve verzích pro Windows i Macintosh a vystačí si s jak s Photoshopem 6.0 a novějšími verzemi, tak i s Photoshop Elements 3 a výše. Společnost Media Lab nabízí dvě varianty pluginu – SiteGrinder 2 Pro s cenou 249 USD a SiteGrinder 2 Basic prodávaný za 129 USD. SiteGrinder 2 Basic narozdíl od varianty Pro nepodporuje prvky formulářů, multimediální objekty ani Flash animace, neumí vytvářet webové galerie ani slideshow (viz dále), nemá žádné možnosti napojení na PHP skripty a nedovolí používat jako pozadí stránky textury.

Zkonvertovat do HTML dokumentu pochopitelně nelze každý PSD dokument Adobe Photoshopu, nýbrž pouze dokumenty s příslušně sestavenými a poskládanými vrstvami a dalšími speciálními informacemi. Pořadí vrstev, jejich umístění a pojmenování ovlivňuje především chování tlačítek a dalších navigačních prvků. K dispozici je celá řada parametrů přidávaných do pojmenování jednotlivých vrstev PSD dokumentů, kterými se pak řídí kompilace výsledné webové stránky. Výstupem z pluginu je pak HTML dokument s kaskádovými styly, který SiteGrinder sestaví prakticky zcela sám, nemusíte disponovat žádnými podrobnými znalostmi HTML/XHTML kódu či kaskádových stylů.

Media Lab SiteGrinder 2.0.7 - URL odkazy pro grafická tlačítka a navigační prvky a odkazy na další stránky ve websitu přebírá SiteGrinder přímo z pojmenování vrstev dokumentů Photoshopu, odkazy si ale samozřejmě můžete upravit i manuálně při exportu websitu

Novinky

Mezi nové funkce pluginu patří například automatická konverze textových stylů Photoshopu do podoby odpovídajících kaskádových stylů – tzn. například tučné písmo, kurzíva či barvy textů se automaticky převádějí na adekvátní kaskádové styly. Konverze textů se navíc týká i dalších formátovacích charakteristik, včetně odsazení odstavců, prokladu znaků, zarovnávání textů apod. Inteligentní převod textů funguje pro textové vrstvy s vypnutým vyhlazováním, vyhlazené texty ponechává SiteGrinder v grafické podobě. Textová pole lze navíc převést na scrollovatelná v daném rámci přidáním speciálního parametru „-scroll“ na konec textové vrstvy.

Zajímavá je funkce pro generování obrázkových galerií a Flash slideshow (z obrázků a fotografií uložených v libovolném adresáři), pro které nabízí SiteGrinder řadu předvoleb ovlivňujících jejich vzhled. Flash slideshow mohou mít přiřazenu MP3 hudbu na pozadí prezentace a můžete si u nich nastavit různé přechodové efekty, časování přechodů a také pan & zoom efekty.

Vertikální a horizontální navigační menu mohou být víceúrovňová a skládat se z textů, grafiky či kombinovaných grafických a textových prvků. Další novinkou v SiteGrinderu 2 je podpora standardních formulářových prvků s možností napojení na CGI a PHP skripty, manipulace s formuláři je ale v pluginu přinejmenším neohrabaná a také poměrně komplikovaná.

Změny se u druhé verze pluginu dotkly také nastavení pozadí, ve kterém můžete používat nejen barvy, ale nově též bezešvé textury. Novinkou v rámci grafických efektů je například možnost použití stínů kolem objektů a také vkládání multimediálních souborů (Flash či GIF animace nebo QuickTime video) namísto objektových vrstev, respektive na jejich pozici.

Novinkou při exportu webové stránky je variabilní komprese (nastavitelná pro každou vrstvu PSD dokumentu zvlášť), podpora zaoblených okrajů objektů a především kompletní CSS design bez použití tabulek. Generovaný HTML dokument by měl být validní dle standardu XHTML 1.1, nicméně při ověřování výstupu pomocí online W3C validátoru je pravdou spíše opak.

Media Lab SiteGrinder 2.0.7 - vlastnosti textových tlačítek jsou pochopitelně podrobnější než pro grafické navigační prvky

Media Lab SiteGrinder 2.0.7 - základní vlastnosti jednotlivých stránek ve websitu zahrnují například možnosti centrování stránek, nastavení jejich pozadí apod.

Media Lab SiteGrinder 2.0.7 - před finálním publikováním celého websitu či jednotlivých webových stránek zobrazuje v režimu Preview plugin celkovou zprávu a vlastnostech generovaného websitu

Media Lab SiteGrinder 2.0.7 - nastavení komprese pro exportovanou grafiku je možné provést i pro každou vrstvu zvlášť

Závěr

I přes zjevný vývoj se už z principu jedná v případě SiteGrinderu o jednoúčelový plugin, jehož výsledkem je díky poměrně specifickému HTML/XHTML kódu webová stránka, která se příliš nehodí k další editaci. I když je SiteGrinder dost výjimečný prostředek, výjimečná a dost přehnaná je i jeho cena. Celkově má tento produkt jen velmi málo možností, jak konkurovat klasickým HTML editorům, a to nejen v oblasti navigačních prvků (různá menu apod.), ale také z hlediska výsledného zdrojového kódu webové stránky. Využití pluginu směřuje například do oblasti webových galerií s variabilním designem, různých unifikovaných šablon jednodušších webových stránek, předloh weblogů apod. a také tvorby náhledů webových stránek. U tvorby složitějších websitů je velmi znát celková „nepružnost“ pluginu, který tak spíše starosti působí, než aby je webdesignérovi a grafikovi v jedné osobě ubíral.

Pokud se tedy smíříte (nebo naopak něco takového dokonce vyžadujete) s tím, že SiteGrinder prakticky všechno udělá při „kompilaci“ webové stránky za vás a naučíte se už při tvorbě grafického designu používat různé speciální značky a parametry pro označování vrstev PSD dokumentů, pak si plugin určitě vyzkoušejte, jinak se mu raději vyhněte širokým obloukem. Zkušební verzi SiteGrinderu 2 Pro si můžete stáhnout zdarma z webových stránek společnosti Media Lab.

Media Lab SiteGrinder 2.0.7 - "dekoračními" prvky v designu websitu je především orámování grafických či textových objektů

Media Lab SiteGrinder 2.0.7 - součástí předvoleb pluginu pro daný website je například nastavení metatagů, odkaz na externí kaskádové styly, prodleva pro rollover efekty aj.