Expression Web aneb Frontpage dnes kradou jen hlupáci

Pokud se nějaký teenager nebo i starší neználek chce pustit do tvorby webových stránek, automaticky zjišťuje, jak se co nejjednodušeji dostane k programu Frontpage. Tomuto editoru webových stránek nelze upřít jednu věc – obrovskou popularitu, která se jen obtížně překonává, a to i přesto, že je již několik měsíců na trhu nové a mnohem lepší řešení pro tvorbu webových stránek.

Náhradou Frontpage by se měl stát Microsoft Expression Web. Jde o povedenou kombinaci vizuálního editoru s možností úprav kódu. Expression Web je určen především jako rychlá pomůcka pro návrh vzhledu webové stránky. Vytvoříte s ním kompletní weby pracující se statickým XHTML. Jestliže vytváříte webovou aplikaci využívající prvky ASP.NET, můžete je do návrhu webové stránky zabudovat a celý projekt pak předat vývojářům do Visual Studia, resp. do Visual Web Developeru. 

XHTML a další standardy

MS Expression Web je založen na XHTML a kaskádových stylech. Snaží se přísně dodržovat tyto standardy, takže se nemusíte bát, že by po práci ve vizuálním režimu vznikl balast podobný webové stránce vytvořené třeba ve Wordu. Pro nastavování hodnot kaskádových stylů je připraven speciální panel, ve kterém vyplňujete konkrétní vlastnosti. Expression Web pak zadání automaticky promítá do připojeného souboru stylů. Vlastnosti stylů jsou také automaticky měněny například při přetahování nebo změnách velikosti prvků pomocí myši. 

Jestliže v rámci kaskádových stylů pracujete s vrstvami, tj. používáte vlastnost z-index, pak Expression Web automaticky tyto vrstvy rozeznává a nabízí vám jednoduchého správce pro snadnou orientaci v těchto vrstvách.

Microsoft Expression Web

Práce s vrstvami 

Ve vizuálním režimu máte k dispozici klasické formátovací nástroje, výběr konkrétních stylů, práci s mezinadpisy, nástroje pro vkládání obrázků atd. Ve speciálním panelu pak najdete všechny HTML komponenty, které můžete přetahovat na plochu stránky. Jednoduše tak poskládáte třeba webový formulář. V nabídce nechybí ani zmíněné ASP.NET komponenty, včetně propojení na datové zdroje.

Microsoft Expression Web

Nabídka komponent pro vložení do stránky 

Co se vizuálních úprav týče, bez problému můžete vkládat text třeba z Wordu a přitom si zvolit, v jaké podobě bude vložen. Je možné zachovat jeho zdrojové formátování, použít cílové z HTML stránky nebo vložit obsah stránky čistě jako text. Tedy klasická nabídka, kterou znáte například z Wordu nebo Excelu.

Vizuální úpravy a validita kódu 

Ve vizuálním režimu jsou automaticky označovány vybrané značky, pomocí jakési obdoby drobečkové navigaci v horní části okna programu máte možnost označovat nadřazené prvky. Každý z nich má přitom rozbalovací nabídku, která ukrývá funkce pro výběr značky, výběr jejího obsahu, vyvolání úprav, odstranění, zalomení, vložení HTML, nebo nastavení vlastnosti CSS position (fixed, absolute, static, relative).

Microsoft Expression Web

Expression Web ve vizuálním režimu 

Vizuální režim má výhodu, že stránku vidíte ihned takovou, jak bude vypadat na webu. Expression Web používá vykreslovací jádro Internet Exploreru 7. Na základě DOCTYPE se vykreslování ve vizuálním režimu provádí buď standardně, nebo v režimu Quirks. Na základě DOCTYPE se také automaticky vytváří kód dokumentu – Expression Web se snaží být validní vzhledem ke zvolené deklaraci.

Expression Web pro kodéry 

Vizuální režim je pěkná a praktická věc, ale řada profesionálů často potřebuje zasáhnout přímo do kódu. Expression Web má co nabídnout i v tomto režimu práce. Automatická nabídka pro rychlé vkládání kódu pružně reaguje na vaše zadávání, samozřejmostí je automatické uzavírání párových značek. V nabídce je množství praktických funkcí pro práci se značkami a bloky kódu.

Microsoft Expression Web

Expression Web v režimu práce s kódem stránky 

