Seriál webdesign - 2. část
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Seriál webdesign - 2. částSeriál webdesign - 2. část

 
Hledat
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Pergoly a střechy Brno

Seriál webdesign - 2. část

Google       Google       29. 3. 2006       18 859×

Po delší odmlce se vracím k seriálu webdesign. Navrhneme si rozvržení budoucího designu, řekneme si čeho se vyvarovat, jaké zvolit barvy a neodpustím vám trochu teorie. Ze všeho trochu.

Reklama
Reklama

Pravidlo č.1

Než začneme onu dlouhou pouť na cestě k hotovému designu, chtěl bych vás seznámit s jedním vcelku zásadním pravidlem, které jsem se ještě naplno nenaučil respektovat ani já.

To, že něco můžete udělat neznamená, že to udělat musíte. Zkráceně, méně je někdy více.

Mým problémem je, že tak dlouho design ladím, až ho znehodnotím. Člověk si řekne, hodím tam tamto a už to nechám být. Jenže onen prvek například způsobí nerovnováhu v designu a vy jste nuceni přidat další prvek. A tak se děje do přeplácání designu. Naštěstí už stvořitelé Photoshopu vymysleli metodu ‚progress saving‘ , která vám umožní postupně ukládat vaši práci. Poté shlédnete všechny uložené ‚časy‘ a rozhodnete, který je lepší.

Navrhujeme design

Někteří čtenáři mohou namítnout, že tato metoda je poněkud zbytečná či neefektivní. Hovořím o tužce a papíru. Podobné je to i u tabletu. Já ho ale používám hned z několika důvodů.

› 1. Mám „zápisník“, ve kterém mám navrženy designy, pokud nemám motivaci, stačí mi do něj nahlédnout a rázem je o problém méně.
› 2. Tužka mi umožní přemýšlet nad designem a pokud se mi něco nezdá, jednoduše to udělám jinak. Pokud pracujete přímo v počítači, tuto metodu poněkud ztrácíte a vystavujete se nebezpečí, že design budete dělat znovu nebo jej budete delší dobu upravovat.
› 3. Tužka a papír mi nechají volně plynout fantazii, než stihnu udělat v počítači celý design, původní představa může vymizet. Takto si onen návrh načrtnu a kdykoli se na něj mohu podívat, byť jen pro motivační účel.

Určitě bych našel i další důvody proč zkusit tužku či tablet, ale jdeme dále.

Při náčrtu designu se vyvarujte zbytečných detailů, výsledné linie zvýrazňujte, nenechte zaniknout důležité detaily a nesnažte se udělat design zbytečně přeplácaným.

Doporučuji do designu načmárat i pomyslné „Lorem ipsum“, které na papíře udělá alespoň nadneseně obrázek webu a ukáže vám, jak bude web vypadat. Tužka vám také umožní popřemýšlet o rozvržení informací.

Návrh kompozice:

Poněkud složitější otázka, na kterou nelze odpovědět jednoznačně. Důležitou složkou pro designera je mít dostatečné množství podkladů, informací o firmě. Jinak budete nuceni je hledat sami.

Ještě nikdy se mi nepovedlo navrhnout web pro firmu, o které jsem věděl jen její název.

Doporučuji tedy předem si připravit základní fakta o designu, nejlepší je si nechat napsat od klienta krátkou osnovu, kde odpoví na vaše otázky. Jednou z nejdůležitějších otázek je, kolik procent webu budou obsahovat informace. Obecným pravidlem je procentuální rozdělení obsahu na jednotlivé části, tj. obsahová část, grafická část, navigační a reklamní část. My zůstaneme u poněkud obecnější definice.

Jak asi všichni víte, hlavní je text. Jiným problémem je, že pokud web neskrývá tolik informací, musí toto dohonit právě originalitou a provedením designu. Z toho vyplývá, že pro portály s větší obsahovou částí volíme barvy s menší saturací, menším obsahem grafiky a můžeme si dovolit umístít větší množství reklamních prostor.

Naopak u webů typu portfolio bych volil výraznější barvy, oslnivý design a minimum reklamy. Ale to je snad jasné.

Samostatnou kapitolou je právě navigace, která vám může připravit horké chvilky.

Vývoj navigace:

Při návrhu navigace vstupují do hry otázky použitelnosti a snadné údržby. Pokud není navigace správně navržena, webdesigner riskuje ztrátu uživatele. Jedním z velkých problémů je také příliš velký počet nabídek na titulní stránce, které se nakonec propojují „podle nálady“.

Jakmile začnete do každé sekce přidávat další a další nabídky, které nejsou na jednom místě, web razantně ztrácí na přehlednosti a web se stává labyrintem. Na stránky s větším počtem stránek bych doporučil vytvořit také mapu serveru, která pomůže jak vám při návrhu, tak uživateli v nesnázích.

Ukázka náčrtku a převedeného návrhu do počítače :


Vidíte, žádná složitost. Poměrně jednoduchý design na přání zákazníka, připraven k libovolné úpravě. Idea vznikla 10 minut před tím, než jsem usnul. S myší byste to nezvládli. Proto miluji tužku.

