als virtuele voordeur van uw bedrijf, deze pagina is verantwoordelijk voor het tekenen in een meerderheid van het verkeer van uw website. Toch, ondanks zijn bekendheid, veel bedrijven moeite om het goed te optimaliseren.
zie je, je homepage moet veel hoeden dragen. In plaats van het te behandelen als een speciale landing page gebouwd rond een bepaalde actie, het moet worden ontworpen om verschillende doelgroepen te dienen, van verschillende oorsprong. En om dit effectief te doen, moet het met een doel worden gebouwd. Met andere woorden, je nodig hebt om elementen die het verkeer aan te trekken op te nemen, te onderwijzen bezoekers, en uit te nodigen conversies.
om de prestaties van uw homepage te verbeteren, bekijk deze elementen die elke homepage moet hebben.
12 kritieke elementen elke website Homepage moet
deel deze afbeelding op uw Site
Wat moet u opnemen in uw Website Homepage ontwerp
Headline
binnen drie seconden moet een website bezoekers vertellen wat het bedrijf te bieden heeft. Dat is waar je krantenkop van pas komt. Het kan slechts een paar woorden, maar het is een van de belangrijkste stukken van de kopie op uw website.
veel soorten mensen kunnen uw website bezoeken, en u zult het moeilijk vinden om een paar woorden te vinden die voor iedereen thuis komen. In plaats daarvan, schrijf je kop te richten op een derde van die mensen die het meest waarschijnlijk tevreden zijn met uw product.
Houd de kop zelf duidelijk en eenvoudig. De kop van Dropbox is een goed voorbeeld: ‘alles wat je nodig hebt voor je werk, alles op één plek.’Het is eenvoudig, maar toch krachtig — het is niet nodig om jargon te decoderen om erachter te komen wat Dropbox echt doet.
Sub-headline
uw sub-headline dient de headline aan te vullen met een korte beschrijving van wat u doet of wat u aanbiedt. Dit kan effectief worden gedaan door in te zeroing op een gemeenschappelijke pijnpunt dat uw product of dienst oplost.
hier is een voorbeeld van een grote sub-headline van Mirror: “Hiding in plain sight.”Het hones in op de primaire selling point van de mirror gym: Het is een volledige at-home gym, personal trainer, en workout plan allemaal in het comfort van uw huis zonder het nemen van kostbare vierkante meter met apparatuur.
om uw koppen voor mobiel te optimaliseren, gebruikt u grotere lettertypen om bezoekers een betere ervaring te geven. Kleine lettertypen kunnen mobiele bezoekers dwingen om te knijpen en zoomen om te lezen en interactie met de inhoud op uw site. Ons advies? Gebruik de kopopties in uw pagina-editor. H1-koppen zijn perfect voor paginatitels — er mag slechts één H1 op een pagina staan. Subrubrieken moeten de volgorde van de hiërarchie volgen, H2, H3 … H6, enzovoort. Je kunt een aantal van deze koppen hebben, maar zorg ervoor dat ze in orde zijn. U wilt bijvoorbeeld niet van een H1 naar een H3 springen — kies in plaats daarvan een H2.
primaire Calls-to-Action
het doel van uw homepage is om bezoekers te dwingen om dieper in uw website te graven en ze door de trechter te verplaatsen. Neem twee tot drie calls-to-action boven de vouw die mensen naar verschillende stadia van de koopcyclus leiden — en plaats ze op plekken die gemakkelijk te vinden zijn.
deze CTA ‘ s moeten visueel opvallend zijn, idealiter in een kleur die contrasteert met het kleurenschema van uw homepage terwijl ze toch passen in het algemene ontwerp. Houd de kopie kort-niet meer dan vijf woorden — en actie-georiënteerd, zodat het dwingt bezoekers om te klikken wat je aanbiedt. Voorbeelden van CTA kopie zijn “Aanmelden, “” Maak een afspraak, “of” probeer het gratis.”
de website van het Afterschool HQ bevat twee CTA ’s boven de vouw, beide gericht op programmadirecteuren die geïnteresseerd zijn in het promoten van hun naschoolse programma’ s aan gezinnen op de site. De notitie onder de langere CTA “maak je gratis profiel” geeft bezoekers het duwtje dat ze nodig hebben om een account aan te maken — de eerste stap om een Afterschool HQ provider te worden.
ondersteunende afbeelding
de meeste mensen zijn visueel. Zorg ervoor dat u een afbeelding (of zelfs een korte video) gebruikt die duidelijk aangeeft wat u aanbiedt. Gebruik afbeeldingen die emotie vastleggen, actie stimuleren en visueel het verhaal vertellen waarover je schrijft.
om uw afbeeldingen voor mobiele gebruikers te optimaliseren, gebruikt u afbeeldingen van hoge kwaliteit met een kleinere bestandsgrootte. (HubSpot klanten hoeven zich hier geen zorgen over te maken, omdat afbeeldingen die zijn geüpload naar HubSpot ‘ s software automatisch worden gecomprimeerd. Anders, tools zoals TinyPNG zal het lukken.) Ook, altijd alt-tekst toe te voegen aan uw foto ‘ s om ze toegankelijker te maken voor bezoekers die gebruik maken van screen readers en om uw SEO inspanningen een notch.
de homepage van 4 Rivers Smokehouse is een geweldig voorbeeld van emotionele beelden: Het bevat een reeks korte, high definition en overheerlijke video ‘ s die op een lus worden afgespeeld achter een eenvoudige kop, sub-kop en primaire CTA:
voordelen
het is niet alleen belangrijk om te beschrijven wat je doet, maar waarom wat je doet er toe doet. Prospects willen weten over de voordelen van het kopen van u, want dat is wat hen zal dwingen om te blijven.
Houd de kopie licht en gemakkelijk te lezen, en spreek de taal van uw klanten. Evernote doet een groot werk van het aanbieden van voordelen op hun homepage op een manier die is overtuigend, visueel aangenaam, en gemakkelijk te begrijpen:
Social Proof
Social proof is een krachtige indicator van vertrouwen. Uw product of dienst kan de beste in de wereld, en het is oke om die claim te leggen — het is gewoon dat mensen je niet geloven, tenzij ze het horen van andere mensen, ook. En dat is precies wat sociaal bewijs doet.
voeg slechts een paar van uw beste (korte) citaten toe op de homepage, en link naar case studies indien van toepassing. Het toevoegen van een naam en foto geeft deze getuigenissen meer geloofwaardigheid. Lessonly nagels dit op hun homepage met gloeiende getuigenissen van de werkelijke klanten.
navigatie
het ontwerp en de inhoud van uw homepage navigatie kan het verschil betekenen tussen een website conversie en een bounce. Om bounce rate te verlagen, geef uw bezoekers een duidelijk pad naar de pagina ‘ s die ze nodig hebben direct vanaf de homepage. Maak het navigatiemenu zichtbaar aan de bovenkant van de pagina en organiseer de links in een hiërarchische structuur.
niemand kent uw website beter dan degenen die hebben geholpen met het ontwerpen ervan, dus zorg ervoor dat u gebruikerstests uitvoert om ervoor te zorgen dat het eenvoudig en intuïtief is voor bezoekers om te vinden wat ze zoeken op uw site. Voeg een zoekvak toe als je kunt. (Lees deze blogpost voor meer nuttige website navigatie tips.)
hier is een voorbeeld van een duidelijk, goed gestructureerd navigatieontwerp van Slim & husky ‘ s Pizza Beeria homepage:
Content Offer
om nog meer leads van uw homepage te genereren, beschikken over een echt geweldig content aanbod, zoals een whitepaper, ebook of guide. Mensen die misschien niet klaar zijn om te kopen, kunnen eerder een aanbod Downloaden dat hen meer informatie geeft over een onderwerp waarin ze geïnteresseerd zijn. Als je inspiratie nodig hebt, hier zijn verschillende soorten inhoud om uit te kiezen.
secundaire Calls-to-Action
voeg secundaire CTA ‘ s toe op uw homepage om extra conversiemogelijkheden te bieden voor prospects die niet geïnteresseerd zijn in uw primaire doelstelling. Zie ze als het noodplan: ze bieden een ander pad voor bezoekers die nog niet klaar zijn voor iets zo ‘ n hoge betrokkenheid als je vraagt.
terwijl uw primaire CTA ’s boven de vouw moeten staan, plaatst u secundaire CTA’ s Onder de vouw om bezoekers dingen te geven waarop ze kunnen klikken wanneer ze naar beneden scrollen. Bijvoorbeeld, onder de vouw op Spanx ‘ s homepage, vindt u drie, duidelijk gelabeld calls-to-action die mensen die hebben gescrold dat ver een paar meer opties om op te klikken. Deze secundaire CTA ‘ s zijn voor twee verschillende soorten conversies: een aan de linkerkant voor $20 uit en een andere, “shop now” om de online catalogus te verkennen.
Features
naast de voordelen, een lijst van enkele van uw belangrijkste functies. Dit geeft mensen meer inzicht in wat er wordt geleverd door uw producten en diensten. Nogmaals, houd de kopie licht en gemakkelijk te lezen. Dropbox for Business, bijvoorbeeld, schuwt niet weg van het pronken met een functies matrix recht op hun homepage onder de vouw.
Resources
opnieuw zijn de meeste bezoekers van uw website niet klaar om te kopen … nog. Voor mensen die op zoek zijn naar meer informatie, bieden een link naar een resource center waar ze relevante informatie kunnen bladeren. Niet alleen houdt dit ze langer op uw webpagina, maar het helpt u ook uw geloofwaardigheid als een thought leader in uw branche vast te stellen.
Lovesac voegt een resources-link toe aan de voettekst onder de vouw. Merk op hoe elk van deze secundaire CTA ‘ s betrekking hebben op meerdere fasen in de koopcyclus: een credit card link om klanten te helpen kopen hun meubels gemakkelijk, een stof staal gids voor degenen die nog steeds op zoek zijn naar de perfecte kleur voor het maken van een aankoop, en een online catalogus voor mensen die in de markt voor nieuwe meubels, maar zijn nog niet klaar om een aankoop te doen.
succesindicatoren
naast succesverhalen van klanten kunnen zowel awards als erkenning ook een goede eerste indruk geven. Is uw bedrijf een veelgeprezen restaurant? Ben je dit jaar verkozen tot beste nieuwe app? Laat uw homepage bezoekers weten van uw prestaties. Net als sociaal bewijs, het zal uw bedrijf meer geloofwaardigheid te geven aan degenen die je niet kennen.
op de startpagina van Calendly vind je bijvoorbeeld de namen van bekende organisaties die ze hebben herkend, zoals Gartner en Dropbox.
een Homepage die het bezoeken waard is
de homepage van uw site is de eerste introductie die elke bezoeker aan uw bedrijf zal hebben. Voordat ze make-up hun geest om een klant te worden, ze zullen uw homepage bekijken om een idee van wat je verkoopt krijgen, waarom dat belangrijk voor hen, en hoe ze kunnen profiteren van wat je te bieden hebt.
Maak een briljante eerste indruk met een homepage die de hierboven beschreven elementen bevat. En voor meer inspiratie, check out prachtige voorbeelden van homepages door het downloaden van de gratis lookbook hieronder.Noot van de redactie: Dit bericht is oorspronkelijk gepubliceerd in januari 2012 en is bijgewerkt op versheid, nauwkeurigheid en volledigheid.