Designul paginii de pornire 101: Ce să includeți pe prima pagină a site-ului dvs. web
Publicat: 2018-10-31Pagina dvs. de pornire servește atât ca o introducere a mărcii dvs., cât și ca un set de instrucțiuni codificate menite să ajute atât clienții noi, cât și cei existenți să navigheze în afacerea dvs. pentru a găsi ceea ce au nevoie.
La fel ca o pagină de destinație, detaliul ar trebui să creeze o primă impresie puternică și să încurajeze o acțiune intenționată, indiferent dacă scopul paginii dvs. de pornire este de a vă vinde produsele sau de a capta abonați la e-mail.
Nu există o singură modalitate de a proiecta o pagină de pornire. Cu toate acestea, iată câteva sfaturi de care trebuie să țineți cont atunci când vă planificați pagina de pornire de sus în jos, fie că vă construiți primul magazin, fie că revedeți această parte crucială a site-ului.
Întrebări de adresat atunci când vă proiectați pagina de pornire
O pagină de pornire care funcționează perfect pentru o afacere ar putea să se prăbușească pentru alta.
Dacă vă uitați la opțiunile de proiectare a site-ului web și nu sunteți sigur în ce direcție să mergeți, iată câteva întrebări care vă vor ajuta să vă ghidați decizia:
- Cât de ușor le-a fost să ajungă la pagina ta de pornire și ai un domeniu de marcă? Avem instrumente gratuite pentru a vă ajuta cu găsirea unui nume de domeniu.
- Ce vrei să facă vizitatorul? (de exemplu, efectuați o achiziție, înscrieți-vă în lista dvs. de e-mail etc.)
- Cât de simplu le faci să facă asta?
- Câți pași sunt pentru a-ți îndeplini obiectivul?
- De câte informații au nevoie pentru a trece la pasul următor?
- Există pași pe care îi puteți elimina?
Vizitatorii ajung uneori pe paginile de start știind ce vor, iar alteori nu. Trebuie să vă proiectați pagina de pornire ținând cont de ambele, asigurându-vă în același timp că deciziile dvs. se aliniază cu obiectivele dvs. principale.
O pagină de pornire bună ar trebui să găzduiască vizitatorii care caută un rezultat specific, în același timp îndreptând atenția celor care nu sunt.
Lista de lectură gratuită: Sfaturi pentru designul magazinului online
Aspectul magazinului dvs. online poate avea un mare impact asupra vânzărilor. Eliberează-ți designerul interior cu lista noastră gratuită, organizată de articole de mare impact.
Primiți lista noastră de citire pentru Designul magazinului direct în căsuța dvs. de e-mail.
Aproape acolo: vă rugăm să introduceți adresa de e-mail de mai jos pentru a obține acces instantaneu.
De asemenea, vă vom trimite actualizări despre noi ghiduri educaționale și povești de succes din buletinul informativ Shopify. Urăm SPAM-ul și promitem să vă păstrăm adresa de e-mail în siguranță.
Ce rezultate ar trebui să sprijine designul paginii dvs. de pornire?
În medie, vizitatorii vor petrece 10-20 de secunde pe pagina ta de pornire. Ceea ce înseamnă acest lucru din perspectiva designului este că trebuie să clarificați fluxul de navigare, astfel încât vizitatorii să poată alege rapid cea mai bună cale pentru ei înșiși (și pentru afacerea dvs.).
La această urgență se adaugă un fenomen psihologic numit „ evitarea deciziilor”, care este tendința oamenilor de a evita o decizie care durează prea mult pentru a fi luată.
Pe o pagină de pornire, evitarea deciziei înseamnă „sărire” prin ieșirea din pagină sau apăsând butonul Înapoi. Pentru a preveni acest lucru, prima sarcină a paginii dvs. de pornire ar trebui să fie să convingeți potențialii clienți să rămână.
Pentru a face asta, trebuie să înțelegeți rolul celei mai valoroase proprietăți imobiliare ale site-ului dvs.
1. Conținut „de mai sus” care inspiră acțiune
Când designerii web vorbesc despre o zonă a paginii de pornire ca fiind „de mai sus,” se referă la ceea ce văd vizitatorii înainte de a decide să deruleze.
Când luați în considerare ceea ce se află deasupra pliului și modul în care acesta însoțește restul paginii dvs. de pornire, concentrați-vă asupra acțiunilor pe care doriți să le întreprindă vizitatorul atunci când ajunge pentru prima dată pe site-ul dvs., informațiile de care au nevoie mai întâi și cum puteți ajuta la facilitarea deciziei lor.
Luați pagina principală a Morning Recovery, de exemplu. Morning Recovery vinde un remediu pentru mahmureala ca unic produs. Deoarece scopul este de a direcționa clienții potențiali să-și cumpere produsul emblematic, imaginile viu colorate și axate pe produs împodobesc secțiunea de deasupra pliului cu un îndemn clar la acțiune care îi determină pe vizitatori să facă o achiziție.
Pe această pagină de pornire, există două decizii rapide pe care un utilizator le poate lua:
- Continuați să faceți o achiziție
- Sau derulați în jos pentru mai multe informații de mai jos: recenzii, un videoclip și informații despre ingredientele produsului.
Cele mai bune modele de site-uri de comerț electronic folosesc anteturi care sunt o combinație între un titlu care atrage atenția, un subtitrare persuasivă și o imagine captivantă deasupra paginii, pentru a menține vizitatorii noi pe site și a-i familiariza cu marca.
Cu toate acestea, există multe alte modalități prin care puteți capta interesul unui client de la bun început, cum ar fi prezentarea unui banner promoțional deasupra navigației pentru a face publicitate unei oferte speciale sau a livrării gratuite.
Aveți nevoie de imagini pentru antetul dvs.?
Burst este site-ul de fotografii stoc gratuit al Shopify, cu imagini curatate pentru antreprenori și creativități. Răsfoiți 1000 de imagini de stil de viață și produse, optimizate pentru antetul dvs.
Răsfoiește Burst acum2. Navigare clară
Puterea de navigare a unei pagini web se bazează pe simplitatea acesteia. Acest lucru poate părea contradictoriu atunci când doriți să găzduiți diferite tipuri de vizitatori, dar are sens când luați în considerare cât de repede se deplasează oamenii de la o pagină la alta pe internet.
Navigarea în antet ar trebui să fie cât mai simplă posibil, acordând prioritate căilor care contează cel mai mult pentru majoritatea vizitatorilor. Andy Crestodina, director strategic al Orbit Media Studios, recomandă nu mai mult de șapte link-uri de navigare pe pagina ta de pornire.
Oamenii folosesc o metodă de memorare organizațională numită „bucăți” în care informațiile sunt împărțite în unități mentale mai mici numite „bucăți”.
Cu cât sunt mai puține „bucăți”, cu atât reținerea memoriei devine mai ușoară. Într-o lucrare influentă publicată în 1956, profesorul de psihologie George Miller a concluzionat că memoria noastră pe termen scurt este în general capabilă să dețină doar șapte elemente la un moment dat.
Site-urile cu prea multe opțiuni de navigare se pot simți aglomerate și copleșitoare, crescând probabilitatea ca vizitatorii să abandoneze sau să ia calea greșită. O bună practică este să prioritizați linkurile de navigare de la stânga la dreapta, cu cele mai importante pagini în stânga.
Dacă aveți o mulțime de produse și colecții, concentrați-vă pe colecțiile principale de nivel superior în navigarea pe pagina de pornire și utilizați un „mega meniu” sau un meniu derulant pentru a crea sub-navigație .
Sub-navigarea este o modalitate excelentă de a vă organiza produsele și paginile pentru o explorare ușoară, fără a copleși clienții cu prea multe opțiuni de la început.
Pagina de pornire a lui UNCONDITIONAL, de exemplu, echilibrează navigarea minimă și inventarul extins cu un meniu derulant bine organizat.
Unele site-uri web au, de asemenea, link-uri către pagina despre noi, pagina de contact, pagina Întrebări frecvente sau alte pagini în navigarea din antet, deoarece își susțin obiectivele principale.
Dar dacă descoperiți că vizitatorii acestor pagini nu efectuează conversii conform obiectivelor dvs., este posibil ca aceste linkuri să-i scoată pe calea conversiei. Dacă acesta este cazul, cel mai bine este să adăugați aceste linkuri la subsol.
3. Imagini atrăgătoare
Evitarea deciziilor se aplică nu numai navigației dvs., ci și tuturor celorlalte elemente de pe pagina dvs. de pornire. Aprecierea limitelor atenției utilizatorului vă va ajuta să subliniați ceea ce contează cel mai mult atunci când vă proiectați pagina de pornire.
Indiferent dacă promovați un produs sau o colecție sau încercați să captați clienți potențiali, scopul imaginilor dvs. este de a atrage atenția utilizatorului imediat când acesta ajunge pe site-ul dvs. web.
Iată câteva modalități de a încorpora elemente vizuale în secțiunea de mai sus a paginii dvs. de pornire:
Imagine cu text suprapus
Acest stil de imagini deasupra paginii îmbină adesea o singură imagine puternică, o copie directă și un îndemn la acțiune. Funcționează cel mai bine pentru comercianții care doresc să se concentreze pe o ofertă de top de mai sus, cum ar fi o reducere de timp limitată, un produs emblematic sau o colecție sezonieră.
Prezentări de diapozitive
Puteți alege să includeți o expunere de diapozitive cu fiecare dintre diapozitive care promovează o anumită vânzare, un grup de produse sau o fotografie de înaltă calitate a produsului.
Proprietarii de magazine care vând o selecție largă de produse în câteva categorii optează adesea pentru această abordare atunci când există câteva colecții sau pagini pe care doresc să le promoveze vizitatorilor.
Veți dori să ordonați diapozitivele în funcție de prioritate, mai întâi cu diapozitivul cu cea mai mare prioritate. Cel mai bine este să vă limitați la aproximativ trei diapozitive, deoarece utilizatorii nu se vor uita la un singur diapozitiv mult timp înainte de a trece la pasul următor.
Video
Anumite mărci pot beneficia de o imagine a paginii de pornire care spune povestea lor. Pentru unele produse, în special cele inovatoare sau complexe, poate fi necesar să ilustrezi modul de utilizare a produsului înainte de a-i putea interesa pe vizitatori.
Luați pagina de pornire a Bottle Cutting Inc, de exemplu. Mulți vizitatori probabil nu vor ști că încă au nevoie de produs, așa că pagina de pornire creează entuziasm în jurul acestuia printr-o demonstrație video - un prim pas natural în procesul de conversie.
Deoarece imaginile au un impact atât de imediat și semnificativ, este important să vă asigurați că sunt de înaltă calitate și cu adevărat reprezentative pentru marca dvs.
Dacă nu sunteți fotograf, puteți utiliza selectorul de imagini din editorul de teme Shopify pentru a selecta din colecția noastră de fotografii de stoc gratuite.
4. Un apel direct la acțiune
Gândiți-vă la un îndemn la acțiune ca la un semn de ieșire pe o autostradă; ar trebui să fie scurt, greu de ratat și să indice șoferii potriviți pe calea pe care trebuie să o urmeze.
Îndemnurile dvs. la acțiune și la ce se leagă ar trebui să se alinieze cu următorii pași pe care un client îi poate face pentru obiectivele principale ale paginii dvs. de pornire. Acest lucru ar putea însemna să vă conectați la cea mai recentă colecție sau să determinați utilizatorii să vizioneze un videoclip explicativ pentru a afla mai multe.
Utilizatorul ar trebui să înțeleagă imediat unde să facă clic, deoarece butonul de apel la acțiune ar trebui să iasă în evidență față de designul din jur. Cu cât îi ia mai mult timp unui utilizator să găsească îndemnul, cu atât este mai probabil ca acesta să devină confuz sau să facă clic.
Pagina de pornire PopSockets, prezentată mai sus, face o treabă excelentă de a muta utilizatorul pe calea ideală de conversie. Imaginile geniale ale produselor sunt folosite pentru a atrage atenția utilizatorului, în timp ce chemarea la acțiune este în față și în centru în alb-negru (în contrast cu fundalul colorat).
Nimic de deasupra pliului nu distrage atenția de la scopul principal al paginii de pornire: să direcționeze utilizatorul să răsfoiască cea mai recentă linie de produse. Pe măsură ce derulați în jos, veți vedea mai multe CTA pentru a cumpăra alte produse.
Aflați mai multe: Putem face față tuturor problemelor comerțului electronic cu generatorul nostru de site-uri web? De la o frumoasă vitrină online la un sistem puternic de gestionare a conținutului, permiteți-ne să construim și să rulăm site-ul magazinului dvs. cu ușurință.
5. Un coș de cumpărături ușor de accesat
Coșul de cumpărături este o parte integrantă a paginii de pornire pentru majoritatea site-urilor de comerț electronic.
O parte din a face navigarea intuitivă pentru clienții dvs. este să vă asigurați că coșul de cumpărături este ușor de găsit. Un coș de cumpărături „lipicios” (numit uneori un coș „glisabil”, care este disponibil în anumite teme Shopify) este un coș care este prezent și disponibil pe ecran pe parcursul întregii experiențe de navigare, de obicei în colțul din dreapta sus.
Și mai bine, puteți afișa și numărul de articole aflate în prezent în coșul clientului. O notificare îndrăzneață și atrăgătoare din coș, care indică numărul de articole adăugate în prezent, le reamintește clienților achiziția lor este încă în curs și îi încurajează să finalizeze finalizarea comenzii.
Concluzie: clarificați clienților când sunt articolele în coș și cum să le acceseze.
Pagina de pornire a lui Chubbies are o notificare roșie care evidențiază numărul de articole din coșul utilizatorului, precum și un coș cu glisare care le permite utilizatorilor să continue cu ușurință cumpărăturile sau să treacă la cumpărături.
6. O bară de căutare (pentru colecții mari de produse)
Pe lângă navigarea minimă și un coș lipicios, multe magazine online includ o bară de căutare pentru a ajuta vizitatorii care știu exact ce caută, mai ales dacă au multe produse diferite sau o mulțime de conținut de explorat.
Morphe, de exemplu, are o colecție extinsă de diferite produse de machiaj. Pentru ca clienții să găsească mai ușor ceea ce caută, Morphe a adăugat o bară de căutare inteligentă care completează automat interogarea de căutare a unui vizitator cu produse, colecții și pagini sugerate. Aceasta creează o cale directă către pagina pe care utilizatorul o caută din pagina de pornire.
În general, utilizatorii care finalizează o căutare au mai multe șanse să facă conversii. Dacă marca dvs. vinde o mulțime de produse, o bară de căutare ușor de găsit oferă o alternativă la navigarea complexă, care este probabil să îndepărteze clienții.
Angajați experți cu abilități dovedite specifice Shopify
Cauți ajutor cu designerul magazinului visurilor tale? Experții Shopify sunt o comunitate organizată de agenții și freelanceri care construiesc și proiectează magazine frumoase personalizate. Le puteți angaja prin Shopify Experts Marketplace și puteți lucra cu ei direct prin intermediul administratorului Shopify.
Angajați asistență expertă astăziDincolo de fold: alte elemente ale paginii de pornire de luat în considerare
Elementele pe care le prezentați sub fold (adică după ce utilizatorii derulează) nu sunt neapărat mai puțin importante – de multe ori întăresc și extind informațiile pe care le-ați introdus deja, oferă alte căi către același obiectiv de conversie și fac alte pagini disponibile pentru utilizatori. clienții care au nevoie de ele.
Iată o listă scurtă de elemente pe care le puteți include ca parte a designului paginii de pornire sau a subsolului dvs., în funcție de cât de importante sunt acestea pentru obiectivele dvs.
1. Bloguri, videoclipuri și alt conținut
Conținutul de blog și video poate fi grozav pentru SEO, dar conținutul de deasupra foldului are potențialul de a distrage atenția clienților și de a-i îndepărta de produsele tale. În general, doriți ca conținutul dvs. să conducă utilizatorii către produsele dvs., nu invers.
Luați în considerare plasarea de linkuri către conținutul dvs. sub pliul sau chiar în subsol, mai ales dacă conținutul nu este un aspect de bază al afacerii dvs. și permiteți utilizatorilor care au ales să exploreze site-ul dvs. să îl găsească.
Dacă doriți să vă promovați conținutul, puteți adăuga un link în navigarea de sus, dar cel mai bine este adesea să faceți acest lucru pe rețelele sociale, prin e-mail și pe site-uri terțe, astfel încât să poată genera trafic extern către propriul site.
BioLite Energy, de exemplu, vinde aparate de gătit și iluminat durabile, portabile. Conținutul lor video informativ, pe pagina de pornire, este ascuns sub fold și deasupra subsolului pentru a evita distragerea atenției utilizatorilor de la propunerea lor de valoare de bază. Orice altceva, de la blogul lor la canalul lor YouTube, este disponibil mai jos dacă vizitatorii îl caută.
2. Dovada socială: recenzii, aprobări și presă ale clienților
Dovada socială este o susținere a mărcii dvs. care valorifică încrederea existentă din partea clienților/experților pentru a câștiga încrederea noilor vizitatori. Acestea pot include mențiuni de presă, recenzii, postări pe rețelele sociale, galerii Instagram sau aprobări de la influenți sau experți.
Dacă aveți dovezi sociale persuasive pe care le puteți folosi, pagina dvs. de pornire poate fi un loc bun pentru aceasta.
Pagina de pornire ErgoDox de mai jos oferă citate extrase de pe rețelele de socializare și strigări de la angajații de la companii binecunoscute, ca o dovadă a calității produsului lor. Cu toate acestea, aceasta este introdusă în jos după ce se stabilește ce face produsul lor.
3. Prioritate scăzută și produse suplimentare
Produsele mai vechi și produsele suplimentare, cum ar fi curelele de ceas, ar putea merita să fie mutate în partea de jos a paginii dvs. de pornire. La urma urmei, vrei să conduci cu produsele tale emblematice sau să atragi atenția asupra celor mai noi linii de produse.
Produsele mai puțin costisitoare care completează principalele dvs. produse acționează cel mai bine ca cumpărături impulsive utilizate ca vânzări suplimentare la finalizarea comenzii, dar pot fi incluse și pe pagina de pornire de sub fold pentru a-i face pe vizitatori conștienți de ele - dacă vindeți un produs care necesită piese de schimb sau reumpleri.
LIV Watches, de exemplu, se concentrează în mod natural pe ceasuri, dar își face publicitate produselor suplimentare premium, cum ar fi curelele, în partea de jos a paginii lor de pornire.
4. Pagini cu prioritate redusă
Paginile pe care le considerați cu prioritate scăzută pot diferi în funcție de modelul dvs. de afaceri.
În general, pagini precum Termenii și condițiile, Politica de confidențialitate sau Politica de returnare funcționează cel mai bine în subsol. Deoarece linkurile către aceste pagini sunt păstrate atât de des în subsol, mulți vizitatori ar trebui să caute intuitiv acolo dacă trebuie să ajungă la aceste pagini.
Alții, cum ar fi șablonul de pagină despre noi, informațiile de contact, locațiile magazinelor sau paginile de urmărire a comenzilor pot fi, de asemenea, adăugate la subsol. Dar dacă ajută cu adevărat clienții potențiali să cumpere de la dvs. sau vă ajută să realizați un alt obiectiv cheie, atunci puteți lua în considerare prioritizarea acestora în navigarea de sus sau chiar în designul paginii de pornire.
De exemplu, un comerciant care vinde un serviciu de abonament ar putea să-și reducă în mod semnificativ biletele de asistență prin adăugarea unui link proeminent Întrebări frecvente în navigarea paginii de pornire. Sau, ca și în cazul Bellroy, unde produsele lor sunt adesea achiziționate în persoană, puteți ajuta vizitatorii să descopere cea mai apropiată locație fizică de vânzare cu amănuntul printr-un link mai proeminent pentru Localizator de magazine.
În încercarea de a decide dacă o pagină este cu prioritate scăzută, întrebați-vă cât de mult ați beneficia dacă direcționați imediat vizitatorii către pagina respectivă și dacă aceasta servește pentru a le distrage atenția sau pentru a le atrage spre rezultatele dorite.
Ținând cont de designul paginii de pornire mobile
Traficul web mobil a continuat să crească în mod constant în ultimii doi ani. Deoarece o bună parte a traficului dvs. este probabil să provină din surse mobile, fiecare decizie pe care o luați cu privire la designul paginii dvs. de pornire ar trebui să țină cont de utilizatorii de dispozitive mobile.
Simplificarea paginii de pornire pentru a direcționa utilizatorii către un anumit set de acțiuni devine și mai importantă pentru utilizatorii de telefonie mobilă.
Dacă sunteți proprietarul unui magazin Shopify, elementele oricărei teme din magazinul tematic Shopify se vor ajusta în funcție de dimensiunea ecranului. Cu toate acestea, rețineți că imaginile care arată uimitor pe un ecran de desktop larg pot fi tăiate sau decupate în moduri neobișnuite pe un ecran mobil. Îndemnurile pot fi mai greu de găsit sau mutate într-un mod care face mai probabil ca vizitatorii să facă clic.
Puteți previzualiza cu ușurință designul paginii de pornire pe diferite dispozitive în editorul de teme Shopify utilizând opțiunile de comutare a vizualizării din partea de sus a previzualizării.
Îmbunătățirea designului paginii de pornire în timp
După cum probabil știți până acum, nu există o modalitate cea mai bună de a vă proiecta pagina de pornire. Factori precum demografia utilizatorului, brandingul, numărul de produse, canalele de marketing și alții pot influența comportamentul utilizatorului dvs. într-o varietate de moduri.
De aceea este atât de important să vedeți întotdeauna pagina dvs. de pornire ca pe o lucrare în curs, folosind traficul și vânzările pe care le generați pentru a măsura impactul paginii dvs. de pornire și pentru a face ajustări în timp.