Editor umí kód přeformátovat tak, aby byl co nejlépe čitelný. V nabídce jsou čisticí funkce pro odstranění nadbytečných značek vzniklých například při importu HTML stránky vytvořené v nestandardním editoru nebo třeba ve Wordu. Napsat si můžete i vlastní makra, která budou kód zpracovávat.

Microsoft Expression Web

Kontrola validity dokumentu 

Poněkud ukryto zůstává ověřování validity kódu. K tomuto účelu Expression Web nabízí tzv. reporty. Accessibility Reports vám podá hlášení o přístupnosti stránek dle WCAG a Access Board Section 508. Compatibility Reports prověří validitu dokumentu na základě zvoleného DOCTYPE a použitelnost kaskádových stylů na základě zvolené verze CSS. Standardně je nabízeno CSS 2.1, k dispozici jsou i starší verze a specialita v podobě CSS IE. Konečně specializované CSS Reports vám nabídnou obrázek o tom, zda nemáte definovány nepoužité a chybné styly.

Zapomeňte na rámce 

Pro co nejrychlejší tvorbu stránek se kdysi používaly rámce, později se přešlo na útržky PHP nebo ASP kódu. Bylo to z toho důvodu, že v rámci každého webu mají stránky řadu společných prvků, například hlavičku a navigační menu. Změna takovéto části by znamenala úpravy ve všech HTML stránkách. Rámce a použití PHP/ASP to řešily tak, že daná část byla tvořena samostatným souborem a pomocí rámců (nebo PHP/ASP) přiložena ke každé zobrazované stránce. Mělo a má to řadu nevýhod, od nemožnosti optimalizace stránky pro vyhledávače u rámců až k potřebě znalosti práce s PHP/ASP.

Expression Web se inspiroval u Visual Studia a řeší zmíněný problém mnohem elegantněji. Pro statické HTML jsou nabízeny tzv. Dynamic Web Templates. Pro přípravu ASP.NET webových aplikací použijete obdobu pod názvem Master Pages. Obojí funguje na principu vzorové předlohy pro všechny stránky v projektu. Touto předlohou je jakási kostra společná všem stránkám. Vytvoříte hlavičku, menu, patičku a všechny společné prvky stránek. S předlohou zkrátka pracujete jako s kteroukoli jinou stránkou.

Po dokončení předlohy pak určíte, které části se budou měnit. Jednotlivé stránky webu pak vytváříte na základě těchto předloh. Při úpravách takto vytvořených stránek vám Expression Web dovolí změnit pouze ty části, které byly v předloze určeny k úpravám. Výhoda je zřejmá. Odpadá tvorba nebo kopírování společných částí při vytváření každé nové stránky v projektu. To nejlepší však spočívá v pozdějších úpravách předlohy. 

Pokud třeba zjistíte, že je potřeba doplnit položku do navigace, změnit obrázek v hlavičce stránky nebo cokoli dalšího, stačí to provést pouze v souboru s předlohou. Expression Web pak dovede tyto změny automaticky promítnout do všech HTML stránek v projektu. Jakékoli úpravy jsou tedy stejně rychlé jako při použití rámců nebo ASP/PHP, pracujete však stále s HTML a stránky jsou dokonale přívětivé pro vyhledávače.

Šablony a kostry stránek 

Součástí Expression Webu je řada šablon pro začínající uživatele. Pokud vám nebudou vyhovovat návrhy kompletních webů, pak třeba využijete návrhy layoutů, kdy je vytvořena pouze základní kostra HTML doplněná o několik kaskádových stylů. Nemusíte se tedy zdržovat vymýšlením a sestavováním dvousloupcového layoutu s navigací a hlavičkou nebo podobnými kombinacemi. Vše je navíc funkční v různých prohlížečích.

Microsoft Expression Web

Nabídka šablon v Expression Webu

Expression Web podporuje zobrazení náhledu v různých velikostech, stránky tak odladíte třeba pro rozlišení obrazovky 1 024  × 768 nebo jiné. Potěšila mě podpora různých prohlížečů instalovaných v systému. V mém případě Expression Web našel kromě Internet Exploreru i Firefox, přičemž různé režimy náhledu nabízí pro oba. Specialitou je spuštění všech nalezených prohlížečů ve zvoleném režimu. 

Microsoft Expression Web

Možnosti zobrazení stránky 

Čeština, ceny, download

