Web je hezký, leč použitelnost je mnohdy až na druhém místě (osobně jsem dlouho hledal na homepage vyhledávací pole nebo jsem až po detailním zkoumání objevil cenu v detailu produktu). Nejvíce mě ovšem zaujal graficky moc hezky pojatý návod na první straně. Laicky přeloženo:

1. Vytvořte si účet
2. Vložte na něj nějaké peníze
3. Najděte si nějaký soubor, který vás zaujme
4. Kupujte a stahujte

Tento postup je z pohledu provozovatele naprosto ideální – vytvořím účet (konverze), zaplatím (další konverze) a pak začnu hledat a stahovat (konverze). Huh. Může to takto v reálném světě fungovat? Ani náhodou! Vytvořit si účet na webu, o kterém nevím jestli ho budu používat? Dokonce platit předtím, než si něco najdu?

Provozovatelé FD si musí být buď naprosto jistí, že od nich budu něco chtít, nebo jsou naopak zcela vyčůraní a již dopředu si pokoušejí zajistit konverze, které by vzhledem k obsahu webu nenastaly. Přece jen platí pravidlo, že nejdříve musí web něco nabídnout návštěvníkovi a až potom od něj může vyžadovat výdej energie. Ideálně by to tedy mělo být naopak:

1. Najděte si nějaký soubor, který vás zaujme
2. Vytvořte si účet
3. Vložte na něj nějaké peníze
4. Kupujte a stahujte

K bodu jedna bych pak přidal odkaz na nejstahovanější a nejpopulárnější soubory, které by mohly zaujmout většinu návštěvníků. Ač obecně flash nepoužívám, tak takový hromadný upload souborů by se mohl na mnohých projektech hodit.

Konceptuálně je web Zelené hvězdy rozdělen na odborné články a studie pro lékaře a rozsáhlý eshop se zdravotnickými potřebami. Eshop by měl projít do prázdnin dalším letmým redesignem, který ho přiblíží i pacientům (web je primárně zaměřen na lékaře, kteří hledají konkrétní produkty v podstatě podle názvu).

Běžný návštěvník vidí z webu Zelené hvězdy pouhý zlomek – jejím jádrem je především B2B aplikace pro lékaře a rozsáhlé administrační rozhraní.

Technologicky je web na půl cesty k 2.0ce – hodně ajaxu, ale zase žádné velké komunitní funkce (nejsou potřeba). Na Zelené hvězdě je mimo jiné použita i implementace Chosého skriptu pro ořez obrázků, díky které jsou seznamy článků a pravý sloupec příjemně ozvláštněny a unifikovány.

Ze Zelené hvězdy mi rovněž vyplynulo životní poučení – nikdy nedávej do grafického návrhu obrázkové nadpisy, když nevíš, kolik jich nakonec bude potřeba udělat.

U mřížky ještě zůstaneme – Grid-Based Design: Six Creative Column Techniques je článek na Smashing Magazine o technikách, kterými můžete dát své mřížce šťávu (a rovněž zvýraznit některé prvky designu).

Nejúžasnější publikační systém Wordpress postoupil na verzi 2.5, jejíž administraci nenavrhoval nikdo jiný než Happy Cog.

S Wordpressem souvisí i 60+ atypických designů blogů, které jsou postaveny na WP (což se hodí jako inspirace pro můj další redesign, na který už se třesu alespoň měsíc, ale nevytřásl jsem zatím nic).

Nakonec zůstaneme u typografie – článek blogu i love typography: On choosing type, který se prokousává základy volby písma. Tak schválně – je pro odstavcový text lepší serifové nebo bezserifové písmo?

A zcela na závěr jistý plakátek, který byl k vidění na zasněžených švýcarských svazích a naprosto mě uchvátil. Jedná se o reklamu na Euro 2008, pro každou národnost v jejím vlastním jazyce, vše v jednotném stylu.

Email byl zakončen větou: „Vzhledem k tomu, ze je ve VAŠEM zájmu, aby si stránku prohlédli i uživatelé s ne zcela nejmodernějším internetovým prohlížečem, možná byste s tím mohli něco udělat“…

Sypat si popel na hlavu?

