Navrhnite webovú stránku

Autor: Judy Howell
Dátum Stvorenia: 25 V Júli 2021
Dátum Aktualizácie: 1 V Júli 2024
Anonim
Navrhnite webovú stránku - Avíza
Navrhnite webovú stránku - Avíza

Obsah

Návrh skvelého webu sa môže javiť ako náročná úloha, ale ak budete mať na pamäti základné informácie, bude tento proces zaujímavý a zábavný. Je to viac než len dobrý vzhľad! Ukážeme vám základy a niekoľko všeobecných pokynov, ktoré vám pomôžu navrhnúť webové stránky, ktoré ľudia budú navštevovať znova a znova.

Na krok

Metóda 1 z 2: 3 základné pravidlá

  1. Pravidlo 1:Vypočujte si svojho klienta. Možno navrhujete „najväčší web na svete v histórii vesmíru i mimo neho“ s bohatou čiernou farbou, vycibreným písmom a jasnými umeleckými farbami pre web, ktorý kričí „preskúmaj ma teraz!“ Váš klient, bohužiaľ, chcel oranžovú lištu s jasne ružovými a oranžovými písmenami. Dostali ste výpoveď a vaša najlepšia webová stránka, na ktorú má klient práva, je niekde na ich záložnom disku, bez toho, aby ju už niekto videl.
    • Preštudujte si firemnú identitu svojho klienta. Požiadajte klienta, aby vám ukázal niekoľko webových stránok, ktoré má rád. Získate tým nielen predstavu o tom, čo sa im páči, ale aj niekoľko dizajnových nápadov, ktoré by vás možno nenapadli.
    • Ak ste si mysleli, že si robíme srandu z oranžového a ružového webu, zvážte tento skvelý a prepracovaný web:
  2. Pravidlo č. 2:Spoznajte svoje publikum a to, čo hľadá, a podľa toho prispôsobte svoj dizajn. Ľudia majú webové stránky preto, že chcú, aby ich ostatní ľudia videli. Môže to byť informatívne alebo komerčné, alebo zabaviť konkrétne cieľové publikum. Vašou prácou dizajnéra je vedieť, pre koho navrhujete, a udržať ich na stránke, keď tam pristanú.
    • Mohli by ste si myslieť: „Ak to vyzerá dobre, zostanú.“ Ale nemusí to tak byť nevyhnutne. Zoberme si napríklad nehnuteľnosť. Toto je stránka s čistým a zábavným dizajnom. Má veľa bieleho priestoru, ktorý dáva otvorený vzhľad, jasné farby a moderný širokouhlý formát s odkazmi na prominentnom mieste:
    • Teraz sa pozrite na tento prístup k predaju nehnuteľností v rovnakej oblasti: neprehľadný a veľmi rušný, nudné farby a pokrytý reklamou.
    • Hádajte, ktorý z nich funguje lepšie pre tých, ktorí hľadajú domov? Správne, ten kde domy! Keď ľudia hľadajú „domy na predaj v Santa Monice“, je im úplne jedno, ako stránka vyzerá. Nechce sa im čítať o realitnom agentovi alebo vidieť pekné fotografie mesta. Chcú vidieť domy.
  3. Pravidlo č. 3:Počúvaj sám seba. Rozumiete tomu, čo klient chce, a viete, čo váš trh hľadá. Teraz je konečne čas venovať pozornosť vám, návrhárovi!
    • Vytvorte si šablónu v grafickom softvéri podľa vášho výberu. Vytvorte prvky svojej stránky v rôznych vrstvách (aby ste mohli neskôr doladiť veci bez toho, aby ste zničili celú šablónu). Môžu to byť tieto prvky:
      • Hlavička. Toto je prvok, ktorý je rovnaký na každej stránke vášho webu. Hlavička pozostáva z názvu a loga stránky, ako aj z odkazov na ďalšie časti webovej stránky (napr. O mne, Kontakt atď.). Vizuálne a prakticky to všetko spojí. Osvedčeným postupom je prepojiť prvé tlačidlo na paneli s ponukami späť na domovskú stránku.
      • Poďme sa napríklad pozrieť na Apple:
      • Rovnako ako u väčšiny produktov Apple, aj ich domovská stránka má veľmi čistý a priamy dizajn. Všimnite si panel ponúk v hornej časti, s logickými témami pre každé tlačidlo a vyhľadávacím poľom - vždy je dobrý nápad, ak to váš web podporuje. Teraz sa pozrime na vstupnú stránku jedného z tlačidiel, iPadu, aby sme videli niekoľko prvkov:
      • Lišta ponuky sa mení iba stmavením tlačidla iPad.
      • Predmet cieľovej stránky je zobrazený veľkými čiernymi písmenami.
      • Zobrazí sa nové podmenu, aby ste sa o produkte dozvedeli viac. Ak kliknete na jedno z týchto tlačidiel, uvidíte, že každá stránka ponúka nový obsah v závislosti od témy, ale bude identická v rozložení aj dizajne.
      • Každá hlavná téma na paneli ponúk bude mať často rôzne podnadpisy, ktoré musíte vyplniť. Namiesto vytvorenia druhého panela s ponukami môžete použiť vyskakovacie ponuky, ako je tento príklad, od aplikácie Musicians Friend:
      • Bočný panel. Zobrazí sa na mnohých stránkach vášho webu, nie však nevyhnutne na všetkých - určuje to kontext. Je to však veľmi dôležitý prvok a musí byť starostlivo navrhnutý tak, aby bol intuitívny a nebol príliš preplnený. Na rozdiel od panela s ponukami môže byť obsah bočného panela veľmi dynamický. Pozrite sa na tieto dva bočné panely od obchodníka s nehnuteľnosťami Trulia Prvý je pre kupujúcich:

