toimii yrityksesi virtuaalinen etuovi, Tämä sivu on vastuussa piirustus suurin osa sivuston liikennettä. Silti, vaikka sen näkyvyyttä, monet yritykset kamppailevat optimoida sitä oikein.

näet, että Kotisivu tarvitsee paljon hattuja. Sen sijaan, että sitä käsiteltäisiin yhden tietyn toiminnon ympärille rakennettuna aloitussivuna, se olisi suunniteltava palvelemaan erilaisia, eri alkuperää olevia yleisöjä. Ja jotta se voidaan tehdä tehokkaasti, se on rakennettava määrätietoisesti. Toisin sanoen, sinun täytyy sisällyttää elementtejä, jotka houkuttelevat liikennettä, kouluttaa kävijöitä, ja kutsua tuloksia.

jos haluat parantaa kotisivusi suorituskykyä, tutustu näihin elementteihin, joita jokaisella kotisivulla on oltava.

Ilmaiseksi: 77 esimerkkejä loistava Web Design

12 kriittiset elementit jokaisella verkkosivuston kotisivulla on oltava

Tallenna

12 verkkosivuston kotisivujen kriittiset elementit infografiikka

Tallenna

Jaa tämä kuva Sivustossasi

mitä sinun tulisi sisällyttää verkkosivustosi Etusivusuunnitteluun

Otsikko

kolmen sekunnin kuluessa verkkosivuston on kerrottava kävijöille, mitä yrityksellä on tarjottavanaan. Siinä tulee otsikkosi. Se voi olla vain muutamia sanoja, mutta se on yksi tärkeimmistä kappaletta kopioida sivustossasi.

monet ihmiset saattavat käydä sivuillasi, ja sinun on vaikea löytää muutama sana, jotka osuvat kotiin kaikille. Kirjoita sen sijaan otsikkosi kohdentamaan kolmannes niistä ihmisistä, jotka ovat todennäköisimmin tyytyväisiä tuotteeseesi.

pidä itse otsikko selkeänä ja yksinkertaisena. Dropboxin otsikko on loistava esimerkki: ”kaikki mitä tarvitset työhön, kaikki yhdessä paikassa.”Se on yksinkertainen, mutta tehokas-ei tarvitse purkaa ammattikieltä selvittää, mitä Dropbox todella tekee.

Dropboxin verkkosivujen kotisivut

alaotsikko

alaotsikon tulisi täydentää otsikkoa tarjoamalla lyhyt kuvaus siitä, mitä teet tai mitä tarjoat. Tämä voidaan tehdä tehokkaasti nollaamalla yhteinen kipupiste, että tuote tai palvelu ratkaisee.

tässä esimerkki Mirrorin hienosta alaotsikosta: ”Hiding in plain sight.”Se on peilisalin tärkein myyntivaltti.”: Se on täysi at-home kuntosali, personal trainer, ja workout suunnitelma kaikki mukavasti kodin ilman vie arvokasta neliömateriaalia laitteiden kanssa.Mirror-sivuston kotisivujen alaotsikko, jossa lukee piilossa näkyvillä

optimoidaksesi otsikkosi mobiililaitteille, käytä suurempia fontteja antaaksesi kävijöille paremman kokemuksen. Pienet fontit voivat pakottaa mobiilikävijät nipistämään ja zoomaamaan voidakseen lukea ja olla vuorovaikutuksessa sivustosi sisällön kanssa. Neuvomme? Käytä sivun muokkaimen otsikkoasetuksia. H1-otsikot sopivat mainiosti sivun otsikoihin-sivulla pitäisi olla vain yksi H1. Alaotsikoiden tulee noudattaa hierarkian järjestystä H2, H3 … H6 ja niin edelleen. Voit olla useita näistä otsikoista, vain varmista, että ne ovat kunnossa. Et esimerkiksi halua hypätä H1: stä H3: een — valitse sen sijaan H2.

Primary Call-to-Action

kotisivusi tavoitteena on pakottaa kävijät kaivautumaan syvemmälle verkkosivustoosi ja siirtämään heidät suppiloon. Sisällytä kaksi-kolme calls-to-action yläpuolelle, jotka ohjaavat ihmisiä ostosyklin eri vaiheisiin-ja aseta heidät paikkoihin, jotka on helppo löytää.

näiden Ktojen tulisi olla visuaalisesti huomiota herättäviä, ihanteellisesti sellaisia värejä, jotka ovat ristiriidassa kotisivusi värimaailman kanssa, mutta sopivat silti kokonaisuuteen. Pidä kopio lyhyenä-enintään viisi sanaa-ja toimintapainotteisena, joten se pakottaa kävijät klikkaamaan mitä tahansa tarjoat. Esimerkkejä CTA copy ovat ”Rekisteröidy”,” tee tapaaminen, ”tai” kokeile sitä ilmaiseksi.”

