Koduleht – 10 disaini, mida teha ja mida mitte

Igal aastal otsivad disainerid uut, ainulaadset ja uuenduslikku. Ja igal aastal pole nad pettunud. Veebilehe kujundus, eriti kodulehtede puhul, peegeldab jätkuvalt tarbijate nõudmiste muutumist ja seda, mida uuem tehnoloogia võimaldab.

Viimastest loomingulistest uuendustest on lihtne vaimustusse sattuda ja uutesse tehnikatesse sukelduda, kuid rääkida on ka hoiatavat lugu. Disain peab vastama nende külastajate emotsionaalsetele vajadustele ja kaasamisstandarditele, kellest võivad saada kliendid/järgijad.

Astuge samm tagasi

Kogu kodulehe kujundus on sisuliselt müügikõne. Kas soovite, et külastaja siseneks müügilehtrisse teatud tüüpi konversiooniga; kas soovite, et külastaja tunneks piisavalt aukartust, et teisi lehti vaadata; või kas soovite, et külastaja oleks emotsionaalselt seotud (nt heategevuslik eesmärk), peate mõtlema kliendile, mitte oma disainieelistustele või sellele, mis oleks teie arvates "lahe". Sellistest asjadest on lihtne vaimustusse sattuda. parallaksi ja kerimisena, kuid olge valmis end tagasi tõmbama ja kaaluma, kellele te disainite. Kuigi uus silmailu on põnev, peab see sobima brändi ja publikuga, seega astuge ettevaatlikult. Siin on mõned olulised, mida teha ja mida mitte jääb alati domineerima, olenemata sellest, millised uued disaini „trendid" võivad ilmneda.

1 Looge kaubamärgi ja selle klientidega intiimne suhe

Olenemata sellest, kas tegemist on mänguasjafirma, luksusjuveliiri või heategevusliku veebisaidiga, on igal organisatsioonil bränd ja kaubamärgi kuvand, mida kujutada. See nõuab palju uuringuid ja uuringuid, mitte ainult seda, mida tegevjuht või turukorraldusjuht võib öelda. Kuidas on ettevõtet sotsiaalmeedias ja selle praegusel veebisaidil kujutatud? Mis on “kultuur” ettevõttes endas? Kus asub ettevõte oma valdkonnas? KIA ei ole Cadillac ja vastupidi. Traditsiooniline pank ei ole uus ja innovaatiline laenuandja. Igal organisatsioonil on isiksus ja iga koduleht peab vastama sellele isiksusele.

Tundke kliente – pange kokku profiil:

Samuti on igal kaubamärgil kliente või potentsiaalseid sihtmärke. Kui sisuturundajad kavandavad oma strateegiaid, loovad nad hoolikalt sisu, mis nende klientidele meeldib. Nad arendavad kliendi isikupära, mis on väga üksikasjalik. Kui kavandate organisatsiooni, võtke ühendust ühise turukorraldusega ja leidke see kliendi isiksus. Kui seda pole välja töötatud, peate enne projekteerimise alustamist välja selgitama selle tüüpiliste klientide ja/või sihtturu demograafilised andmed. Teie disain peab meeldima sellele kliendile, mitte teile ega kellelegi ettevõttes.

See, mis meeldib ettevõtte omanikule, ei pruugi meeldida tema klientidele. Mõnikord on ettevõtete omanikke selles raske veenda. 1971 aastal kujundas Carolyn Davidson ning kunsti- ja disainitudeng Nike swooshi. Phil Knight polnud sellest vaimustuses, kuid nõustus seda proovima. Hea, et ta läks kaasa disaineri ja mitte enda esialgsete mõtetega. Peate siin võib-olla olema pisut enesekindel ja selles väites diplomaatiline. Kui te ei jõua kokkuleppele, soovitage kahe kujunduse A/B testimist. Tõestuseks on nende arv, kes jäävad kauemaks ja kes mingil moel pöörduvad.

2 Uurige visuaalse sisu psühholoogiat ja kasutage seda kujundamisel

Turunduse psühholoogia on alati olnud seotud kasutatud tekstiga – tekitada kiireloomulisuse tunnet, apelleerida kuulumissoovile jne. On olemas ka visuaalse sisu psühholoogia ja neuroteadus annab meile selle kohta igal aastal rohkem teavet. Osa sellest on disainikoolis muidugi käsitletud, osa aga mitte. Disaini psühholoogia on seotud teie kasutatava tekstiga, aga ka neuropsühholoogia põhimõtetega, mis on põimitud teie loodud visuaalidesse.

• Vistseraalsed reaktsioonid: Meil ​​kõigil on selliseid kogemusi olnud. Vaatame avalehte ja armastame seda (või vihkame). Me ei saa täpselt öelda, miks, kuid meie alateadvus reageerib mõnele visuaali poolt aktiveeritud käivitajale. Psühholoogia ütleb meile, et seda tüüpi reaktsioone aktiveerivad tavaliselt põhisoovid ja vajadused – turvalisus, oht, mugavus, armastus, ellujäämine jne. Näiteks pastoraalse või rahuliku veekeskkonna kasutamine tekitab meeldiva tunde, kuid avab ja elegantne disain tekitab tegelikult turvatunnet – midagi, mida me ei pruugi arugi saada.

• Silmade liikumine: Kui te pole neurolingvistika programmeerimise kohta lugenud, peaksite seda tegema. See neuroteaduse haru on konkreetselt seotud silmade liikumisega lehel. Mõned neist uuringutest on andnud tulemuseks "kolmandate reeglite". Olete palju ruudustiku kujundust lugenud, harjutanud ja kasutanud. Kolmandiku reegel aga puudutab seda, kuhu silm esimest korda lehele sattudes liigub – seal on 4 täppi, mis moodustuvad tic-tac-toe lehejaotuse ristumiskohtadest. Heitke pilk sellele lehele:

  Lehe kõige olulisem element on paigutatud ühte neist neljast ristumiskohast. Alumised ristmikud on voldi all, mis võib olla vastuolus traditsiooniliste disainireeglitega, kuid neuroteadlased ei nõustu sellega. Kui soovite rohkem teavet näha, võite kasutada karusselli ja panna see kahe ülemise ristmiku piirkonda. See on väga levinud meetod ja seda kasutatakse tänapäeval laialdaselt.

• Meeleolu ja toon/värv: kujundus peab sobima kõigega, mis puudutab pakutava toote või teenuse meeleolu ja tooni. Enamik disainereid muidugi teab seda, kuid värvipsühholoogia mängib selle meeleolu, tooni ja emotsioonide loomisel suurt rolli:

3 Eksperimenteerige mustritega; Ärge pingutage mustritega üle

Kasutada saab kolme tüüpi mustreid, kuid jällegi, mustri valimisel olge ettevaatlik – see peab vastama organisatsiooni missioonile ja sellega ei tohi üle pingutada. Õnneks on mustrite jaoks nii palju ressursse ja rakendusi, leiab sobiva. Siin on mõned mustrite näited, mis räägivad ettevõtte eesmärgist ja isiksusest.

• Generatiivne muster: need on korduvad mustrid – geomeetrilised kujundused, osakesed jne. Mõned neist võivad olla üsna peened; muu võib olla julge ja mõjuv. Siin on igaühe näited:

  See muster on peen ja pehme – prantsuse muusika kompositsiooni saidile.

  See muster on mõeldud Itaalia kaasaegsele mööblifirmale. Selle liikuva mustri taustal lendavad lehe sisse ja üle mööbli kujutised.
  Mõlemad mustrid aitavad tõsta organisatsiooni identiteeti ja meelitada selle klientide/jälgijate baasi.

• Andmemustrid: paljud ettevõtted müüvad abstraktsemaid teenuseid, mitte konkreetseid tooteid. Kasutatavad taustamustrid peaksid seda kajastama. Need mustrid võivad olla inspireeritud matemaatikast või kõrgtehnoloogiast ning need võivad anda tunde, et need on maised. Siin on näide väga peenest ja minimalistlikust Optimizely andmemustrist:

• Parallaks: Paljud disainerid katsetavad parallaksiga ja selle mõju võib olla üsna vapustav. Kuigi te ilmselgelt liikumist ei näe, on siin veebisait, mis teeb seda suurepäraselt.

  Maaemo on kõrgetasemeline Norra restoran. Pilved liiguvad üle taeva, samas kui nimi jääb paigale. Parallaks võib olla hämmastav, kuid ainult siis, kui seda tehakse õigesti. Ülejäänud visuaal ja tekst ei saa olla liiga hõivatud või kogu efekt kaob ja külastaja jääb segadusse ja pommitatakse.

• Animatsioonimustrid: liikuvad osad võivad olla suureks atraktsiooniks ja on olemas uuem tehnoloogia, mis muudab need üsna lõbusaks ja mõjuvaks. Lisaks on see, et disainerid saavad nüüd animatsioone lisada, tekitanud mõnes asjas veidi üle piiri. Jällegi võtke enne animatsiooni lisamist arvesse vaatajaskonda ja ettevõtte isikupära. Siin on näide Suurbritannia veebidisaini ettevõttest Manchester Masters Fieldwork, mis näitab, millist tüüpi animatsioone nad suudavad toota. Te ei saa kogeda kogu silmuse ja liikumise animatsiooni. See on muidugi liialdus ja sobiks lastele mõeldud tooteid müüvale saidile.

• Võrgumustrid: Taustaobjektide sümmeetrilise mustriga paigutamiseks saab kasutada traditsioonilist ruudustiku kujundust. Mõelge sellele kellade müüja Aark Collective'i taustaruudustikule – ideaalne.

