a vállalat virtuális bejárati ajtajaként szolgál, ez az oldal felelős a webhely forgalmának többségéért. Mégis, annak ellenére, hogy kiemelkedő, sok vállalkozás küzd, hogy optimalizálja azt megfelelően.

látja, a honlapjának sok kalapot kell viselnie. Ahelyett, hogy úgy kezelné, mint egy dedikált céloldalt, amely egy adott művelet köré épül, úgy kell megtervezni, hogy különböző közönségeket szolgáljon, különböző eredetűek. És ahhoz, hogy ezt hatékonyan megtehessük, céltudatosan kell építeni. Más szavakkal, olyan elemeket kell beépítenie, amelyek vonzzák a forgalmat, oktatják a látogatókat és meghívják a konverziókat.

a honlap teljesítményének javítása érdekében nézze meg ezeket az elemeket, amelyeknek minden honlapnak rendelkeznie kell.

 Ingyenes Letöltés: 77 példa a ragyogó Webdesignra

12 kritikus elemek minden weboldal kezdőlapjának rendelkeznie kell

Mentés

12 kritikus elemek a honlap homepage infographic

Mentés

ossza meg ezt a képet a honlapon

mit kell tartalmaznia a honlapon honlap Design

Headline

három másodpercen belül, a honlap kell mondani a látogatók, amit az üzleti kínál. Ez az, ahol a főcím jön. Lehet, hogy csak néhány szó, de ez az egyik legfontosabb példány a webhelyén.

sokféle ember látogathatja meg webhelyét, és nehéz lesz megtalálni néhány szót, amely mindenki számára hazaér. Ehelyett írja meg a címsort, hogy megcélozza azoknak az embereknek a harmadát, akik valószínűleg elégedettek lesznek a termékével.

maga a címsor legyen világos és egyszerű. A Dropbox címsora remek példa: “minden, ami a munkához szükséges, egy helyen.”Egyszerű, mégis erőteljes — nem kell dekódolni a zsargont, hogy kitaláljuk, mit csinál valójában a Dropbox.

Dropbox weboldal homepage

Al-headline

az al-headline kell kiegészíteni a főcím kínál egy rövid leírást, hogy mit csinál, vagy mit kínál. Ez lehet tenni hatékonyan nullázás egy közös fájdalom pont, hogy a termék vagy szolgáltatás megoldja.

íme egy példa a mirror nagyszerű alcímére: “bujkál a szem elől.”A tükör tornaterem elsődleges értékesítési pontján hones: Ez egy teljes otthoni edzőterem, személyi edző és edzésterv, mindezt otthonának kényelmében, anélkül, hogy értékes alapterületet venne fel felszereléssel. Mirror website homepage alfejezet, amely az egyszerű látványban rejtőzik

a mobilcímek optimalizálásához használjon nagyobb betűtípusokat, hogy a látogatók jobb élményt nyújtsanak. A kis betűtípusok arra kényszeríthetik a mobil látogatókat, hogy megcsípjék és nagyítsák a webhely tartalmát, és kölcsönhatásba lépjenek vele. A tanácsunk? Használja az Oldalszerkesztő fejléc opcióit. A H1 fejlécek tökéletesek az oldalcímekhez — egy oldalon csak egy H1 lehet. Az alszámoknak a hierarchia sorrendjét kell követniük, H2, H3 … H6 és így tovább. Több ilyen címsor is lehet, csak ellenőrizze, hogy rendben vannak-e. Például nem akar ugrani egy H1-ről egy H3-ra-válasszon inkább egy H2-t.

elsődleges cselekvésre ösztönzés

a honlapod célja, hogy rávedd a látogatókat, hogy mélyebben ássanak bele a weboldaladba, és mozgatják őket a tölcséren. Helyezzen be két-három cselekvésre ösztönzést a hajtás fölé, amely az embereket a vásárlási ciklus különböző szakaszaiba irányítja-és helyezze őket olyan helyekre, amelyek könnyen megtalálhatók.

ezeknek a CTA-knak vizuálisan feltűnőnek kell lenniük, ideális esetben olyan színben, amely ellentétben áll a Kezdőlap színsémájával, miközben illeszkedik az Általános kialakításhoz. Tartsa röviden a másolatot-legfeljebb öt szót-és cselekvésorientált, így arra kényszeríti a látogatókat, hogy kattintsanak bármire, amit kínál. Példák a CTA példányra: “regisztráció, “”időpontot egyeztetni, “vagy” próbálja ki ingyen.”

