Ahoj čitateľ! Vítam ťa a prajem ti príjemné čítanie, ktoré pevne verím, že ti oslní cestu v predieraní sa IT svetom za vedomosťami. V týchto častiach blogov o startupe webovej stránky ťa uvediem do princípov efektívneho vytvárania webových stránok, ktoré som sa naučil a ktoré využívam v praxi.
Najprv ti musím napísať kopec teórie, ktorá sa ti bude veľmi hodiť, ak si nováčik. S teóriou budeš viacej v obraze, čo sa robí a aký to ma význam. Tak oči ako orol, prípadne očisti okuliare a ideš na to! Odteraz budem tvoj ukecaný kamarát.
Veža Krásnohustá a ozruta šedotlstá
Kde bolo tam bolo, boli postavené veže. Prvá veža Krásnohustá mala pevný, úhľadný základ, na ktorom stáli hrubé múry natreté živými farbami. Vstup do veže bolo ľahké rozpoznať a vojsť do nej tým pádom bola hračka. Pred dverami neboli žiadne tŕnisté kríky a ani neokrôchaný zbrojnoši tam neboli. Z diaľky bolo vidno krásnu vlajku s erbom veže. Vlajka sa hrdo týčila na kužeľovitej streche. Vnútro veže bolo rovnako očarujúce ako vonkajší styling. Krásne upravené, rozumne poumiestňované a veľmi praktické zariadenie tejto našej krásnej veže zaujalo široké zástupy mešťanov, dedinčanov a potulných rytierov. Všetci ľudia boli veľmi vďační stavebníkom tejto veže, ktorí ju postavili strategicky a s náladou plnou elánu.
Už sa pýtaš čo to tu vlastne trepem?? To je v poriadku. Tento ešte nedokončený príbeh ma svoju pointu. Tá pointa je naša soľ, naše cesto. Je to náš chlieb, ktorý pečieme a predávame. Áno správne! Je to web! Teraz ti vysvetlím, čo som chcel príbehom povedať v IT a v dizajnérskej reči.
Pri tvorbe stránky a projektov súvisiacich s nejakým výstupom na aplikačnej vrstve (viď sieťarstvo vrstvy OSI), či už ide o aplikáciu, webovú stránku s redakčným systémom (CMS napríklad) a podobne. Je veľmi potrebné si spraviť analýzu. Ja veľmi rád používam analýzu *le:
- Zvolím si otázky
- Čo chcem robiť
- Akú tomu dám tvár
- Ktoré technológie použijem
- Koľko času ma to bude stáť
- Bezpečnosť
Toto je v rozprávke o veži Krásnohustej položené hneď na začiatku „mala pevný, úhľadný základ“. Základ je to podstatné. Väčšina projektov zlyhá práve kvôli zlej analýze. Analýza spočiatku predĺži robotu, ale neskôr ju výrazne urýchli a uľahčí čítanie projektu. Určite ju oceníš pri vlastnom projekte.
V ďalšej časti ti rozpíšem analýzu do detailov. Teš sa! Máš sa na čo… Teraz pokračujme v rozprávke, tak oči ako orol, vysvetlím ti pointy rozprávky.
Veta „stáli hrubé múry natreté živými farbami…“ *le:
Múr je postavený na základe stavby, teda? Blink? Analýza nám dodá potrebné informácie pri navrhovaní dizajnu, ktorý je akýmsi obalom nášho projektu.
Veta „vstup do veže bolo ľahké rozpoznať…“ *le:
Stránka s ľahko zapamätateľnou a navyše peknou a ak ešte ľahko z optimalizovateľnou adresou je čistý priestrel. Top kvalitná adresa stránky je jedinečný názov témy projektu. Stránka ďalej musí byť na kvalitnom serveri. Podrobnejšie ti to opíšem v ďalších častiach. Teraz znova pokračujme v rozprávke…
Veta „bolo vidno krásnu vlajku s erbom…“ *le:
Branding je pojem vytvárania identít a log pre firmy. Čiže akoby erbov. Krásne logo dokáže zaujať veľa ľudí. Reklama je kľúčová. Ilustrácie na stránkach sa pokladajú v dnešnej dobe za veľké plus. Samozrejme treba mať vlastné ilustrácie.
Veta „Krásne upravené, rozumne poumiestňované a veľmi praktické zariadenie…“ *le:
Využi technológie čo najefektívnejšie. Nie je kód ako kód. Ak máš krátky a účinný kód, je pre teba lepší, ako ťažký dlhý kód, ktorý rovnako funguje. Krásny a komplikovaný vzhľad na stránke je škodlivý. Ruší používateľa, tým sa nemôže sústrediť na to, čo potrebuje. Preto s okrášľujúcimi vecami na stránke si treba dávať pozor. Radšej sa zameraj, ako efektívne rozvrhneš obsah na stránke. A následne, ako do toho zakomponuješ vzhľad. V dnešných časoch prevláda minimalizmus. Ako rozvrhnúť obsah ti vysvetlím v ďalších častiach.
Veta „postavili strategicky a s náladou plnou elánu…“ *le:
Robte veci vždy s nadšením a motiváciou. Nikdy nerobte to, čo vás nebaví. Klesá tým šanca na úspech o 90%…
Pokračovanie príbehu
Na druhej strane doliny sa nachádzala veža šedotlstá. Obrovská veža na šikmých základoch plná nepriehľadných chodieb plných všelijakých zariadení. Natretá len jednou farbou. Mešťania sa jej báli a tak sa jej vyhýbali. Stráž bola veľmi zlá a dvere zakryté porastom, no niečo strašné, ľudia povedali.
Pohľadáš pointu? Nemusíš, je to presný opak našej krásnej veže Krásnohustej.
Prosím ťa, vyhýbaj sa takýmto veciam v projekte a rob veci krásne, účinné. Nájdi si správnu mierku. Dizajnérske inšpirácie hľadaj na uznávaných stránkach ako je napríklad www.awwwards.com.
Koncové slová v tejto časti:
Táto časť ťa usmerňuje k tomu, aby si dbal na štandardy pri budovaní projektov. Či už webových stránok alebo aplikácii. Presnejšie som rozobral, akým smerom sa máš vydať, keď ideš navrhovať dizajn, čiže akoby obal svojho projektu. Aké mechanizmy používať, už pri tvorbe kódu ti rozpoviem hneď v ďalšej budúcej časti.
Programy vhodné pre tvorbu dizajnu:
GIMP 2 – Je to freeware takže sa nebojte licenčných vecí. Tento program je veľmi podobný programu Adobe Photoshop, ale je menej kvalitný.
Adobe Photoshop a Ilustrator – tieto programy sú ideálne pri návrhoch. Sú to licenčné programy, ale už niektoré staré verzie sú voľne dostupné (napríklad Photoshop CS2).
Corel Draw – Vektorový program, odporúčam vyskúšať si ho. Je takisto licenčný.
Zdroje námetov a inšpirácií pre dizajn:
www.awwwards.com
www.be.net
www.logoweb.sk