”taitoksen yläpuolella.”
joillekin se on website real Estaten Graalin malja.
vuosien ajan yritykset katsoivat parhaaksi käytännöksi ahtaa verkkosivuilleen niin paljon tärkeää sisältöä kuin vain voivat.
he täyttivät sivun ensimmäiset 600 pikseliä linkeillä muille sivuille, ponnahdusmainoksilla, yhteydenottolomakkeilla ja muilla tiedoilla, joita he ajattelivat käyttäjien tarvitsevan nähtäväkseen heti saapuessaan.
heidän perustelunsa oli, että kukaan ei kääriydy, joten kaikki taitoksen alapuolella oleva sisältö on menetetty tapaus.
älypuhelinten tai tablettien tulo kuitenkin muutti käyttäjien selaustavat täysin.
rullaamisesta on tullut toinen luonto, ja käyttäjät ovat uteliaampia ja keskittyvät tekemään omaa tutkimustaan yrityksestä ennen kuin ovat valmiita ostamaan.
nämä muutokset ovat saaneet monet suunnittelijat ja UX-asiantuntijat väittelemään siitä, kuinka relevantti taitos oikeastaan on ja pitääkö meidän todella ahtaa kaikki sisältömme sinne.
ensin What the heck Is ” Above the Fold?”
Jos se oli ensimmäinen ajatuksesi, kun aloit lukea tätä blogia; älä huoli, et ole yksin.
”above the fold” on käsite, joka juontaa juurensa julkaisemisen alkuaikoihin. Erityisesti aikakaudella, jolloin sanomalehdet olivat useimpien ihmisten tärkein päivittäisten uutisten lähde.
kun sanomalehtiä oli esillä katukojuilla, ne pinottiin ja taitettiin aina kahtia, joten ohikulkijat pystyivät näkemään vain etusivun yläosan.
kustantajat ymmärsivät nopeasti, että jos he haluaisivat myydä lehtiä, heidän olisi laitettava kaikki tärkeimmät uutisotsikkonsa ja eloisat kuvansa tällä alalla taitoksen yläpuolelle houkutellakseen asiakkaita.
ajatus ”above the foldista” on sittemmin kulkeutunut digitaaliseen maailmaan, jossa foldilla tarkoitetaan sisältöä, joka näkyy sivun yläreunassa ilman, että kävijä tarvitsee vieritystä.
onko ”taitoksen yläpuolella” siis vielä merkitystä?
yksinkertainen vastaus on kyllä, mutta ei samoista syistä kuin aikoinaan.
kun on kyse verkkosivustosi suunnittelusta, sinun on kiinnitettävä erityistä huomiota taitoksen yläpuolelle, mutta vain siinä mielessä, että sivun yläreunan pitäisi selittää selkeästi arvolupauksesi ja myös houkutella käyttäjiä jatkamaan vierittämistä.
taitos Kyllä asettaa näyttämön sivun muulle sisällölle ja asettaa odotukset siitä, mitä käyttäjät voivat odottaa löytävänsä sivulta, mutta ajatus siitä, että meidän on sovitettava mahdollisimman paljon sisältöä tälle alueelle, koska se on ainoa sisältö, jota ihmiset lukevat, on vanhentunut suunnittelukäytäntö.
tässä muutamia syitä, miksi:
vieritys on toinen luonne nykykäyttäjille
yritykset ajattelivat ennen, että käyttäjät eivät lukisi taitoksen alla olevaa sisältöä, koska he eivät tuntisi vieritystä tarpeeksi eivätkä siksi osaisi vierittää sivua alaspäin lukeakseen lisää.
kun joku lukee tätä artikkelia juuri nyt, tiedät varmasti jo, kuinka valheellista se on, mutta olemme myös nähneet ton tutkimuksia, jotka kumoavat tämän ajatuksen.
Huge, luova toimisto Brooklyn, NY, teki mielenkiintoisen käyttäjätestin, jossa he testasivat neljä eri versiota suunnittelusta. Mukana olleet versiot:
- ohjauskuva, jossa ei ole visuaalisia vihjeitä, jotka voisivat vierittää taitoksen alapuolelle.
- vieritysnuoli, joka kehottaa käyttäjiä vierittämään alaspäin.
- lyhyt kuva, jossa käyttäjien oli vieritettävä nähdäksesi yläpuolisen sisällön kokonaisuudessaan.
- animoitu kuva, jossa on liikkuva elementti, joka johdattaa katsojat taitoksen alapuolelle.
Image Courtesy of Huge
tulokset osoittivat, että lähes kaikki osallistujat vierittivät jokaisesta variaatiosta riippumatta.
tilastot ovat vielä hallitsevampia mobiilissa. Eräässä tutkimuksessa havaittiin, että mobiilissa puolet käyttäjistä aloittaa vierityksen 10 sekunnissa ja 90 prosenttia 14 sekunnissa.
jotkut nykypäivän suosituimmista sivustoista, kuten Amazon, Facebook ja Twitter, ovat hyviä reaalimaailman esimerkkejä siitä, että käyttäjät vierittävät luonnollisesti. Heidän koko kokemuksensa perustuu uutissivuston selaamiseen.
Viimeksi kun kävit jollakin näistä sivustoista, pysähdyitkö miettimään, tarvitseeko sinun vierittää?
eri näyttökokoja on liian monta, jotta ”taitoksen”tarkka ennustaminen
miettisi, kuinka monta eri laitetta käytät joka päivä.
on älypuhelimia, älykelloja, tabletteja, kannettavia tietokoneita.
kun eri laitteita on niin paljon, muuttujia on aivan liian monta, jotta niitä voisi ottaa huomioon, kun yrittää ennustaa, missä varsinainen taitos on verkkosivulla.
yllä oleva esimerkki näyttää, mitä eri alueita sivuston ”taitos” voi laskeutua riippuen siitä, millä laitteella sivustoa tarkastellaan.
jokaisella laitteella on erilainen näytön koko, katselusuunta ja pikselitiheys.
yrittää suunnitella kaikkia näitä kokoja kerralla on taistelu, jota ei voi voittaa.
digitaalisen tuotteen suunnittelija Luke Wroblewski tutki Android-kännyköiden eri näyttökokoja. Hän löysi lähes 4000 erilaista taittopistettä – ja se on vain yhdenlainen laite!
tämä tarkoittaa, että vaikka luulet hallitsevasi yläpuolisen esityksesi jokaisella laitteella, siitä ei ole takeita.
on yksinkertaisesti epärealistista odottaa, että jokainen ihminen maailmassa (jossa on erilaiset asetukset, tekstikoot ja käyttöjärjestelmät, näkee asiat samalla tavalla kuin testeissä.
ihmisten ostotapa on muuttunut
ihmisten ostotapa on nykyään täysin erilainen kuin takavuosina.
tuoreessa blogikirjoituksessaan Impactin oma Liz Murphy sanoi: ”saatamme elää maailmassa, jossa ostajat tekevät parhaansa välttääkseen puhumasta jonkun kanssa myyntityössä…”
hänen sitaattinsa tärkein takeaway on, että ihmiset ovat keskittyneempiä sitoutumaan brändiin ja kouluttautumaan. He ovat valmiita ja odottavat viettää aikaa vieritys ja imevää tietoa sivustossasi auttaa heitä arvioimaan, jos olet oikea ottelu heille.
on hyvin harvinaista, että he saapuvat sivustollesi ja odottavat näkevänsä tarkalleen, mitä he etsivät heti, kun sivu latautuu.
mihin pitäisi oikeasti keskittyä?
päivän päätteeksi taitos on oikeastaan vain ohjenuora, joka kannattaa pitää mielessä sivua suunnitellessa.
sen päätarkoituksena on muistuttaa sinua siitä, että sivun yläreunan tulisi asettaa näyttämö muulle sisällölle ja samalla herättää jonkun huomio.
suunnittelu kaikkien tärkeimpien linkkien kanssa taitoksen yläpuolella ei takaa korkeampia muuntokursseja. Itse asiassa se johtaa todennäköisemmin sotkua ja käyttäjät eivät tiedä, mistä etsiä ensin.
sen sijaan, että täyttäisit liikaa sivun yläreunaa, yritä keskittyä joihinkin seuraavista asioista:
oikean tiedon asettaminen taitoksen yläpuolelle
sivun muuntokurssit eivät riipu siitä, ovatko Call-to-action (CTAs) taitoksen ylä-vai alapuolella.
tärkeää on sijoittaa CTA: t alueelle, jossa ihmiset tuntevat olevansa valmiita muuntamaan ja varmistaa, että sisältö ympärillä kannustaa tähän toimintaan.
Neil Patelin mukaan ”korkeammilla muuntokursseilla ei ole mitään tekemistä sen kanssa, onko nappi taitoksen yläpuolella, ja kaikki liittyy siihen, onko nappi oikean hyvän kopiomäärän alapuolella.”
kun tämä on sanottu, täytyy miettiä, missä näkymiä on ostajan matkassa ja kuinka koulutettuja he ovat yrityksessäsi.
esimerkiksi prospektit, jotka jo tietävät mitä tarjoat ja tietävät haluavansa työskennellä kanssasi, CTA, taitoksen ylä – tai alapuolella todennäköisesti kääntyisi todella hyvin.
mutta kun se tulee joku, joka on uusi yrityksesi, he tarvitsevat enemmän koulutusta, joten se on epätodennäköistä näet vastaus näkyvä CTA yläpuolella kansi.
näkisit todennäköisesti korkeammat muuntokurssit, jos asettaisit saman CTA: n selkeän arvolupauksen ja jonkin hyvin kirjoitetun kopion jälkeen, jossa selittäisit palvelusi.
Vältä ”Valepohjien” luomista sivustollesi
valepohja on, kun luot verkkosivuston osion, joka antaa käyttäjälle illuusion siitä, että hän on sivun alareunassa, vaikka osion alla on vielä enemmän tietoa.
katso alla oleva esimerkki. Doordashin hero-osio päättyy selaimen alaosaan, mikä saa käyttäjät tuntemaan, ettei tämän osion alla ole enää sisältöä.
helpoin tapa välttää valepohjan antaminen ihmisille on lisätä hienovaraisia visuaalisia vihjeitä, jotta käyttäjät tietävät, että luettavaa on enemmän.
alla olevassa esimerkissä huomaat, että Zenefits sisältää pienen rivin tekstiä, jossa lukee ”tutki Zenefits” alaspäin osoittavalla nuolella. Tämä hienovarainen cue avulla käyttäjät tietävät siellä on enemmän nähtävää vieritys.
Thinking Top Down
So, palatakseni alkuperäiseen kysymykseen: onko ”above the fold” vielä relevantti? Ehdottomasti se on, mutta syyt, miksi on kehittynyt ja muuttunut siitä, kun termiä alun perin alettiin käyttää.
taitos on tärkeä muun sivun odotusten asettamiseksi, mutta mahdollisimman monen linkin päntääminen tälle alueelle ei takaa parempia tuloksia.
sen sijaan, sinun todella täytyy keskittyä kohteita, kuten asettamalla CTAs sopivilla alueilla, mukaan lukien oikea kopio tukea, ja ottaen huomioon joitakin UX periaatteita, kuten ei luoda ”vääriä pohjat” käyttäjille.
kaiken kaikkiaan haluat kiinnittää käyttäjäsi huomion laadukkaalla sisällöllä ja designilla, joka korostaa sitä, joten he haluavat jäädä vierittämään.
vielä sanomalehtipäivinä kirjoittajat eivät olettaneet, että mitään muuta ei luettaisi.
heillä vain piti olla juuri sen verran, että he nappasivat huomion. Sivustosi ei ole erilainen.