az Afterschool HQ weboldalán két CTA található a hajtás felett, mindkettő a programigazgatók felé irányul, akik érdeklődnek az iskola utáni programok népszerűsítése iránt a helyszínen lévő családok számára. A hosszabb CTA “készítse el INGYENES profilját” alatti megjegyzés megadja a látogatóknak a fiók létrehozásához szükséges lökést — ez az első lépés az iskola utáni HQ szolgáltatóvá váláshoz.

támogató kép

a legtöbb ember vizuális. Ügyeljen arra, hogy olyan képet (vagy akár egy rövid videót) használjon, amely egyértelműen jelzi, hogy mit kínál. Használjon olyan képeket, amelyek érzelmeket rögzítenek, cselekvést hajtanak végre, és vizuálisan elmondják a történetet, amelyről ír.

a képek mobil felhasználók számára történő optimalizálásához használjon kiváló minőségű, csökkentett fájlméretű képeket. (A HubSpot ügyfeleinek nem kell aggódniuk emiatt, mivel a HubSpot szoftverébe feltöltött képek automatikusan tömörítésre kerülnek. Ellenkező esetben az olyan eszközök, mint a TinyPNG, megteszik a trükköt.) Mindig adjon hozzá alt szöveget a képekhez, hogy hozzáférhetőbbé tegye azokat a látogatók számára, akik képernyőolvasókat használnak, és hogy a SEO erőfeszítéseit egy fokkal feljebb vigye.

a 4 Rivers Smokehouse honlapja nagyszerű példa az érzelmi képekre: rövid, nagyfelbontású és ínycsiklandó videók sorozatát tartalmazza, amelyek egy egyszerű címsor, alcímsor és elsődleges CTA mögött egy hurokon játszanak:

4 rivers smokehouse honlapja homepage kiemelt kép sajtburgerrel

előnyök

nem csak az a fontos, hogy leírja, mit csinál, hanem az is, hogy miért számít, amit csinál. Kilátások szeretné tudni az előnyeit vásárol tőled, mert ez az, ami arra kényszeríti őket, hogy kibír.

tartsa a másolatot könnyű és könnyen olvasható, és beszélje az ügyfelek nyelvét. Az Evernote nagyszerű munkát végez az előnyök felsorolásában a honlapjukon olyan módon, amely lenyűgöző, vizuálisan kellemes és könnyen érthető:

Evernote website homepage előnyök

Social Proof

Social proof egy erős mutatója a bizalom. A termék vagy szolgáltatás lehet a legjobb a világon, és rendben van, hogy ezt az állítást állítsuk — csak az, hogy az emberek nem hisznek neked, hacsak nem hallják más emberektől is. És pontosan ezt teszi a társadalmi bizonyíték.

csak néhány a legjobb (rövid) idézetek a honlapon, és link esettanulmányok adott esetben. A név és a fénykép hozzáadása hitelesebbé teszi ezeket az ajánlásokat. A Lessonly ezt a honlapjukon szögezi le a tényleges ügyfelek izzó ajánlásaival.

Lessonly website homepage testimonials and reviews

Navigation

a honlap navigációjának kialakítása és tartalma jelentheti a különbséget a weboldal konverziója és a visszapattanás között. A visszafordulási arány csökkentése érdekében adjon egyértelmű utat a látogatóknak a szükséges oldalakhoz közvetlenül a kezdőlapról. Tegye láthatóvá a navigációs menüt az oldal tetején, és rendezze a linkeket hierarchikus struktúrába.

senki sem ismeri jobban a webhelyét, mint azok, akik segítettek megtervezni, ezért győződjön meg róla, hogy felhasználói teszteket végez, hogy megbizonyosodjon arról, hogy a látogatók egyszerűen és intuitív módon megtalálják azt, amit keresnek az Ön webhelyén. Adjon meg egy keresőmezőt, ha lehet. (Olvassa el ezt a blogbejegyzést további hasznos weboldal navigációs tippekért.)

Íme egy példa a slim tiszta, jól felépített navigációs tervére & Husky ‘ s Pizza Beeria homepage:

Slim and huskys website homepage navigation

Tartalomajánlat