Prohlížeče měly v roce 2003 problém s korektním zobrazováním kaskádových stylů, natožpak s javascriptem. Je tedy zcela logické, že se web zcela nezobrazí dle původního záměru grafika. A i kdyby šel kód webu předělat tak, aby se zobrazoval zcela korektně v tak starých prohlížečích, vložené úsilí se zákazníkovi nikdy nevrátí.

Účelem webu není jeho pixel-perfect zobrazitelnost ve všech známých prohlížečích, ale zisk (tj. konverze, ať už jakékoliv). Web je tedy potřeba postavit tak, aby i ve starších prohlížečích, s vypnutým JS/CSS/obrázky, či zastaralým technickým vybavením nebránil konverzím. Bohatě tedy postačuje kombinace dodržování webových standardů, letmé otestování proti pravidlům přístupnosti a test webu v nejrozšířenějších prohlížečích.

To, že pár promile uživatelů uvidí místo designu webu pitoreskní nudli nehraje roli – oni tak vidí i všechny ostatní weby (a tudíž by je to mohlo motivovat k upgrade).

Dodatek

Kdybyste věděli o brňákovi, který by chtěl dělat na pozici Account Executive v reklamce, tak ho odkažte na tento inzerát.

Náplň práce:

• administrativní podpora account managerů
• zajištění realizace zakázek uvnitř firmy
• kompletace podkladů k zakázkám
• tvorba kalkulací a podkladů pro fakturace
• samostatné vedení dílčích projektů

Požadujeme:

• spolehlivost
• schopnost samostatného uvažování a rozhodování
• ochotu učit se novým věcem
• zkušenosti na obdobné pozici výhodou

Nabízíme:

• proškolení v potřebných oblastech
• naše zkušenosti z oboru a pravidelnou zpětnou vazbu k provedené práci
• perspektivu rychlého profesního i osobního růstu
• zázemí rychle se rozvíjející mladé firmy
• řadu zaměstnaneckých výhod
• sympatický mladý kolektiv

Máte-li zájem, pošlete nám svůj strukturovaný životopis a kontaktní údaje nejpozději do 9.4.2008 do na jobs (at) ftmc.cz.

Máš zkušenosti s Sklikem a Adwords (ideálně i nějaké školení)? Baví tě optimalizovat a vylepšovat kampaně? Chceš se podílet na projektech pro přední společnosti v daném oboru? Můžeš být alespoň jeden den v týdnu v kanceláři v Brně? Přidej se k nám!

Nabízíme

• právě tolik práce, kolik si nabereš
• ohodnocení dle dohody
• fajn kolektiv
• možnost spolupráce i na HPP (v takovém případě by se jednalo o kombinaci práce správce ppc kampaní a e-publishera)
• start ideálně v dubnu

V případě zájmu piš na e-mail tomas.izak (at) jpconsult.cz, do předmětu uveď [ppc].

H1čka se rozhodla rozdělit svá školení seo na dvě části – Školení SEO pro marketéry a vedoucí projektů, kterého jsem se zúčastníl dnes a Školení SEO pro webmastery, které dle slov Marka Prokopa více vychází z původního školení SEO a je zaměřeno na technickou stránku věci. A udělali dobře.

Program školení byl informačně obsáhlý, odcházel jsem o půl šesté – těsně před závěrečnou kapitolou – budování zpětných odkazů. Součástí školení není technická implementace jednotlivých seo technik (ač Marek bez problému zodpoví i technické dotazy), ale především rozplánování optimalizace z pohledu celého projektu a realizace jednotlivých etap.

Markovy prezentační schopnosti jsou každopádně rok od roku lepší – kdybyste se mě zeptali před rokem, vsadil bych z pohledu podání školení na Martina Koptu, dnes už bych je označil za rovnocenné.

Zaskočily mě některé dotazy některých lidí, kteří se optimalizací pro vyhledávače již několik let živí. Mnohé bych byl schopen dostatečně zodpovědět sám, ačkoliv se optimalizací zabývám v podstatě okrajově.

Na závěr uvádím perličku – jeden účastník (zcela seriózně) konstatoval, že long tail klíčových slov si vymyslela společnost H1… psali to prý v komentářích na Lupě…

