Kodulehe (või kodulehe) kujundus on veebisaidi esimese lehe visuaalne ja struktuurne kujundus, mida külastajad näevad saidi esmakordsel külastamisel. Koduleht mängib saidist esmamulje loomisel võtmerolli ja aitab külastajatel leida vajalikku teavet või ressurssi edasi liikuda.
1. Shopify kodulehe kujundus
Nagu paljud teised selle postituse sihtlehed, on sihtlehe näidis Shopify teeb selle lihtsaks. Näiteks kasutajakeskne pealkiri koosneb vaid mõnest sõnast ja leht tugineb prooviversiooni üksikasjade ja eeliste edastamiseks lihtsatele täppidele, mitte lõikudele. Enne alustamist tuleb täita vaid mõned väljad. Kõik see muudab teie tööriista abil veebis müümise lihtsamaks.
2. Koonu kodulehe kujundus
Sihtlehed aitavad kasutajatel otsustada, kas teie toode või teenus on nende väärtuslikku aega ja energiat väärt. Mis oleks parem viis oma väärtuspakkumist selgelt ja otse edastada, kui sobitada külastajad probleemiga, mida teie rakendus lahendab?
Instagrami kommentaare saab rohkem
KoonMaci rakendus, mis vaigistab ekraanil kuvatavad märguanded, katab selle täielikult näita ütlemata nende minimaalsel sihtlehel. Selle lehe külastajaid tervitab kiire ebamugavate märguannete tuli ekraani vasakus ülanurgas. Animatsioon pole mitte ainult lõbus, vaid annab veenvalt edasi ka rakenduse kasulikkust ilma pikkade kirjeldusteta.
3. TransferWise'i kodulehe kujundus
TransferWise võimaldab teil saata ja vastu võtta raha mitmes valuutas ning selle allpool näidatud sihtleht jaotab iga üksiku toimingu, nii et teid ei segaks valikud, mis teile ei kehti.
Kui soovite raha saata, võite täita ülekandevormi. Raha saamiseks minge lihtsalt keskmisele vahelehele ja deebetkaardiga TransferWise'i kasutajaks registreerumiseks minge parempoolsele vahekaardile.
Iga selle sihtlehe vahekaart loob oma üleskutse tegevusele olenevalt sellest, milleks registreerute – igaühel on erkroheline raam, mis tõstab esile teie järgmise sammu pärast kolme võimalikku alguspunkti.
4. Airbnb kodulehe kujundus
Külastajate võõrustajateks muutmiseks Airbnb pakub ahvatlevat isikupärastamist: ligikaudne hinnang keskmisele sissetulekule, mis põhineb teie asukohal. Veelgi isikupärasema hinnangu saamiseks saate väljadele sisestada täiendavat teavet oma potentsiaalse paigutuse kohta.
Kui olete juba külastanud lehte, milles olete veendunud, muudab lehe ülaosas olev selge üleskutse tegevusele kohapeal teisendamise lihtsaks.
5.Teambit
omapärane ei ole tavaliselt esimene sõna, mis personalitarkvarale mõeldes meelde tuleb, kuid Teambiti visuaalne sihtleht on just selline. Lihtsa ühe väljaga vormiga kaasneb imearmas kontor, mis on täis loomategelasi – neid kõiki väga Teambitiga rahul, kui olete huvitatud. Sihtlehe iga teabejaotise kõrval kuvatakse koomiksiloom, mis meelitab külastajaid lisateabe saamiseks allapoole kerima. Kodulehe kujundus
Sihtleht Teambit on suurepärane tõend selle kohta, et naljaka sihtlehe loomiseks ei pea te omama "lõbusat" toodet või teenust.
6. Wistia kodulehe kujundus
Esiteks on see sihtleht Wistia nende tasuta Wistia konto jaoks. Kohe märkad ühe väljaga vormi konto loomiseks - minimaalse kujundusega sinine taust kontrasteerub kenasti säravvalge vormiväljaga.
Vormivälja pikkus koos silmapaistva paigutusega välistab konto loomisel peaaegu igasuguse hõõrdumise... aga kui kahtlete, saate KKK-de lugemiseks alati allpool kerida. Eraldades need kaks elavat värvikontrastiga, muudab Wistia teisendusprotsessi palju lihtsamaks.
7. Veebivoog. Kodulehe kujundus
Webflow, veebiarendajatele mõeldud disainitööriist, pakib palju teavet GIF-i ja kolme vormiväljale. Oleks tore, kui kogu registreerimisvorm oleks ühel real – see mitte ainult ei muuda lehte lühemaks, vaid iga välja vasakult paremale täitmine näitab kasutajatele, kui lähedal nad on neljanda sinise nupu klõpsamisele ja tasuta alustamisele.
Vormi all olev animeeritud GIF kuvatakse veebisaidil samas raamis, et kasutajad saaksid näha, kuidas toode töötab. и registreeruge ilma kerimata või uuele lehele minemata.
E-raamatu kodulehe kujundus
8. Nauto kodulehe kujundus
Nauto, isejuhtivate autode andmeplatvorm, aitab autoparke haldavatel ettevõtetel autonoomset sõitu ohutumaks muuta. Loomulikult vajavad tema kliendid sellel platvormil müümiseks kogu teavet. Nautol on see ülilihtne e-raamat, mille sihtleht annab teile lühikese kontaktivormi ja statistika eelvaate, et tõestada, miks see ressurss nii oluline on.
Roheline nupp "Laadi kohe alla" võis olla isegi meelega (roheline tähendab ju "mine").
Kerige alla ja näete teist CTA-d "Hangi e-raamat", mis tuletab kasutajatele meelde, mis on laos. Näete ka kolme jahmatavat autoõnnetuste statistikat, et julgustada kasutajaid rohkem õppima. Vaadake seda allpool.
9. Industrial Strong Marketing Kodulehe kujundus
See sihtleht tõmbab mind koheselt oma vastupandamatu ja terava pealkirjaga: „Ära tee mind suumi”. See räägib otseselt üldisest kogemusest, mida enamik meist oma telefone või tahvelarvuteid sirvides kogeb – ja see on ka pisut nipsakas.
Kuid see pole ainus asi, mis mind selle maandumislehe vastu huvitas. Pange tähele, kuidas punane värv on strateegiliselt paigutatud vormi üla- ja alaossa, viies teid konversioonisündmusele veelgi lähemale.
Samuti on see disain alglaaditav meta: see näeb välja ja töötab suurepäraselt mobiilseadmed. Pidage meeles, et paljud külastajad pääsevad teie sihtlehtedele juurde oma nutitelefonides või tahvelarvutites teie veebisaidi kujundus ei sobi, võivad nad alla anda ja teie lehelt lahkuda.
Industrial Strength Marketingi spetsialistid tegid välja fonte ja vormid on piisavalt suured, et külastajad ei peaks sisu lugemiseks ja sellega suhtlemiseks näiteks suumima.
10. Velaro reaalajas vestlus
Mõnikord muudavad kõige väiksemad detailid kõige suuremaks. Näiteks on nemad need, kes teevad maandumislehe Velaro reaalajas vestlus hämmastav.
Üksuse pildi kohal olev väike PDF-i sümbol aitab määrata, millises vormingus allalaadimine toimub. Alampealkirja ees olev nool aitab veelgi esile tõsta olulist eksemplari, mida külastajad lugeda soovivad. Nagu IMPACT, on neil ka automaatselt märgitud ruut tellimusi uudiskirjale nende vormil – mis, kui see muudetakse täiendavaks märkeruuduks, on suurepärane viis tellijate arvu suurendamiseks. Kõik need väikesed, pealtnäha tähtsusetud detailid aitavad luua kindla ja hämmastava sihtlehe kujunduse. Kodulehe kujundus
11. MÕJU Bränding ja disain / Kodulehe kujundus
Avaleht IMPACT on pikka aega olnud disaineritele inspiratsiooniallikaks. Mulle meeldib lihtne lehepaigutus alates suurest pealkirjakoopiast ja üksikasjalikust pildist kuni kuju ümbritseva kontuurini kuni värvide ja fontideni, mis on silmale väga meeldivad.
Siin allalaadimiseks pakutav tasuta käsiraamat IMPACT ei tõsta ka allalaadimist ennast esile sinises nupus, mis võimaldab täidetud vormi esitada. Pigem kutsub IMPACT teid rohkem konversioone genereerima, keskendudes sellele, mida saate juhendi lugemisest saada.
Sihtlehed lisateabe saamiseks
12. Ära ütle
Pole siis ime Unbounce on selle loendi tipus – nad tõesti kirjutasid raamatu suure konversiooniga sihtlehtede loomise kohta. Kuigi sellel sihtlehel on palju hämmastavaid asju, kaks, mis mulle väga meeldivad, on: 1) vestluskasti kasutamine klassikalise vormi asemel ja 2) üksikasjalik, kuid hästi pakitud teave vormi/avalehe all. Lehekülje kujundus
Esimene aitab suunata tähelepanu lehe eesmärgile – vormi täitmiseks – viisil, mis on märkamatu ja ei tunduks tüütu. Teine annab sellele lehele tõuke SEO-le (otsingumootoritel on rohkem sisu, mida roomata) ja eemaldab ärevuse inimestelt, kes peavad enne teabe esitamist sisu kohta rohkem teadma, ilma et see tõmbaks inimesi vestlusaknast kõrvale.
13. Bills.com. Kodulehe kujundus
Inimesed peavad sageli sihtlehti teie veebisaidi staatilisteks lehtedeks. Kuid õigete tööriistadega saate muuta need interaktiivseks ja isikupärastatuks.
Võtke allolevat näidet koos Bills.com. Et teada saada, kas teile oleks nende konsultatsioonist kasu, vastake enne vormi kuvamist kolmele küsimusele. See algab sellest:
Seejärel vastate veel kahele järgmisele küsimusele:
Ja siin on lõplik sihtlehe vorm, kuhu oma andmed sisestate:
Ma pole kindel, kuidas algoritm töötab (või kas see on üldse olemas), kuid selle täitmise ajal oli mul mure ei kvalifikatsioonid. Kui sain teada, mida ma tegin, täitsin põnevusega vormi, mida kindlasti teeb enamik inimesi, kellel on võlg ja kes seda tööriista kasutavad. Vean kihla, et muutes selle pakkumise eksklusiivsemaks enne, kui vorm ilmub sihtlehele, teeb Bills.com seda oluliselt suurenenud konversioon.
14. Trulia kodulehe kujundus
Trulia tegi oma sihtlehega midagi Bills.com-ile väga sarnast. See algab lihtsa vormiga, milles küsitakse "aadressi" (mis kõlab vähem jubedalt kui "teie aadress", kuigi seda nad tähendavad). Selle lihtsa vormivälja all on ereoranž nupp, mis on hästi kontrastiks vormi taga oleva tegelase kujutisega ja rõhutab, et hinnang kohandatakse teie kodu järgi.
Maja väärtuse hindamiseks muidugi aadressist endast ei piisa. See tähistab lihtsalt maja ümbrust. Seetõttu on järgmisel lehel lisaküsimused kinnisvara enda kohta, näiteks voodikohtade ja vannide arv. Allpool näete koopiat "Öelge meile, kuhu aruanne saata" - koos lahtiütlusega, et selle teabe sisestamisega nõustute võtma ühendust kinnisvaramaakleriga. See on suurepärane näide sellest, kuidas ettevõte väärtustab oma külastajaid algusest peale, seades samal ajal külastajate ootused sellest, mis sellest edasi saab.
15. Landboti kodulehe kujundus
landbotteenus, mis loob vestlusrobotipõhiseid sihtlehti, asetab oma toote oma vestluspõhise sihtlehe keskmesse. Külastajaid tervitab sõbralik emotikonide ja GIF-idega bot, mis julgustab neid andma teavet vestlusvormingus, mitte traditsioonilisel kujul.
16. Veebikasumid
Väikeseks kontrastiks... aga pikkade sihtlehtedega? Vaid mõne nipiga saate muuta isegi pikima sihtlehe lühikeseks. Allolev Webprofitsi sihtleht näitab, kuidas seda teha. Kodulehe kujundus
Lisateabe saamiseks on paremas ülanurgas silmapaistev CTA nupp – taustal on hea kontrast, et see silma paistaks, ja allanool, mis julgustab kerimist. Kui vormivälja ei paigutata ette, aitavad need vähendada hõõrdumist ja annavad külastajatele võimaluse enne konversioonivaliku esitamist rohkem teada saada.
Samuti võimaldavad need mõista, mis tegelikult on teeb Veebitulud . Ülejäänud leht sisaldab üksikasju selle kohta, mida saate teabe esitamisel. Lisaks sisaldab see strateegilisi CTA-sid, mis aitavad teil vormi täitmiseks tagasi ülaossa navigeerida, näiteks „Räägime”.
17. H.BLOOM
Mõnikord peate lihtsalt peatuma ja imetlema sihtlehte, et näha, kui ilus see on. Kui kasutate suure eraldusvõimega fotot ja sihtlehel palju valget ruumi H.BLOOM kena vaadata.
Lisaks oma ilule on lehel mõned suurepärased teisenduselemendid: blankett, selge ja lühike kirjeldus selle kohta, mis vormi täitmisel juhtub, ja isegi ereoranž nupp "Esita". Ainus asi, mida me muudame? Kopeeri esitamisnupul – see võib olla pakutavale ettepanekule spetsiifilisem. Kodulehe kujundus
18. Konversioonilabor
Kuigi ma ei lisaks sihtlehti käsitlevasse postitusse vormipostituse näidet, on see sait eriline. Домашняя страница on kogu sait – navigeerimislingid viivad teid lihtsalt alloleva teabe juurde. Kodulehe kujundus
Kui klõpsate valikul „Abi sihtlehtede kohta”, liigub kogu sait, et vormi jaoks ruumi teha. Enne klõpsamist näeb see välja järgmine:
Ja kui klõpsate sellel CTA-l, vaadake, kuidas vorm välja näeb:
Mulle meeldib, et vormi täitmiseks ei pea te lehelt lahkuma, kuid vorm ei sega juhuslikke saidikülastajaid.
Ideed/Kodulehe kujundus
Hästi optimeeritud koduleht võib muuta kliendid müügivihjeteks, jäädvustades teavet, mis aitab teil külastajaid paremini mõista, turundada ja rõõmustada. Kuna sihtlehed on konversioonide jaoks kriitilise tähtsusega, on oluline veenduda, et need on hästi planeeritud, kujundatud ja teostatud. Siin on mõned asjad, mida loomisel arvestada suunatud lehed: atraktiivne esteetika: aidata võivad ainult teie sihtlehe värv ja puhas kasutajaliides. Külastajad soovivad teie toodete kohta rohkem teada saada ja näha tõendeid teie pakutava väärtuse kohta. Vaadake meie loendi # 10, Inbound Emotion, et saada suurepärane näide suurepärasest veebilehest.
Vähem on rohkem. Laske lausel või piltidel enamus kõneleda, kuid lisage kindlasti kõik kirjeldavad pealkirjad ja tugitekst, et muuta teie sihtleht selgeks ja mõjuvaks. See kehtib peaaegu kõigi lehe komponentide kohta: tühik, lihtne koopia ja lühemad vormid.
Kodulehe kujundus
Hoidke külastajad lehel: kui eemaldate peamise navigeerimisriba või mis tahes segavad lingid, on vähem tõenäoline, et külastajad võivad teie lehe hüljata.
Jagamine sotsiaalvõrgustikes. Lihtne viis külastajate sihtlehele meelitamiseks on kasutada jagamisnuppesotsiaalsed võrgustikud, et nad saaksid teie sisu oma sotsiaalmeedia jälgijatele levitada. Lõppude lõpuks on kliendid teie turunduse hooratta keskpunkt.
A/B testimine: sihtlehtede õige toimimine on oluline ja kuna tarbijapsühholoogia võib mõnikord üllatada, on alati kõige parem katsetada oma lehtede erinevate versioonidega, et näha, milline konversioonimäär (CVR) on kõrgeim. Kontrollige pakkumise paigutust, CTA-de tüüpe või isegi värviskeemi.
Üleskutse tegevusele: CTA, kus liha on sihtlehel või pöördepunkt, kus on võimalus kontaktideks saada. CTA-d võivad paluda külastajatel tellida, alla laadida, vorm täita ja edasi jagada sotsiaalsed võrgustikud jne, kuid üldiselt on CTA-d vajalikud, et publikut oma pakkumisega aktiivsemalt kaasata. Müügivihjete loomiseks peavad CTA-d olema julged ja kaasahaaravad, kuid mis kõige tähtsam, need peavad väärtust tõhusalt edasi andma.
Jäta kommentaar