Metóda 2 z 2: Pokyny

  1. Navrhnite dobré používateľské rozhranie. Umiestnite rôzne prvky webovej stránky, ako napríklad nadpis, bočné pruhy, logá, obrázky a text, na rovnaké miesto na každej stránke, aby bola vaša stránka prehľadná a intuitívna.
    • Rovnakú hlavičku udržujte v hornej časti každej stránky. Bez ohľadu na to, či obsah vášho webu umožňuje veľa opakujúcich sa prvkov, uistite sa, že horný okraj každej stránky je rovnaký.
    • Pri návrhu používajte logiku. Prvky na jednej stránke by mali byť logicky zoradené podľa dôležitosti alebo témy; rôzne stránky na webe by tiež mali byť.
  2. Vytvorte konzistentný štýl. Tam, kde by rozloženie malo dať vašej stránke štrukturálnu konzistenciu, štýl by mal poskytovať tematický súlad.
    • Držte sa dvoch alebo troch hlavných farieb a uistite sa, že spolu ladia.
    • Nepoužívajte príliš veľa štýlov alebo veľkostí písma; ak ich chcete vystriedať, použite ich na každej stránke rovnako.
    • Pomocou kaskádových štýlov (CSS) môžete udržiavať jednotný štýl a uľahčovať zmeny prvkov na celej webovej stránke bez toho, aby ste museli prejsť na každú stránku zvlášť.
  3. Maximalizujte čitateľnosť. Ak chcete, aby bol váš text lepšie čitateľný, môžete ho rozdeliť na menšie časti.
    • Na oddelenie jednotlivých častí používajte titulky a správne medzery.
    • Na zvýraznenie hierarchie a dôležitosti tém použite tučné písmená alebo rôzne veľkosti.
    • Venujte pozornosť tomu, ako zaobchádzate s textom. Nerobte písmo príliš malým a zväčšite riadkovanie, aby sa ľahšie čítali veľké kúsky textu. Veľké časti textu sa čítajú ťažšie; rozdeliť na menšie odseky.
  4. Urobte svoj web univerzálnym čitateľným. Používajte štandardné HTML a nepoužívajte značky, funkcie a doplnky, ktoré sú k dispozícii iba pre jednu značku alebo verziu prehliadača.
    • Zatiaľ čo väčšina moderných prehľadávačov a počítačov dokáže pracovať so zložitými obrázkami, pri zmenšení a optimalizácii obrázkov pre web bude všetko vyzerať úhľadnejšie. Porovnajte dôležitosť kvality s dôležitosťou rýchlosti.
  5. Vyskúšajte svoj web. Uistite sa, že každý odkaz funguje ako by ste čakali, a obrázky sa zobrazujú správne.
    • Možno budete chcieť zorganizovať niektoré používateľské testy tak, že členovia vašej cieľovej skupiny otestujú jasnosť a jednoduchosť použitia vášho dizajnu a poskytnú spätnú väzbu o vašom webe.
  6. Zverejnite svoj web. Kúpte si názov domény, ak ste tak ešte neurobili. Pravidelne kontrolujte, či odkazy stále fungujú, a vypočujte si návrhy, ktoré vám návštevníci pošlú e-mailom.

Tipy

  • Aj keď máte možnosť navrhnúť usporiadanie na základe svojej osobnej vízie alebo vecí, ktoré ste videli na iných stránkach, môže byť jednoduchšie kúpiť si hotový dizajn.
  • Nebombardujte návštevníka roztomilými, špeciálnymi obrázkami. Flash animácie, jasné farby, vzorkované pozadia a hudba, ktorá sa automaticky prehráva pri načítaní stránky, boli v 90. rokoch zábavnými experimentmi, teraz však používateľov odplašia. Držte sa jednoduchého pozadia, ktoré kontrastuje s farbou textu, aby bola maximálna čitateľnosť.
  • Na optimalizáciu medzery medzi odsekmi môžete kedykoľvek použiť CSS.
  • Pre návštevníkov so sluchovým alebo zrakovým postihnutím môžete titulkovať videá, prepisovať zvuky a pridať správu o prístupe. Aj keď tabuľky môžu byť efektívnym spôsobom na usporiadanie informácií, zrakovo postihnutí návštevníci používajúci softvér na čítanie obrazovky nemusia počuť materiál v správnom poradí.
  • Umožnite svojim návštevníkom ušetriť atrament: na tlač stránok použite samostatnú šablónu štýlov.
    • Pri nastavovaní parametrov tlače vypnite obrázky na pozadí.
    • Použite čierny text na bielom pozadí.
    • Odstráňte panel s ponukami a nepotrebné obrázky.

Varovania

  • Vyhýbajte sa plagiátorstvu a dodržujte všetky zákony o autorských právach. Nezahŕňajte náhodné obrázky, ktoré nájdete online, alebo dokonca konštrukčné prvky bez schválenia. Všetko, čo na svojom webe používate, musí byť zákonné aj etické.