Jestliže vás zajímá spojení Expression Web a čeština, pak vězte, že čeština je podporována při kontrole pravopisu. Expression Web se chová stejně jako textový editor, čili pokud máte třeba v rámci MS Office instalován pravopisný slovník s češtinou, můžete používat českou kontrolu pravopisu a slovník synonym.

Microsoft Expression Web získal ocenění 5/5 na Maxiorel.czExpression Web je povedený program, který je více než důstojnou náhradou za Frontpage. Spoustu dalších informací o tomto povedeném editoru najdete na domovské stránce produktů z rodiny Expression (www.microsoft.com/expression). Patří mezi ně také grafický editor, nástroj pro návrh vzhledu aplikací a správce multimédií Microsoft Expression Media, o kterém jste si na Maxiorlovi mohli přečíst nedávno. 

Cena programu nepatří k nejnižším ( 9 454 Kč s DPH na Cybexu). Mnohem zajímavější je upgrade. Ten vás vyjde zhruba na třetinu částky za nový program (3 143 Kč s DPH na Cybexu). Ještě nižší cena je pak nabízena pro školy. Také vám doporučuji sledovat nejrůznější akce, Expression Web pak lze pořídit i bez upgradu za zajímavou cenu, případně lze čas od času upgradovat i z jiných produktů. Pokud tedy chcete pracovat s profesionálním programem, není důvod jej krást.

Chcete-li si program stáhnout ve zkušební verzi, vyhledejte na jeho domovské stránce rozbalovací nabídku Expression Web, položku Free Trial a poté klepněte na odkaz Download.

Buďme ve spojení, přihlaste se k newsletteru

Odesláním formuláře souhlasíte s podmínkami zpracováním osobních údajů. 
Více informací v Ochrana osobních údajů.

Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal, WordPress a Symfony. Acquia Certified Developer & Site Builder. Autor několika knih o Drupalu.
Web Development Director v Lesensky.cz. Ve volných chvílích podnikám výlety na souši i po vodě. Více se dozvíte na polzer.cz a mém LinkedIn profilu.

Komentáře k článku

návštěvník

Docela by mě zajímalo, zda si Expression studio v EDU verzi mohu zakoupit i jako student?

návštěvník

Při odesílání mi byla vypsána tato chyba.

Admin: to byl nějaký renonc kvůli stavu serveru...

návštěvník

povedený program, který je náhradou za FrontPage to je oxymoron přímo ukázkový :)

Profile picture for user Jan Polzer

Co vidíte jako protimluv na tom, když se o nějakém novém programu řekne, že je lepší, než FrontPage? Expression Web se opravdu povedl. A že je myšlen jako náhrada už ne tolik povedeného FrontPage, to je pravda také.

Jan Polzer, Maxiorel.cz, Screenshots Archive, Anastacia.cz

návštěvník

Clanok je naozaj dobry, ale nadpis mi pripada trocha od veci. Mam z neho pocit ako bezmocny vykrik do prazdna, pretoze nie je v nom logika. Ved napokon 0 je vzdy vyhodnejsia ako akakolvek ina suma. Bohuzial, tak to vo svete je a ine to nebude. Je pravda ze softwarove piratstvo znizuje developerske zisky, ale je to realita. Zalamovanie ruk na tom nic nezmeni. Ani tvorba virusov nie je dobra, ale tak isto je to realita a ma za nasledok vyvoj antiviroveho softwaru co je dalsi biznis. Tak ako mi je na internete sympaticke ze dava bezplatny pristup k nesmiernemu mnozstvu informacii, vzdelania, vsetkym ktory maju k nemu pristup, bez nadmerneho spoplatnovania vsetkeho po com by clovek zatuzil (to za casov knih nebolo mozne, clovek mohol len snivat o tak rychlom pristupe k najroznejsim informaciam), podobne ani neodsudzujem ludi ktory kopiruju a delicencuju software a spristupnuju ho sirokej verejnosti bezplatne. Aspon cely svet nieje iba o peniazoch, o chudobnych, strednych a bohatych. Som vcelku rad ze existuje aspon jedno miesto (internet), kde sa da takmer vsetko elektronicke zohnat zadarmo. Ale to je iba moj sukromny nazor, nikomu ho nevnucujem ale rad sa on podelim.

Přidat komentář

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Moje kniha o CMS Drupal

 

Kniha 333 tipů a triků pro Drupal 9


Více na KnihyPolzer.cz

Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Poslední komentáře
Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

@maxiorel na Twitteru

Maxiorel na Twitteru