O něco horší je ona „digitalizac“ představy. Hlavně si pamatujte, že málokdy se vám povede převést představu do počítače podle vašich představ. Čím déle ale budete grafiku dělat, tím více „vyzrajete“.

Návrh barev:

Poměrně složitou otázkou je také navržení barevné kompozice designu.

Pokud nemáte zrovna rozvinutý barevný cit, na pomoc si můžete povolat mixéry barev či hotová barevná složení.

Jedním z pomocníků může být přímo webová galerie barevných kompozic, kterou najdete například na adrese http://graphicdesign.about.com/library/color/blweb3.htm či na adrese http://www.colorschemer.com/, kde máte k dispozici i onen „mixér“.

Dalším z pomocníků jsou barevné mixéry, které určitě znáte v některých z jejich podob. Jsou to vlastně vzorky barev poskládaných vedle sebe. V praktickém životě jsou to například vzorky žaluzíí, nátěrových barev. Na podobném principu pracují i „virtuální“ vzorky, kde vedle sebe buďto skládáte sobě podobné či kontrastní barvy, nebo je jednoduše necháte vyrobit.

Jak bylo výše zmíněno, tuto utilitu najdete například na adrese http://www.colorschemer.com. Nutno podotknout, že není freeware.

A co vady zraku?

Myslím, že na toto téma již bylo napsáno mnoho věcí a bylo by zbytečné se tím zde zabývat, když jsou v dnešní době na internetu skvělé práce na toto téma. Jedním z nich je nepochybně článek Marka Prokopa na serveru interval.cz

Praktická rada:

› Pokud nevíte na jaké barvy šáhnout, určitě se buďto obraťte na onen mixer, nebo browsdejte po I-netu a hledejte barvy, které se vám líbí. Poté si pomocí jednoduchých utilit můžete zjistit HEX barvy, která vám padla do oka a v budoucnu ji použít. Nemluvím o kopírování všech barev z jednoho webu, nýbrž o využití „jedné z barev“.
› Pokud nemáte mnoho zkušeností, raději se nepouštějte do „pískových“ barev. Neopatrně vybrané barvy tohoto ladění lehce odradí.
› Naopak nic nezkazíte využitím všemožných odstínů modré barvy, u větších portálů pokud možno s nižší hodnotou saturace.
› V poslední době osobně využívám odstínů modré, oranžové, šedé a béžové. Ale to se velmi liší u každého vytvořeného díla.

Závěr:

Doufám že vám dnešní článek něco přinesl a příště se již můžete těšit na práci v počítači a plánování.

×Odeslání článku na tvůj Kindle

Zadej svůj Kindle e-mail a my ti pošleme článek na tvůj Kindle.
Musíš mít povolený příjem obsahu do svého Kindle z naší e-mailové adresy kindle@programujte.com.

E-mailová adresa (např. novak@kindle.com):

TIP: Pokud chceš dostávat naše články každé ráno do svého Kindle, koukni do sekce Články do Kindle.

4 názory  —  4 nové  
Hlasování bylo ukončeno    
0 hlasů
Google
Autor je (ex)grafik a zakladatel projektu DirectProject.eu

Nové články

Obrázek ke článku Síla týmů se na home office může vytrácet. Odborníci radí, jak z pracovních omezení vytěžit maximum

Síla týmů se na home office může vytrácet. Odborníci radí, jak z pracovních omezení vytěžit maximum

Za poslední rok se podoba práce zaměstnanců změnila k nepoznání. Především plošné zavedení home office, které mělo být zpočátku jen dočasným opatřením, je pro mnohé už více než rok každodenní realitou. Co ale dělat, když se při práci z domova ztrácí motivace, zaměstnanci přestávají komunikovat a dříve fungující tým se rozpadá na skupinu solitérů? Odborníci na personalistiku dali dohromady několik rad, jak udržet tým v chodu, i když pracovní podmínky nejsou ideální.

Reklama
Reklama
Obrázek ke článku Konference: Moderní informační systémy podporují automatizaci

Konference: Moderní informační systémy podporují automatizaci

Současná situace v šíření onemocnění Covid-19 klade na řadu firem nové nároky a mnohé z nich jsou nyní více než kdy jindy závislé na nejmodernějších informačních technologiích. Proto i v oblasti podnikových informačních systémů vidíme rostoucí důraz na automatizaci nebo na důslednou integraci. Také o těchto trendech se bude mluvit na konferenci Firemní informační systémy, která se koná 24.9.2020 v pražském Kongresovém centru Vavruška na Karlově náměstí.

Obrázek ke článku Nebezpečí ukrytá v USB: z nuly na škvarek za pět sekund

Nebezpečí ukrytá v USB: z nuly na škvarek za pět sekund

Za cenu šesti dolarů lze celkem bez obtíží koupit nový, líbivě vyhlížející flash disk. Přidaná hodnota, které se vám spolu s ním dostane, už tak moc líbivá není. To, co se před pár sekundami tvářilo jako externí disk, se po připojení k počítači změní v důmyslné elektrické křeslo, které vaše zařízení v onen příslovečný škvarek promění za pár sekund. Cílovou skupinou pro koupi takových zařízení by mohli být záškodníci, kteří by tímto způsobem osnovali pomstu třeba vůči záletnému partnerovi. 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032021 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý