Mājaslapas dizains: 7 principi, kas apmeklētājus pārvērš klientos

Pirms izvēlēties krāsas un fontus, jāatbild uz vienu jautājumu: kas apmeklētājam šajā lapā jāizdara? Jāpiesaka konsultācija, jāpiezvana, jāpasūta prece vai jāatstāj e-pasts? Ja atbildes nav, dizainers zīmē skaistu attēlu, nevis pārdošanas rīku.

Katrai lapai vajadzīgs viens galvenais aicinājums rīkoties. Pakalpojuma lapā tā var būt poga «Saņemt piedāvājumu», bloga rakstā saite uz saistīto pakalpojumu. Ja vienā ekrānā sacenšas piecas vienādi spilgtas pogas, apmeklētājs parasti neizvēlas nevienu.

Mūsu mājas lapu izstrādes procesā mērķi un galvenos aicinājumus definējam pirmajā konsultācijā, vēl pirms dizaina skicēm. Tas ietaupa korekciju kārtas, jo visi lēmumi par izkārtojumu izriet no mērķa.

Apmeklētājs lēmumu palikt vai aiziet pieņem ļoti ātri. Tāpēc lapas augšdaļai bez ritināšanas jāatbild uz trim jautājumiem: ar ko uzņēmums nodarbojas, kam tas ir domāts un kāds ir nākamais solis.

Biežākā kļūda ir vispārīgs sauklis, piemēram, «Kvalitāte, kurai var uzticēties». Tas der jebkuram uzņēmumam un tāpēc neko nepasaka. Konkrēts virsraksts, piemēram, «Jumtu remonts Vidzemē ar 5 gadu garantiju», uzreiz pasaka, kas, kur un kāpēc.

Vienkāršs tests: uz piecām sekundēm parādiet lapas augšdaļu cilvēkam, kurš jūsu uzņēmumu nepazīst, un pajautājiet, ko uzņēmums piedāvā. Ja atbilde ir neprecīza, problēma ir virsrakstā, nevis apmeklētājā.

Vizuālā hierarhija nozīmē, ka svarīgākais elements ir arī pamanāmākais. To panāk ar izmēru, kontrastu un novietojumu: virsraksts ir lielāks par apakšvirsrakstu, galvenā poga ir spilgtāka par sekundāro, un svarīgākā informācija atrodas augstāk.

Tukšā telpa nav izniekota vieta. Atstarpes starp blokiem parāda, kas pieder kopā un kur sākas jauna doma. Lapa, kurā viss ir saspiests, izskatās lētāka un ir grūtāk lasāma, pat ja saturs ir labs.

Cilvēki tīmeklī tekstu nelasa, bet pārskata. Tāpēc garus tekstus sadaliet īsās rindkopās, izmantojiet apakšvirsrakstus un sarakstus. Ja apmeklētājs, izlasot tikai virsrakstus, saprot piedāvājumu, struktūra ir izdevusies.

Daudzām Latvijas uzņēmumu lapām lielākā daļa apmeklējumu nāk no telefoniem, un Google lapas vērtē pēc to mobilās versijas. Tāpēc dizains jāveido vispirms mazajam ekrānam un tikai tad jāpaplašina datoram, nevis otrādi.

Mobilajā versijā pogām jābūt pietiekami lielām, lai tās varētu nospiest ar īkšķi, tālruņa numuram jābūt klikšķināmam, un formām jābūt īsām. Katrs papildu lauks formā samazina iesniegumu skaitu, tāpēc prasiet tikai to, kas tiešām vajadzīgs pirmajam kontaktam.

Pārbaudiet lapu uz īsta telefona, nevis tikai pārlūka logā. Mūsu projektu piemēros redzams, kā viens un tas pats saturs tiek pārkārtots mazam ekrānam, nezaudējot galveno aicinājumu.

Fonts un krāsas veido noskaņu, bet to pirmais uzdevums ir lasāmība. Pietiek ar diviem fontiem: vienu virsrakstiem un vienu pamattekstam. Vairāk fontu lapu padara nemierīgu un palēnina ielādi.

Tekstam jābūt pietiekami kontrastainam pret fonu. Pieejamības vadlīnijas WCAG parastam tekstam iesaka kontrasta attiecību vismaz 4,5:1. Gaiši pelēks teksts uz balta fona maketā izskatās eleganti, bet saulainā dienā telefonā to nevar izlasīt.

Krāsu paletē izvēlieties vienu akcenta krāsu un lietojiet to tikai darbībām: pogām un saitēm. Ja akcenta krāsa ir visur, tā vairs neko neizceļ.

Jauns apmeklētājs jūsu uzņēmumu nepazīst, tāpēc dizainam jāpalīdz atbildēt uz jautājumu «vai šiem cilvēkiem var uzticēties?». Visvairāk palīdz reāli pierādījumi: paveikto darbu piemēri, klientu atsauksmes ar vārdu un uzņēmumu, skaidri redzama kontaktinformācija un adrese.

Īstas fotogrāfijas gandrīz vienmēr strādā labāk par attēlu banku bildēm. Komandas, darba procesa vai objekta foto parāda, ka aiz lapas ir reāli cilvēki. Ja budžets ir ierobežots, labāk trīs labas pašu fotogrāfijas nekā divdesmit svešas.

Uzticības elementus novietojiet blakus lēmuma punktiem: atsauksmi pie cenas, garantiju pie pasūtījuma pogas, kontaktus lapas augšā un kājenē.

Lieli attēli, video fonā un smagas animācijas var padarīt lapu lēnu. Apmeklētājs dizainu novērtē tikai tad, ja to sagaida. Par to, kā izmērīt un uzlabot ielādi, lasiet rakstā par mājaslapas ātrumu.

Labs kompromiss ir izvēlēties vienu vizuāli spēcīgu elementu lapas augšā un pārējo veidot vieglu. Animācijām jāpalīdz saprast saturu, nevis jāaizkavē tā parādīšanās.

Dizaina kvalitāti var novērtēt arī bez dizainera izglītības. Atveriet savu lapu telefonā un izejiet cauri sarakstam šīs sadaļas beigās. Ja uz vairākiem punktiem atbilde ir «nē», lapa, visticamāk, zaudē pieprasījumus.

Ja lapa ir vairākus gadus veca un neatbilst lielākajai daļai punktu, bieži vienkāršāk ir veidot jaunu dizainu nekā labot veco. Aptuvenās izmaksas varat aprēķināt ar cenu kalkulatoru vai apskatīt rakstā par mājaslapas izveides cenām.

Veyro projektos dizainu pirms izstrādes vienmēr saskaņojam ar klientu, un visās paketēs ir iekļautas divas bezmaksas korekciju kārtas.