ahhoz, hogy még több leadet generálj a kezdőlapodról, tartalmazz egy igazán nagyszerű tartalomajánlatot, például egy fehér könyvet, e-könyvet vagy útmutatót. Azok az emberek, akik esetleg nem állnak készen a vásárlásra, inkább letölthetnek egy ajánlatot, amely több információt nyújt számukra az őket érdeklő témáról. Ha inspirációra van szüksége, itt többféle tartalomtípus közül választhat.

másodlagos cselekvésre ösztönzés

vegye fel a másodlagos CTA-kat a kezdőlapjára, hogy további konverziós lehetőségeket kínáljon azoknak a potenciális ügyfeleknek, akiket nem érdekel az elsődleges célja. Gondolj rájuk, mint a készenléti tervre: egy másik utat kínálnak azoknak a látogatóknak, akik még nem állnak készen valami olyan nagy elkötelezettségre, mint amit kérsz.

míg az elsődleges CTA-knak a hajtás felett kell lenniük, helyezze a másodlagos CTA-kat a hajtás alá, hogy a látogatók rákattinthassanak, amikor lefelé görgetnek. Például a Spanx kezdőlapjának hajtása alatt három, egyértelműen felcímkézett cselekvésre ösztönzést talál, amelyek az ilyen messzire görgetett embereknek még néhány lehetőséget kínálnak a kattintásra. Ezek a másodlagos CTA-k két különböző típusú konverzióra vonatkoznak: az egyik a bal szélen 20 dollárért, a másik pedig a “shop now” az online katalógus felfedezéséhez.

Spanx weboldal homepage másodlagos CTA-k

jellemzők

az előnyök mellett soroljon fel néhány kulcsfontosságú funkciót. Ez lehetővé teszi az emberek számára, hogy jobban megértsék, mit nyújtanak a termékei és szolgáltatásai. Ismét tartsa a másolatot könnyű és könnyen olvasható. Például a Dropbox for Business nem riad vissza attól, hogy a funkciók mátrixát közvetlenül a kezdőlapjukon mutassa meg a hajtás alatt.

dropbox for business weboldal Kezdőlap jellemzők

források

ismét a legtöbb látogató a honlapon nem lesz kész vásárolni … még. Azok számára, akik további információkat keresnek, ajánljon egy linket egy erőforrásközponthoz, ahol böngészhetnek a releváns információk között. Ez nem csak hosszabb ideig tartja őket a weboldalán, hanem segít abban is, hogy hitelességét az iparág gondolatvezetőjeként megalapozza.

a Lovesac hozzáad egy erőforrás linket a hajtás alatti lábléchez. Figyelje meg, hogy ezek a másodlagos CTA-k hogyan fedik le a vásárlási ciklus több szakaszát: hitelkártya-link, amely segít az ügyfeleknek a bútorok egyszerű megvásárlásában, szövetmintás útmutató azok számára, akik vásárlás előtt még mindig a tökéletes színt keresik, és online katalógus azok számára, akik új bútorok piacán vannak, de még nem állnak készen a vásárlásra.

lovesac honlap honlap források és CTA-k a láblécben

Sikermutatók

az ügyfelek sikertörténetein kívül a díjak és az elismerések is segíthetnek a jó első benyomás kialakításában. Az Ön cége kritikusan elismert étterem? Te voltál a legjobb új alkalmazás ebben az évben? Hagyja, hogy a honlap látogatói tudják a teljesítmények. Mint a társadalmi bizonyíték, nagyobb hitelességet ad vállalkozásának azok számára, akik nem ismernek téged.

a Calendly honlapján például olyan híres szervezetek nevét találja, amelyek felismerték őket, mint például a Gartner és a Dropbox.

Calendly website homepage

a honlap érdemes felkeresni

a honlap a honlap az első bevezetés minden látogató lesz az üzleti. Mielőtt eldöntenék, hogy ügyfelekké válnak, áttekintik a honlapját, hogy képet kapjanak arról, hogy mit árul, miért számít nekik, és hogyan profitálhatnak abból, amit kínál.

készítsen ragyogó első benyomást egy olyan honlappal, amely magában foglalja a fent vázolt elemeket. További inspirációért nézze meg a honlapok lenyűgöző példáit az alábbi ingyenes lookbook letöltésével.

a szerkesztő megjegyzése: Ezt a bejegyzést eredetileg 2012 januárjában tették közzé, és frissesség, pontosság és átfogóság érdekében frissítették.

példák a ragyogó honlap, blog és céloldal tervezésére

Vélemény, hozzászólás?

Az e-mail-címet nem tesszük közzé.