• Verejooks: see on suhteliselt uus, kuid väärt disainielement, mis sobib teatud tüüpi ettevõtetele. Sisuliselt algab muster sisulehel ja seejärel muutub ühevärviliseks taustaks. Siin on see, kuidas Web Designer Depot kasutas seda oma saidi jaoks.

4 Otsige nuppude kujundamiseks ainulaadset viisi

Traditsiooniliste navigeerimisnuppude kasutamine võib olla veidi igav. Need ei pea olema, kui neid saab otse avalehe kujundusse lisada. Siin on paar võimalust, kuidas disainerid on lehele ja selle nuppudele nalja teinud.

Vaata Small Stone'i kodulehele – seal müüakse videoid ja muusikat. Menüü on kujundatud vanaaegseks heliplaadiks ja nupud on navigeerimisnupud – päris unikaalsed.

Custom Tshirts on Briti ettevõte, mis võimaldab klientidel ise oma T-särke kujundada. Navigeerimisnupud on paigutatud t-särgile koos muude menüüelementidega allpool.

5 Katsetage menüüdega

Nii nagu nupud, võivad ka menüüd olla üsna igavad. Lisaks võivad need muidu kena disaini halvendada. Menüü peitmine on nüüdseks külastajatele üsna arusaadav, kui see on üleval vasakus või paremas nurgas koos kolme baari hamburgeri elemendiga. See puhastab saidi. Sellel on mõned puudused, seega uurige ja vaadake, kas see on organisatsiooni jaoks õige.

Teised disainerid on katsetanud kogu avalehe menüüks muutmist järgmiselt:

6 Muutke vormid meeldivaks või lõbusaks:

Vorm ei ole tavaliselt saidi avalehel, kuid mõne ettevõtte jaoks see toimib, kui kujundus on meeldiv või külastajale veidi lõbus. Kui vorm vastab teemale, saate sellest ehk pääseda. Siin on kaks näidet otse avalehel asuvatest vormidest.

See võib olla hea idee reisiveebi jaoks.

Siin on Ühendkuningriigi disaini- ja kaubamärgiagentuuri näidis.

7 Kas lisage avalehele uusi asju sageli; Ärge laske sellel vananeda

Inimestele meeldib mitmekesisus ja on meeldiv, kui nad naasevad veebisaidile, et näha uusi pilte ja teksti. Logo, teema, värvide ja navigeerimiselementide samaks jätmine annab neile teada, et nad on õigel saidil, kuid uusi asju on hea teha.

Portuondo on kodukujunduse veebisait, mis pakub oma kodulehel regulaarselt uut pilti ning see võib hoida külastajaid ja kliente naasma, et näha, millist uut disainiideed tutvustatakse.

8 Ärge pingutage tekstiga üle

Loomulikult peab teil olema tekst. Külastaja peab teadma, kuhu ta on maandunud, ja see on iga teksti esimene ülesanne. Peale selle olla aga minimaalne. Mõnel kõige silmatorkavamatel kodulehtedel pole peaaegu üldse teksti ja see võimaldab külastajatel kujundust näha ja seda hetkeks nautida, enne kui nad navigeerima hakkavad. Ja muidugi on ütlematagi selge, et väljamõeldud skript on mõeldud ainult suurte rubriikide jaoks ja ainult siis, kui see on kooskõlas ettevõtte meeleolu ja tooniga.

9 Proovige ühelehelist veebisaidi kujundust

Kõik on avalehel ja külastaja lihtsalt kerib. Neid saite tuleb laadida ainult üks kord ja ülaossa saate panna nupud, mis suunavad külastaja konkreetse teabe saamiseks lehele. Need on eriti populaarsed teie ja teiste artistide seas.

10 Ärge kasutage esilehe karusselle

Tõenäoliselt pole tore lõpetada negatiivsega, kuid nii populaarsed kui need ka poleks, on nendega palju probleeme. Need võivad lisada visuaalset huvi ja kindlasti vähendavad nad avalehe segadust, kuid neil on kindlaid puudusi. Need on SEO jaoks halvad, võivad tekitada jõudlusprobleeme (laadimisaeg, pildi eraldusvõime jne) ja võib-olla tuleb lehe alla paigutada muu oluline sisu.

Järeldus

Kindlasti on veebidisaini jaoks palju muid asju, mida teha ja mida mitte. Tõenäoliselt on teil juba oma lemmikloomad ja lemmikloomapiinad. Tõesti on ainult üks võti. Veebisaidi kujundamise mõte on ühendada teid, disainerit ja kunstnikku, organisatsiooni ja selle tarbijatega. Ja kõige olulisem neist kolmest on alati tarbija. Kui mäletate kujundada seda sihtrühma silmas pidades, saavutate suurepärase kodulehe kujunduse missiooni.