Afterschool HQ: n verkkosivuilla on kaksi ctaa, jotka molemmat on suunnattu ohjelmajohtajille, jotka ovat kiinnostuneita mainostamaan koulun jälkeisiä ohjelmiaan sivuston perheille. Huomautus alla enää CTA ”Luo ilmainen profiili” antaa kävijöille tönäisy he tarvitsevat luoda tilin — ensimmäinen askel tulossa Afterschool HQ toimittaja.

Kannatuskuva

useimmat ihmiset ovat visuaalisia. Varmista, että käytät kuvaa (tai jopa lyhyttä videota), joka osoittaa selvästi, mitä tarjoat. Käytä kuvia, jotka vangitsevat tunteita, ohjaavat toimintaa ja kertovat visuaalisesti tarinan, josta kirjoitat.

voit optimoida kuviasi mobiilikäyttäjille käyttämällä korkealaatuisia kuvia, joiden tiedostokoko on pienentynyt. (HubSpot-asiakkaiden ei tarvitse huolehtia tästä, sillä HubSpot-ohjelmistoon ladatut kuvat pakataan automaattisesti. Muuten työkalut kuten TinyPNG tepsivät.) Myös, aina lisätä alt tekstiä kuvia, jotta ne helpommin kävijöitä, jotka käyttävät näytön lukijoita ja ottaa SEO pyrkimyksiä jopa lovi.

4 Rivers Smokehousen kotisivu on loistava esimerkki emotionaalisesta kuvastosta: se sisältää sarjan lyhyitä, teräväpiirtoisia ja suunsoittoisia videoita, jotka toistuvatkin silmukassa yksinkertaisen otsikon, alaotsikon ja ensisijaisen CTA: n takana:

4 rivers smokehousen kotisivuilla oli kuva juustohampurilaisesta

hyödyt

ei ole vain tärkeää kuvata, mitä teet, vaan miksi tekemälläsi on merkitystä. Prospects haluavat tietää eduista ostaa sinulta, koska se on mitä pakottaa heidät pysymään.

pidä kopio kevyenä ja helppolukuisena ja puhu asiakkaiden kieltä. Evernote tekee hienoa työtä listatessaan etuja kotisivuillaan tavalla, joka on vakuuttava, visuaalisesti miellyttävä ja helppo ymmärtää:

Evernoten kotisivujen edut

sosiaalinen todiste

sosiaalinen todiste on vahva luottamuksen mittari. Tuotteesi tai palvelusi voisi olla maailman paras, ja se on okei asettaa, että väite-se on vain, että ihmiset eivät ehkä usko sinua, elleivät he kuule sitä muilta ihmisiltä, liian. Juuri niin sosiaalinen todistuskin tekee.

Sisällytä kotisivulle vain muutama paras (lyhyt) lainaus, ja linkki tapaustutkimuksiin, jos mahdollista. Nimen ja kuvan lisääminen antaa näille suositteluille lisää uskottavuutta. Vähemmän vain nauloja tämän kotisivuillaan hehkuva suosittelut todellisia asiakkaita.

 vähemmän vain verkkosivujen kotisivujen suosittelut ja arvostelut

navigointi

kotisivujen navigoinnin muotoilu ja sisältö voivat merkitä eroa verkkosivujen muunnoksen ja bounce: n välillä. Jos haluat vähentää pomppunopeutta, anna kävijöille selkeä polku sivuille, joita he tarvitsevat suoraan kotisivulta. Tee navigointivalikko näkyväksi sivun yläreunassa ja järjestä linkit hierarkkiseen rakenteeseen.

kukaan ei tunne verkkosivustoasi paremmin kuin ne, jotka auttoivat sen suunnittelussa, joten muista suorittaa käyttäjätestit varmistaaksesi, että vierailijoiden on helppo ja intuitiivinen löytää sivustoltasi se, mitä he etsivät. Sisällytä hakukenttään, jos voit. (Lue tämä blogikirjoitus lisää hyödyllisiä verkkosivuilla navigointi vinkkejä.)

tässä esimerkki selkeästä, hyvin jäsennellystä suunnistussuunnittelusta Slim & Husky ’ s Pizza Beerian kotisivuilta:

Slim and huskys-sivuston kotisivunavigointi

Sisältötarjous

