SiteGrinder 1.05, generování webu přímo v Adobe Photoshopu - Grafika.cz - vše o počítačové grafice

Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:



Photoshop

SiteGrinder 1.05, generování webu přímo v Adobe Photoshopu

Photoshop plug-in

9. srpna 2005, 00.00 | Unikátní plug-in na tvorbu a export webových stránek přímo z Adobe Photoshopu nemůžeme nechat bez povšimnutí. Popis plug-inu a stručnou úvahu o tom, nakolik může být doplněk tohoto druhu užitečný, vám nyní nabízíme.

SiteGrinder společnosti Media Lab je svým způsobem unikátní plug-in pro Adobe Photoshop, ve kterém funguje v podstatě jako editor webových stránek. Hlavním úkolem plug-inu je "připravit" v Photoshopu navrženou grafiku pro export defacto kompletní webové stránky či většího počtu stránek, které umí SiteGrinder generovat přímo z vrstev libovolného dokumentu Adobe Photoshopu. Cena plug-inu je 129 USD, k dispozici jsou verze pro Windows a Mac OS X.

SiteGrinder pracuje jako nezávislý generátor HTML dokumentů, které se automaticky skládají podle adekvátně pojmenovaných vrstev aktuálního PSD dokumentu. K dispozici je podrobný systém zpráv, podle kterých se lze vcelku dobře orientovat nejen při tvorbě designu, ale především při generování HTML stránek s kaskádovými styly. CSS styly jsou totiž současně základním stavebním prvkem webových stránek exportovaných pomocí SiteGrinderu, součástí plug-inu je samozřejmě i plně automatizovaný systém pro "rozřezání" grafiky podle nadefinovaných vrstev.


SiteGrinder 1.05 - pracovní prostředí plug-inu

Základní pracovní prostředí SiteGrinderu je v podstatě jedno hlavní okno rozdělené do klasických záložkových sekcí, ve kterých jsou volby pro definování odkazů, navigačních prvků a dalších vlastností exportovaného webu. Generování zpráv probíhá pomocí jádra webového prohlížeče integrovaného v grafickém rozhraní plug-inu. Jednotlivé pracovní sekce nabízí základní operace jako je třeba tvorba textových tlačítek včetně rollover efektů nebo možnost nadefinování jednotlivých podstránek celého websitu. Samozřejmostí je též výběr grafického formátu (JPEG, PNG nebo GIF včetně komprese či počtu barev) pro ukládání jednotlivých "nařezaných" segmentů websitu.

Konverze grafických dokumentů do podoby webové stránky vyžaduje několik manuálních úkonů. Tím nejdůležitějším je správné pojmenování vrstev, které není u strukturovanějších webů zrovna dvakrát přehledné. Přesně je totiž nutno pojmenovat všechny vrstvy s tlačítky i všechny dalšími segmenty stránky, podle jejichž názvů pak SiteGrinder skládá finální webovou stránku. Webová stránka vytvořená s pomocí SiteGrinderu není jen obyčejný statický HTML dokument bez navigačních prvků, nýbrž může obsahovat i poměrně komplexní navigační systém například včetně rollovers efektů s animovanými menu. Součástí webu mohou být i tzv. pop-up menu a pochopitelně též libovolné množství grafických či textových tlačítek s libovolnými odkazy na jiné části webu. Konkrétní příklad: například vrstvy pro tlačítka je nutno pojmenovat "název-button", rollover efekty pro tlačítka "název-rollover" a odkazy pak "název-link". Důležité je samozřejmě i pořadí systému vrstev, podle kterého se pak SiteGrinder orientuje při analýze a skládání webu. U starších verzí Adobe Photoshopu si můžete tyto informace o vrstvách nadefinovat přímo v plug-inu, u Photoshopu CS si vše umí SiteGrinder zjistit sám.


SiteGrinder 1.05 - tlačítka na webové stránce generované plug-inem mohou být nejen grafická, ale také textová například včetně ztučnění textu po najetí myší eventuálně podtržení textu a změně jeho barvy


SiteGrinder 1.05 - dostupné efekty při definování textových tlačítek


SiteGrinder 1.05 - výběr formátu pro kompresi grafických prvků webové stránky


SiteGrinder 1.05 - jedna ze speciální voleb pro definování struktury vrstev používaných pro generování webových stránek

Analýza PSD souboru v SiteGrinderu je hodně zajímavá. Plug-in si umí zjistit nejen páry sloučených vrstev pro grafická tlačítka s rollover efekty, ale pochopitelně též pozici, rozměry a další informace o všech ostatních vrstvách. Analýza funguje evidentně přes skripty, neboť poskládání a export celého webu dost dlouho trvá. Součástí analýzy je velmi podrobná zpráva, ve které jsou uvedeny všechny případné nesrovnalosti či problémy týkající se sestavení finální webové stránky.

Celý proces sestavení webové stránky v SiteGrinderu je hodně netradiční a zprvu působí zajímavě, na druhou stranu ale přináší velmi malou flexibilitu práce. Je sice celkem snadné nadefinovat příslušná tlačítka a jiné grafické či textové segmenty webové stránky, samotné ladění výsledku je ale dost komplikované nehledě k nulovým možnostem editovanou stránku nějak smysluplně upravit. Mám samozřejmě na mysli interní HTML/CSS kód apod., samotnou grafiku lze samozřejmě v Photoshopu upravit bez problémů. Ke slovu tak nakonec stejně vždy přijde klasický HTML editor, ve kterém je zpravidla nutné webové stránky vygenerované SiteGrinderem dále upravit. Plug-in tak vlastně jen nahrazuje manuální rozřezání grafiky na tlačítka a omezuje kreativitu webdesignéra na několik málo grafických prvků a rollover efektů (které lze mimochodem v ImageReady vyrobit také).

Celý systém SiteGrinderu mi tak přijde spíš jako hodně zajímavá, avšak nepříliš efektivní placená hračka. Plug-in dokáže sice důsledně, ale zato nepříliš efektivně zautomatizovat základní sestavení webové stránky, navíc bohužel bez prakticky jakýchkoliv možnosti manuálních zásahů. Chcete-li si SiteGrinder vyzkoušet, můžete si zdarma stáhnout jeho zkušební verzi.


SiteGrinder 1.05 - definování jednotlivých podstránek websitu je vcelku přehledné, ale nabízí jen velmi málo možností odlišení jednotlivých podstránek


SiteGrinder 1.05 - výběr grafického dokumentu Adobe Photoshopu použitého pro sestavení websitu




SiteGrinder 1.05 - v rámci definování odkazů pro jednotlivá tlačítka lze používat i e-mailové odkazy či odkazy na soubory


SiteGrinder 1.05 - jedna z plug-inem nabízených zpráv obsahujících informace o generování layoutu webové stránky či stránek

Tématické zařazení:

 » Rubriky  » VSE  

 » Rubriky  » Go verze  

 » Rubriky  » Webdesign  

 » Rubriky  » Photoshop  

 

 

 

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: