„ Vďaka dobrému dizajnu je používateľ spokojný, výrobca v čiernej farbe a estetický vzhľad neoficiálny. '
- Raymond Loewy
Návrh webových stránok
Internetové prehliadanie a surfovanie sa dnes stali neoddeliteľnou súčasťou nášho života. Každý deň by sme prehľadávali „n“ počet webových stránok, kde by sme mohli nakupovať, vyhľadávať, skúmať a nakupovať služby alebo iba spoločnosti Google. Zastavíme sa iba na niekoľkých webových stránkach alebo ich chceme opakovane navštíviť.
Zdá sa, že iné nie sú príliš príťažlivé. Hlavným dôvodom pre viacnásobné navštevovanie konkrétnej webovej stránky je jej usporiadanie. Aj keď je to tvrdá rovnováha, dosiahnutie dobre navrhnutej a racionalizovanej funkčnej webovej stránky stojí za úsilie o zlepšenie zážitku zákazníka.
Teraz je dokázané, že položka, ktorá ovplyvňuje predpokladanú dôveryhodnosť webovej stránky, je jej dizajn a nie vložený obsah. Dokonale navrhnutá webová stránka nemusí vynaložiť veľa úsilia v iných aspektoch, aby udržala návštevníka na svojej webovej stránke. Dizajn UX a UI v tandeme tvorí celé rozloženie a funkčnosť webovej stránky.
Majster navrhovania perfektného rozloženia dizajnu webových stránok je McDonald's. Doslovne položili všetko na správne miesto, dokonca aj ako umiestniť uhorky. Takže by ste tiež chceli prísť s niečím tak dobrým alebo dokonca lepším ako McDonald's.
Top 10 krokov rozloženia dizajnu webových stránok
Dnes sa dozvieme viac o 10 najdôležitejších krokoch návrhu webových stránok. Rozloženie je uvedené nižšie:
- Majte profesionálne navrhnuté logo správne prepojené s domovskou stránkou
- Používajte intuitívnu navigáciu
- Vyhnite sa neporiadku a dávajte návštevníkom dýchací priestor
- Používajte farby a obrázky strategicky pre responzívny web
- Vyberte písma reagujúce na web, ktoré sa dajú ľahko prečítať na rôznych zariadeniach a prehliadačoch.
- Každá stránka by mala byť navrhnutá ako vstupná stránka
- Vždy vytvorte responzívny dizajn, prispôsobiteľný všetkým zariadeniam
- Použite HTML5 namiesto Flash
- Tlačidlá Odoslať alebo Odoslať by mali byť lákavé
- Nezabudnite vyskúšať svoj dizajn
„Život je konverzačný. Usporiadanie dizajnu webových stránok by malo byť rovnaké. Na webe hovoríte s niekým, s kým ste sa pravdepodobne nestretli, takže je dôležité, aby bol jasný a presný. Dobre štruktúrovaná navigácia v dizajne webových stránok a organizácia obsahu teda ide ruka v ruke s dobrým rozhovorom. ““
- CHIKEZIE EJIASI
(Tweet zo služby Twitter)
-
Majte profesionálne navrhnuté logo správne prepojené s domovskou stránkou
Prvá vec, ktorú spoločnosť na návrh webových stránok zistila, je jej logo. Webová stránka s profesionálne navrhnutým logom oslovuje svojich zákazníkov viac ako honosné logo. Logo tvorí identitu značky pre firmu alebo webovú stránku.
Vždy by ste mali urobiť z loga logo na návrh webových stránok s vysokým rozlíšením. Obrázky dizajnu webových stránok by mali byť vždy umiestnené v ľavom hornom rohu na každej stránke webovej stránky. Nezabudnite tiež na staré dobré pravidlo prepojenia všetkých log na webe s vašou domovskou stránkou, aby ste zákazníkom uľahčili návštevu navigácie v dizajne webových stránok.
-
Navigácia v dizajne webových stránok
Premýšľali ste niekedy, prečo sa odrazíte od toľkých webových stránok a vydrží iba na jednej alebo dvoch? Je to z toho dôvodu, že zákazníci sa nemusia trápiť vymýšľaním zložitých webových stránok. Namiesto toho opustia stránku a prejdú na ďalšiu.
To je hlavný dôvod, prečo je intuitívna navigácia taká dôležitá. Primárne možnosti navigácie v dizajne webových stránok by sa mali zvyčajne umiestňovať na vodorovnú lištu ponuky v hornej časti so sekundárnymi lištami navigácie pod ňou alebo pod ľavým okrajom na stránke.
Venujte pozornosť aj umiestneniu odkazov iba na potrebné miesta, ktoré neodvádzajú zákazníkov od vašej výzvy k akcii alebo najdôležitejšej informácie.
-
Vyhnite sa neporiadku a dajte zákazníkom priestor na dýchanie
Príliš veľa použitia grafiky alebo preťaženie obrázkov na stránke má sklon vytvárať neporiadok. Dizajn webových stránok je dôležitým médiom porozumenia, ale vizuálne preťaženie obrázkov zastavuje spracovanie informácií v mozgu.
Zákazníci sú zmätení, keď sú konfrontovaní s príliš veľkým množstvom rozloženia dizajnu webových stránok. Ak chcete minimalizovať neporiadok na vstupných stránkach, obmedzte počet odkazov a možností v hlavičke a päte. Ďalším spôsobom, ako zefektívniť stránky, je udržiavanie krátkych odsekov.
skratka znamená nie viac ako päť až šesť riadkov, pretože zákazníci majú tendenciu strácať záujem o veľmi zdĺhavý text. Existuje aj iné pravidlo dobrého usporiadania dizajnu webových stránok, tj poskytnúť zákazníkom priestor na dýchanie.
Tento priestor je možné vytvoriť tak, že medzi odsekmi a obrázkami dizajnu webových stránok zostane dostatok priestoru, aby divák vdýchol a absorboval viac funkcií a ponúk vašich stránok. Keďže sa responzívny web stáva každým dňom konkurencieschopnejším, dnes sa za menej považuje viac.
Kontrolované využívanie bieleho priestoru v rámci rozloženia udržiava zameranie používateľov na obsah a zvyšuje dojem používateľa. Kontrolovaný tok používateľov zvýši výnosy z webovej stránky.
-
Používajte farby a obrázky strategicky pre responzívny web
Ak chcete predstaviť modernú, elegantnú a elegantnú webovú stránku, skúste použiť prevažne neutrálnu farebnú paletu. Vďaka silnejúcej konkurencii vám zamestnanie malých farebných pruhov pre titulky a kľúčové grafiky pomôže vašim návštevníkom udržať sa na vašej webovej stránke a venovať pozornosť najdôležitejším detailom. Vždy používajte paletu farieb, ktorá dopĺňa vaše logo a mala by byť v súlade s ostatnými marketingovými zárukami.
Pokúste sa investovať do fotografie alebo nákupu profesionálnych sériových obrázkov, pretože návštevníci na webovej stránke vyčnievajú generické obrázky v mihnutia oka. Obrázky dizajnu webových stránok zanechajú všeobecný dojem z vašej spoločnosti.
Profesionálne obrázky alebo dobrá fotografia pritiahnu pozornosť na obsah a okamžite vytvoria emocionálne spojenie. Stačí uviesť príklad - ak chcete upútať pozornosť svojho návštevníka na konkrétnu informáciu alebo výzvu na akciu, použite ľudskú tvár pozerajúcu sa týmto smerom alebo prstom, ktorý tam smeruje.
Je to len preto, že človek má tendenciu pozerať sa rovnakým smerom, kde sa pozerá iná osoba. Farby aj obrázky dizajnu webových stránok by sa mali vyberať tak, aby sa zmestili do celého responzívneho webu - mobil, tablety, laptop atď.
Odporúčané kurzy
- Program HTML a HTML5
- Školenie na certifikáciu softvéru
- Online kurz Drupal 7
- Programovacie kurzy Drupal 7
-
Vyberte Web Responsive Fonts
Ak bude web reagovať, mali by ste si vybrať písmo, ktoré je vhodné pre všetky prehliadače, či už ide o prenosný počítač, tablet alebo mobilný telefón.
Ak si vyberiete veľké písmo, je pravdepodobné, že sa na notebooku dobre prečítajú, ale na mobilnom telefóne sa nebude dobre vykresľovať a stráca tak svoj pocit a vzhľad. Vždy si vyberte písmo, ktoré je možné ľahko prečítať s veľkosťou najmenej 11pt.
Ak vyberiete webové písma, nepoužívajte viac ako 2 rodiny písiem, aby ste zaistili rýchle načítanie. Pre dizajn s pevnou šírkou použite písmo, ktoré umožňuje maximálne 15 až 20 slov v riadku a vo fluidnom dizajne, použite písmo, ktoré umožňuje 15 až 20 slov pri šírke 1 000 pixelov.
-
Každá stránka by mala byť navrhnutá ako vstupná stránka
Weboví návrhári zvyčajne navrhujú svoje webové stránky za predpokladu, že návštevník vstúpi cez domovskú stránku a potom prejde na vstupné stránky. Táto skutočnosť je však trochu iná. Väčšina návštevníkov pristane na inej stránke ako na domovskej stránke pre väčšinu lokalít.
Kľúčovou myšlienkou je teda uchovávať všetky hlavné informácie na všetkých vstupných stránkach a rozložení webových stránok takým spôsobom, aby návštevník nemusel vyhľadávať dôležité informácie.
-
Vždy vytvárať responzívny dizajn, prispôsobivý pre všetky zariadenia
Ak v tomto rušnom svete nemáte čas na správne stravovanie, musíte navrhnúť pre každé zariadenie iný web. Ušetrite čas a energiu vytvorením responzívnej stránky, ktorá sa prispôsobí veľkosti prehliadača podľa použitého zariadenia.
Responzívne stránky vo všeobecnosti udržujú pozornosť návštevníka na dlhú dobu, čo zvyšuje pravdepodobnosť miery konverzie.
-
Použite HTML5 namiesto Flash
Flash sa teraz stáva zastaraným a blíži sa koniec prebiehajúceho sporu medzi spoločnosťami Apple a Adobe. Takže návrhári! Vyjdite z rozbehnutého vlaku a vyskúšajte viac možností pre web a pre používateľa.
HTML5 získava na popularite textom priateľským k vyhľadávacím nástrojom a ľahkou funkčnosťou v mobilných operačných systémoch bez potreby doplnku, na rozdiel od Flash.
-
Tlačidlá Odoslať alebo Odoslať by mali byť atraktívne
Tlačidlo „Odoslať“ alebo „Odoslať“ v dolnej časti webového formulára je najdôležitejšou výzvou na akciu na webovej stránke. Môže to však byť aj tá najškaredšia časť, takže dizajnéri musia vytvoriť tlačidlá na odoslanie formulára „takže sympatickí návštevníci si nemôžu pomôcť kliknutím na ne.
Jednoducho na to musia kliknúť. Tieto tlačidlá výzvy na akciu môžu byť zaujímavé mnohými spôsobmi, napríklad keď návštevník pohne myšou po tlačidle výzvy na akciu, malo by zmeniť farbu, sklon, opacitu alebo ošetrenie písma, aby upútalo vašu pozornosť za zlomok sekúnd.
Ale tiež sa postarajte o to, že preháňanie všetkého je zlé. Mal by sa zužovať, až kým to nevyzerá príťažlivo, inak to môže mať opačný účinok.
-
Nezabudnite vyskúšať svoj dizajn
Návrh dizajnu je iba hypotéza. Ste najlepší človek, ktorý sa rozhodne, čo na vašej webovej stránke vyzerá dobre. Optimalizácia webovej stránky vyskúšaním iného umiestnenia pre tlačidlá výzvy na akciu alebo použitím rôznych odtieňov farby môže mať na vašu webovú stránku veľký vplyv. Testovanie používateľov. Testovanie A / B a analytika vám môžu pomôcť improvizovať na vašej webovej stránke.
A skutočná improvizácia pochádza od ľudí. Vezmite ich spätnú väzbu a implementujte ich, kým nebude vyzerať dobre. Len aby som uviedol príklad toho, aké dôležité je testovanie vášho návrhu - spoločnosť Microsoft raz zarobila ďalších 80 miliónov dolárov iba testovaním a implementáciou špecifického odtieňa modrej. Takže nikdy neviete, kedy vám váš návrh môže priniesť obrovské zisky.
Tieto malé problémy sa môžu javiť tak nevýznamné a zrejmé, ale často sa vyskytujú na živej verzii webovej stránky. V čase, keď už podnik stratil malé percento potenciálneho príjmu zo svojich perspektív.
S niekoľkými platformami, ktoré sú dnes k dispozícii, nie je generovanie momentov „WOW“ z dizajnov UX a UI webových stránok nijakým problémom. Vyžaduje to iba málo úsilia a kreativity, aby všetci návštevníci povedali WOW po vstupe na vašu webovú stránku.
Takže dokonalý spôsob navrhovania webovej stránky je Think. Prehodnotiť. Učiť. Naučte sa znova. Nikdy nepoužívajte rovnaký koncept. Poznajte potreby svojich zákazníkov a potom… začnite s návrhom.
Zmena vášho dizajnérskeho postupu môže mať obrovský vplyv na mieru zapojenia a konverzie tým, že vytvorí intuitívne užívateľské prostredie, ktoré odhalí vašu profesionalitu a zároveň poskytne vizuálne pozoruhodným spôsobom to, čo ľudia chcú a potrebujú.
Súvisiace články: -
Toto bol návod na rozloženie webových stránok. Tu sme diskutovali o 10 najdôležitejších krokoch rozloženia dizajnu webových stránok. Môžete sa tiež pozrieť na nasledujúce články -
- 10 Efektívny spôsob pre používateľov programu Adobe InDesign
- 8 Užitočná príručka, ktorá sa má stať HTML5 verzus Flash
- 5 efektívnych spôsobov, ako zvýšiť ekologickú návštevnosť vašich webových stránok
- Ako vytvoriť čisté rozloženie webových stránok vo Photoshope
- Zoznam niekoľkých chýb na webových stránkach a ako ich ľahko opraviť
- 5 Nastavenie webových stránok Chyby, ktoré musíte poznať
- Čo uprednostniť Drupala alebo Joomlu
- Drupal 7 vs Drupal