jos haluat luoda vielä enemmän johtolankoja kotisivuiltasi, tarjoa todella hieno sisältötarjous, kuten whitepaper, ebook tai opas. Ihmiset, jotka eivät ehkä ole valmiita ostamaan, saattavat mieluummin ladata tarjouksen, joka antaa heille enemmän tietoa aiheesta, josta he ovat kiinnostuneita. Jos tarvitset inspiraatiota, tässä on useita eri sisältötyyppejä, joista valita.

toissijaiset puhelut-To-Action

Sisällytä toissijaiset Ctat kotisivullesi tarjotaksesi lisää muuntamismahdollisuuksia niille, jotka eivät ole kiinnostuneita ensisijaisesta tavoitteestasi. Ajattele niitä kuin varasuunnitelma: ne tarjoavat toisen polun kävijöille, jotka eivät ole vielä valmiita johonkin niin korkean sitoutumisen kuin pyydät.

vaikka ensisijaisten Ktasiesi pitäisi olla taitoksen yläpuolella, aseta toissijaiset Ktasi taitoksen alapuolelle, jotta vierailijat voivat klikata asioita, kun he vierittävät alaspäin. Esimerkiksi, alla fold Spanx kotisivu, löydät kolme, selvästi merkitty calls-to-action, jotka antavat ihmisille, jotka ovat vierittäneet niin pitkälle muutamia vaihtoehtoja klikkaa. Nämä toissijainen CTA ovat kaksi erilaista muunnoksia: yksi vasemmalla $ 20 pois ja toinen, ”shop nyt” tutkia online-luettelo.

Spanx website homepage secondary CTAs

Features

addition to benefits, listaa joitakin keskeisiä ominaisuuksiasi. Tämä antaa ihmisille enemmän ymmärrystä siitä, mitä tuotteet ja palvelut tarjoavat. Pidä kopio jälleen kevyenä ja helppolukuisena. Dropbox for Business, esimerkiksi, ei kaihda keuliminen ominaisuuksia matriisi suoraan niiden Kotisivulla alla kertaiseksi.

dropbox for business website kotisivun ominaisuudet

resurssit

jälleen, useimmat sivustosi kävijät eivät ole valmiita ostamaan … vielä. Ihmisille, jotka etsivät lisätietoja, tarjota linkki resurssikeskus, jossa he voivat selata asiaankuuluvaa tietoa. Ei vain tämä pitää ne verkkosivun pidempään, mutta se myös auttaa sinua luomaan uskottavuutta ajatusjohtaja oman teollisuuden.

Lovesac lisää resurssilinkin taitoksen alapuolella olevaan alatunnisteeseen. Huomaa, miten kukin näistä toissijainen CTA kattaa useita vaiheita osto sykli: luottokortin linkki auttaa asiakkaita ostamaan huonekaluja helposti, Kangas swatch opas niille, jotka vielä etsivät täydellinen väri ennen ostoa, ja online-luettelo ihmisille, jotka ovat markkinoilla uusia huonekaluja, mutta eivät ole vielä valmiita tekemään ostoksen.

lovesacin verkkosivujen kotisivut, joissa on resurssit ja ctat alatunnisteessa

Menestysindikaattorit

asiakkaiden menestystarinoiden lisäksi sekä palkinnot että tunnustukset voivat myös antaa hyvän ensivaikutelman. Onko yrityksesi kriitikoiden ylistämä ravintola? Äänestettiinkö sinut parhaaksi uutuussovellukseksi tänä vuonna? Kerro kotisivusi kävijöille saavutuksistasi. Kuten sosiaalinen todiste, se antaa yrityksesi enemmän uskottavuutta niille, jotka eivät tunne sinua.

Calendlyn kotisivuilta löytyy esimerkiksi heidät tunnistaneiden tunnettujen organisaatioiden nimiä, kuten Gartner ja Dropbox.

Calendly website homepage

A Homepage worthy Visiting

the homepage of your site is the first introduction each visitor will have to your business. Ennen kuin he päättävät ryhtyä asiakkaaksi, he tarkistavat kotisivusi saadakseen käsityksen siitä, mitä myyt, miksi sillä on heille merkitystä ja miten he voivat hyötyä siitä, mitä sinulla on tarjottavana.

tee loistava ensivaikutelma kotisivulla, joka sisältää edellä mainitut elementit. Ja lisää inspiraatiota, tutustu upeita esimerkkejä kotisivut lataamalla ilmainen lookbook alla.

päätoimittajan huomautus: Tämä kirjoitus julkaistiin alun perin tammikuussa 2012 ja sitä on päivitetty tuoreuden, tarkkuuden ja kattavuuden vuoksi.

examples of brilliant homepage, blog, and landing page design

Vastaa

Sähköpostiosoitettasi ei julkaista.