Moje hodnocení: jestliže ve své firmě patříte mezi ty, kteří spíše plánují a řídí než fyzicky implementují, tak je pro vás školení seo v podání Marka velice vhodná investice – raději dříve než později.

Vzkaz od Marka: Školení PPC reklamy pro pokročilé, které bude v Brně na konci března má ještě volná místa.

Požadavky dávaly webdesignerům relativně volné ruce, ale rovněž nebyly nijak zvlášť motivující. Měl jsem tou dobou malou pracovní časovou kapsu, a tak jsem se do návrhu nového webu fakulty pustil.

K výsledku jsem připojil docela dlouhý email, ve kterém jsem doporučoval vzít redesign hezky od analýzy a nezaměřovat se jen na novou tvář fakultního webu. Můj názor byl vyslyšen a na podzim tohoto roku jsme proseděli nad webem fakulty pěkných pár desítek hodin.

Fakulta tak získala nejen novou tvář a dobrých 35 unikátních šablon, ale i podklady pro případný rozvoj webu dále. Některé sekce doposud nebyly implementovány dle návrhu, ale věřím, že to ještě přijde.

Můj hlavní cíl pro redesign byl relativně prostý – dát webu fakulty menu a doplnit jednotlivé stránky motivačními fotografiemi. Web je fluidní a osciluje mezi šířkou 770px a tuším 960px, obsahuje styl pro slabozraké uživatele, označení pro různé typy dokumentů, zvýraznění odkazů pro ovládání klávesnicí, přeskakovací odkazy apod.

Nový design se nemusí líbit každému, doposud máme převážně pozitivní ohlasy. Osobně si myslím, že v případné další fázi úprav fakulta nebude akutně potřebovat designera, ale copywritery, kteří přidají a předělají obsah webu. K designu dodávám, že vznikl nejen na základě mé představy, ale i určitých kompromisů, které bylo třeba udělat.

Redesignem webu fakulty jsem si splnil svůj dlouholetý sen a děkuji představitelům fakulty (hlavně panu docentu Michalu Brandejsovi, se kterým probíhala většina jednání) a Tomovi (JP Consult) za pomoc s jeho bezproblémovou realizací.

Vždy mě lehce zamrazí, když si přečtu na webu mladého a nadějného webtvůrce, že vytváří jednoduché weby. Pak se podívám na jeho reference a vidím proč – když jsou jednoduché weby to jediné, co umí, tak mu nic jiného nezbývá.

Považuju tento stav za zcela normální, a každý webdesigner se tím musí dříve nebo později prokousat – érou jednoduchých webů, přes hledání drobných detailů, které mohou celkový dojem z webu zpříjemnit, až ke komplexním velikánům, kde má každý jednotlivý pixel své místo a bez něj by to prostě nebylo ono.

A právě takovéto drobné detaily mohou být např. stíny, reliéf, či přechody, tedy zcela běžné efekty, které lze aplikovat na vrstvu ve photoshopu. Už slyším výkřiky hrůzy.. to chceš, aby weby vypadaly jak v roce 2000? Ale prd.

Tyto efekty jsou příjemným detailem pouze ve chvíli, kdy nejsou skoro vidět. Přechod je dobré aplikovat střídmě a velice lehce – volíme podobné barvy, reliéf pouze několika málo procent, stíny či zář jakbysmet.

Experimentujte a výsledky vás možná překvapí.

Související

• PSDTuts: Elements of Great Web Design: The Polish

U menu ještě chvíli zůstaneme – kterak vytvořit zajímavý efekt pomocí CSS se dozvíte v článku Advanced CSS Menu Trick. Autorovu verzi bych si ovšem na web nedal – rozmazání je pro většinu designů příliš tvrdé a výrazné.. zato např. zešednutí.. obecně se však jedná o efekt spíše na soukromé projekty..

Design portálu MSNBC se mi ohromně líbí – a zřejmě nejsem sám, protože jsem v poslední době narazil hned na dva návody, kterak udělat hezký přechod v jeho hlavičce. Lepší z nich najdete na PSDTuts, o něco kontroverznější (viz komentáře) a s o něco horším výsledkem na ThinkVitamin.

Závěrem přidávám odkaz na sadu 20 ikonek zdarma pro použití v komerčních i soukromých webových aplikacích – WebAppers Released Free Web Application Icons Set.