Tipy pre rozloženie webovej stránky
Pri navrhovaní a zostavovaní webovej stránky je potrebné zvážiť veľa vecí. Dokonca aj najskúsenejší návrhári webových stránok robia chyby napriek ich dlhoročnému navrhovaniu chýb, preto nezvažujme, aké chyby môžu začiatočníci urobiť.
Nasledujúci krátky zoznam desiatich krokov rozloženia návrhu webovej stránky pokrýva všetky dôležité informácie, ktoré by ste mali vedieť skôr, ako začnete nový projekt webovej stránky alebo začnete pracovať s digitálnou agentúrou, a tiež pokrýva to, na čo by sa mali zamerať počas procesu rozloženia návrhu webovej stránky.,
Zahŕňajú základné aspekty rozloženia návrhu webovej stránky, ako je návrh vstupnej stránky, ako aj všeobecné problémy pracovného toku pre lepšie fungovanie webovej stránky. Ak budete postupovať podľa týchto krokov rozloženia návrhu webovej stránky, budete mať lepšiu pozíciu na vytvorenie profesionálneho rozloženia návrhu webovej stránky.
Kroky na vytvorenie perfektného rozloženia návrhu webovej stránky
-
Pero na papier
Nepoužívajte iba program Photoshop alebo softvér na navrhovanie webových stránok, ktorý máte pri spustení projektu. Toto je bežná chyba, ktorú aj skúsení dizajnéri robia skôr, ako sa zamyslia nad problémami, ktoré musia vyriešiť. To je správne; Usporiadanie dizajnu webovej stránky je o riešení problémov a nielen o peknom vzhľade a estetike. Tieto problémy možno vyriešiť iba pomocou dobrej, jasnej hierarchie a usporiadania. Než sa pozriete na farebné kódy a tiene, zamerajte sa na obsah, rozloženie a funkčnosť.
Keď musíte vytvoriť vzhľad a dojem z projektu, prvá vec, ktorú musíte urobiť, je vytvoriť špičkový rámec, ktorý dokáže vyriešiť všetky problémy s rozložením návrhu webovej stránky. Rámec je používateľské rozhranie, ktoré obklopuje obsah, a pomáha vykonávať akcie na webe a navigovať ho. Rámec obsahuje aj spodný a bočný panel a ďalšie komponenty, ako aj navigačné prvky. Netreba dodávať, že nemôžete nechať ujsť také dôležité bity. Začnite tento projekt webdizajnu s touto perspektívou a budete mať jasnú predstavu o rozložení a o tom, ako navrhnúť každú stránku.
-
Pridajte do aplikácie Photoshop mriežku a vyberte svoju typografiu
Teraz môžete spustiť Photoshop. Ale skôr, ako začnete s navrhovaním čohokoľvek, na začiatok musíte mať potrebnú mriežku. Bez ohľadu na to, aký dobrý je váš softvér na rozloženie dizajnu webových stránok, nepoužívanie mriežky skončí v zlom rozložení dizajnu webových stránok tak či onak. Mriežka pomáha usporiadať rozloženie stránky v rôznych častiach a vedie vás rôznymi požiadavkami na veľkosť obrazovky. A čo je dôležitejšie, pomáha vytvárať rozloženie responzívneho dizajnu webových stránok a vytvára konzistentný dizajn, pokiaľ ide o rozmiestnenie a ďalšie prvky.
Akonáhle je nastavená mriežka dizajnu webovej stránky, je čas prejsť na písmo a farby. Môže to chvíľu trvať, ale je to tiež vzrušujúca fáza projektu dizajnu webovej stránky. Vo všeobecnosti je najlepšie nepoužívať v rozložení webovej stránky viac ako dva písma. To sa však môže líšiť v závislosti od rôznych projektov dizajnu webových stránok; mohli by ste sa držať jedného, alebo sa divoko s niekoľkými typmi písma. Bez ohľadu na to, choďte na písmo, ktoré je ľahko čitateľné, aj keď existuje veľa textu na čítanie. Buďte kreatívnejší s výzvou na akcie a tituly a vyberte veľké písma. Udržujte tiež konzistentnosť na celej webovej stránke, pokiaľ ide o typografiu.
-
Farby a rozloženie
Vzory webových stránok sa môžu zblázniť, keď si vyberú farby pre web, ale je najlepšie použiť obmedzenú množinu tónov a farieb, pretože príliš veľa všetkého môže byť zlé. Mohli by ste sa pozerať na farby priamo vo fáze výberu typov písma. Preskúmajte, aké farby sa majú použiť v používateľskom rozhraní, texte a pozadí. Pre všeobecné používateľské rozhranie používajte obmedzené nastavené tóny a farby. Aplikujte farby konzistentne v celom používateľskom rozhraní na základe funkčnosti prvku. Stačí sa pozrieť na rozloženie populárnych webových stránok ako Vimeo, Quora a Facebook. Okrem používateľského rozhrania by nemali existovať žiadne farebné obmedzenia pre grafické detaily alebo ilustrácie, pokiaľ nezasahujú do iných komponentov alebo funkcií webovej stránky.
Pokiaľ ide o rozloženie dizajnu webových stránok, najlepším pravidlom, ktoré treba dodržať, je „jednoduchšie, lepšie“. Každá časť musí byť pre web nevyhnutná, s dôvodom a prínosom pre konečný výsledok návštevníka. Rozloženie musí byť schopné zvýrazniť najdôležitejší obsah a prvky. Minimalizujte počet volaní na stránke tak, aby celý web fungoval tak, aby poskytoval hodnotu pre návštevníka. Dobrým spôsobom, ako zabezpečiť čo najjednoduchšie usporiadanie, je začať s najzákladnejším možným usporiadaním a podľa potreby pridať iba prvky.
-
Mysli odlišne
V tejto chvíli by ste mali nejakú predstavu o prvkoch, ktoré sa považujú za dôležité pre webové stránky, ale nebojte sa prehodnotiť súčasné konvencie. Zamyslite sa nad prvkami, ktoré sa teraz považujú za dôležité. Potrebujete napríklad tlačidlo vyhľadávania? V niektorých prípadoch by to mohlo pomôcť, ale vo väčšine prípadov je zbytočné. Existujú konvencie rozloženia návrhu webovej stránky a vzory rozloženia návrhu webovej stránky, pretože v niektorých prípadoch fungujú. Nemusia však fungovať vo všetkých prípadoch a môžu byť zastarané. Prehodnotte stanovené vzorce na komponente a premýšľajte o tom, ako ich môžete vylepšiť.
Neobmedzujte svoje prehodnotenie na priemyselné štandardy ani konvencie. Musíte tiež prehodnotiť svoje zvyky a vzory rozloženia dizajnu webových stránok. Inovácia nie je vždy príčinou výziev mimo konvencií; môže to tiež vyplývať z náročných úloh pri každom projekte. Neobmedzujte sa len na jeden alebo niekoľko spôsobov práce. Príklady rôznych výziev môžu zahŕňať nový systém mriežky, nové komponenty alebo len vyhnúť sa určitým farbám a typom písma.
Odporúčané kurzy
- Profesionálne bezplatné školenie Python
- Kurz testovania slobodného softvéru
- Certifikačné školenie vo voľnej Java
- Kurzy PERL
-
Zamerajte sa na podrobnosti
Každý dizajnér webových stránok, ktorý stojí za svoju soľ, by zdôraznil tento bod az dobrého dôvodu. Ako sa hovorí, „Boh je v detailoch“. Najmenšie podrobnosti na webovej stránke alebo webovej stránke by mohli mať veľký vplyv na použiteľnosť pre používateľa.
Celé webové stránky môžu vylepšiť niečo také jednoduché, ako malá interakcia, estetický nádych alebo animácia. Tieto podrobnosti sú však nevyhnutné a budú sa objavovať prirodzene, keď získate viac skúseností. Zamerajte sa na excelentnosť v každej zložke a všetko sa spojí a vytvorí vynikajúci kompletný produkt. Každý komponent musí byť navrhnutý tak, aby mohol byť najlepším samostatným komponentom. Mnoho dizajnérov necháva časti svojich webových stránok na konci a málo sa o nich zaujímajú.
-
Udržujte veci ostré a upravené
Udržujte všetky obrázky a obsah na svojom webe ostré nastavením správneho kontrastu medzi farbami pozadia a ťahmi. Okrem čistého a ostrého webového sídla sa musíte vyhnúť aj iným častým veciam, ako je estetika. Niektoré z vecí, ktorým sa treba vyhnúť pri zaostrovaní vášho výstupu, sú rozmazané okraje, pruhovanie s gradientom, možnosti vykreslenia písma, ako aj ťahy, ktoré sa zle spájajú s pozadím.
Toto je len niekoľko príkladov z jednoduchého dizajnu webových stránok, na ktoré si treba dávať pozor. Neustále sledujte rozloženie návrhu svojej webovej stránky v plnom rozsahu a sledujte, či všetko spolu dobre funguje. Potom každú zložku analyzujte osobitne a dôkladnejšie.
Pri navrhovaní s aplikáciou Photoshop udržiavajte súbory PSD čisté, bez ohľadu na to, aký veľký je projekt a počet návrhárov, ktorí na projekte pracujú. Čistejšie súbory uľahčujú export rôznych oddielov a zrýchľujú proces rozloženia návrhu webovej stránky, ako aj prácu s ostatnými návrhármi pomocou zdieľaných súborov.
-
Pripravte sa na najhoršie a zostaňte zameraní
Dizajnéri webových stránok majú riešiť problémy pomocou rôznych obmedzení. Pokiaľ ide o návrhy webových stránok, obmedzenia môžu byť technické, súvisiace s obsahom alebo koncepčné. Keď začínate a pracujete na projekte, nemyslite len na ten ideálny scenár, ale aj na najhorší scenár. Užívateľ sa napríklad môže pokúšať o prístup na webovú stránku na štvorpalcovej obrazovke so systémom, ktorý je starší ako dve aktualizácie. Nezabudnite, ako bude rozloženie vašich webových stránok fungovať v rôznych veľkostiach obrazovky, zariadeniach a operačných systémoch.
Keď pristupujete k webovej stránke, musíte ju navrhnúť tak, aby najlepší scenár bol aj v najhoršom prípade. Ako dizajnér webovej stránky musíte tiež posadiť projekt. Každý dobrý dizajnér sa ponorí do každého projektu. Urob si svoj web súčasťou svojho života a skončíš tým, že ho uvidíš s väčšou jasnosťou. Potom môžete identifikovať nedostatky a problémy a prípadne ich zmeniť. Keď váš projekt dozrie, budete aj vy ako dizajnér webovej stránky. Na konci tohto projektu sa dozviete viac o projekte, ako keby ste boli od neho odpojení. Okrem toho bude konečný výstup oveľa lepší. Ak do každého projektu nalejete pot a krv, určite to ukáže všetkým.
-
Nadviazajte dobrý vzťah s klientom a vývojárom
Ak plánujete byť profesionálnym dizajnérom webových stránok, budete sa musieť stretnúť s mnohými klientmi a vývojármi webových stránok a vysporiadať sa s nimi. Začnime s klientmi, pretože klienti sú vždy na prvom mieste.
Keď navrhujete interaktívny dizajn alebo koncepciu webovej stránky, musíte udržiavať otvorenú komunikáciu so svojím klientom, aby ste sa obaja nachádzali na tej istej stránke. Nezostávajte dlho s konceptom; čo najskôr ju zdieľať s klientom. Po schválení počiatočnej koncepcie získate lepšiu predstavu o tom, čo chce váš klient, a zblížite sa bližšie k projektu. Ak koncept nie je schválený, môžete získať čo najviac spätnej väzby od klienta, aby ste dostali k stolu vhodnejšiu koncepciu. V žiadnom prípade nečakajte, kým neurobíte podrobný koncept.
Akonáhle je váš koncept hotový a pracujete na projekte, musíte s vývojárskym tímom vytvoriť dobrý vzťah. Vývojári nie sú iba programátori; sú tiež kreatívni a rovnako sa nadšujú svojej práci ako dizajnéri webových stránok. Často však nie sú súčasťou projektu od začiatku a vstupujú do projektu až vtedy, keď sa rozhodne o koncepte a ich tvorivé vstupy už nie sú potrebné. Tento proces je, žiaľ, nesprávny. Najlepšie nápady na rozloženie dizajnu webovej stránky niekedy pochádzajú z najmenej pravdepodobných zdrojov. Neznižujte kreativitu vývojového tímu. Na začiatku ich zapojte do konceptualizačného procesu a od začiatku ich zapojte do projektu. Podeľte sa o svoje koncepcie rozloženia návrhu webovej stránky so svojimi vývojármi a zapojte ich do lepších nápadov av konečnom dôsledku do lepšieho kódovania a vykonávania od ich konca.
-
Prezentácia je dôležitá a niektoré nápady nemusia byť
Aj keď je určite dôležité vytvoriť skvelú webovú stránku a vytvoriť skvelý projekt, je tiež dôležité prezentovať ju klientovi. Dokonca aj najlepšie rozloženie dizajnu webových stránok na svete možno ignorovať alebo úplne nenávidieť, ak nie sú prezentované dobre. Pamätajte, že koncepcie a nápady rozloženia dizajnu webovej stránky, ktoré sa používajú v projekte, môžu byť zrozumiteľné pre celý váš tím, ale nemusia byť zrozumiteľné vášmu klientovi alebo niekomu, kto sa stal súčasťou projektu v neskoršej fáze.
V prípade podobnej poznámky by ste si mali tiež zapamätať, aby ste sa príliš nepripravili ku všetkým svojim nápadom na návrh webovej stránky a konceptom rozloženia návrhu webovej stránky. Urobte silný argument pre každú z nich, ale nezabudnite ustúpiť, ak váš tím alebo klient s nimi nesúhlasí. Pamätajte, že preferencie môžu byť subjektívne; to, čo pre vás funguje dobre, nemusí pre klienta alebo vývojára vôbec fungovať. Ako dizajnér webovej stránky musíte mať pevný názor na svoje nápady, ale mali by ste byť dostatočne flexibilní, aby ste mohli rýchlo zmeniť koncepty a nápady, ak sa na nich ostatní nedohodnú.
-
Sledujte a sledujte pokrok v každej fáze a ukazujte komunite
Každý, kto pracuje v agentúre, by mal poznať boj o prácu na dizajne webovej stránky nového projektu, zatiaľ čo jeho predchádzajúci projekt sa vyvíja alebo práve končí. Na rozdiel od toho, čo si ľudia môžu myslieť, práca dizajnéra nekončí iba odoslaním súborov PSD a hárkov štýlov. Ak ste plne investovali do projektu, musíte sa tiež pozrieť na vývojárov, aby ste zistili, či sa vaše návrhy webových stránok a nápady na interakciu vykonávajú podľa plánu, a podľa potreby im pomôcť zaistiť, aby každý detail fungoval správne.,
Svoje rozpracované komponenty a šablóny štýlov môžete zdieľať aj s komunitou dizajnérov. Najlepšie časti projektu sa niekedy v archívnom priečinku vynechajú alebo stratia. Po dokončení projektu a jeho schválení klientom, ktorý sa má propagovať, by ste mohli vytvoriť prípadovú štúdiu s prebiehajúcou prácou a vynechanými návrhmi a komponentmi webových stránok. Môže to byť pre komunitu obrovským prínosom a zo spätnej väzby sa môžete veľa naučiť.
Súvisiace články: -
Toto je príručka, ktorá sa ľahko zapamätá do tipov na rozloženie dizajnu webových stránok. Tu v tomto príspevku sme sa zaoberali krokmi na vytvorenie dokonalého rozloženia návrhu webovej stránky. Tu je niekoľko článkov, ktoré vám pomôžu získať viac podrobností o rozložení webovej stránky, takže stačí prejsť na odkaz.
- Top 10 najlepších trendov v oblasti webdizajnu, ktoré musíte vedieť za rok 2016
- 10 nových funkcií efektívneho portfólia webdizajnéra
- Zoznam 10 najlepších bezplatných softvérov na navrhovanie webových stránok (Sprievodca)