Dagarna "ovanför veckan" är över. Långa rullning och oändliga rullningsplatser blir allt mer populära på senare tid, och det är ingen slump att denna teknik överskrider bra till mobila enheter. Den ökade användningen av mobila skärmar har definitivt spelat en nyckelroll i den omfattande acceptansen av långrullteknik: Ju mindre skärmen desto längre rullar.

Lång rulla öppnar många nya dörrar till designers. Emellertid har detta mönster sina egna nackdelar. Det kräver att designers lägger stor vikt vid innehåll, navigering och animering.

Här är 5 tips att följa för att se till att din långa rullning uppfyller användarens förväntningar.

1. Ge intressant innehåll direkt från början

Trots det faktum att människor vanligtvis börja rulla så snart deras sida laddas, innehållet överst, synlig del av skärmen är mycket viktigt. Vad som visas högst upp på sidan skapar ett första intryck och ställer in en kvalitetsförväntning för dina användare. Användare rullar, men bara om vad de ser när de går in på sidan är lovande nog.

För att se till att folk rullar, måste du tillhandahålla innehåll som håller dina besökare intresserade. Lägg sålunda ditt mest övertygande innehåll längst upp på sidan:

  • Ge intressanta fakta (fakta som lockar besökare och hålla uppmärksamheten)
  • Använd engagerande bilder (användare uppmärksamma bilder och bilder som innehåller relevant information)

2. Ge användarna en visuell Cue

Ibland är det bästa sättet att få användare att bläddra att fråga dem direkt. Helt enkelt informera användare att det mesta av innehållet är tillgängligt under veckan. En subtil visuell kue, som en pil som pekar på skärmen eller en text "scroll down", kan informera användare om att det mesta av innehållet finns nedan.

1

Pil pekar på skärmen informerar användarna att det mesta av innehållet kommer att läggas ut nedan.

3. Håll navigeringsalternativen permanent synliga

Navigering är en sak eller en del av användarupplevelsen av en webbplats. En av de största riskerna med att använda lång scrolling i din design är en möjlighet till användarorientering. Om navigeringsfältet förlorar synligheten när användarna rullar ner, måste de bläddra hela vägen när de är djupt inuti sidan. Vanligtvis förvirrar detta beteende och frustrerar användarna.

Den uppenbara lösningen för detta problem är att använda en klibbig navigationsmeny som visar aktuell plats och förblir alltid på skärmen i samma position.

Ett exempel på ständigt synlig klibbig navigering.

Endast mobila enheter: Eftersom mobilskärmen är mycket mindre än skrivbordsskärmen kan en synlig navigeringsfält ta upp en relativt stor del av skärmen. Ett sätt att lösa problemet med ett litet skärmfält är att dölja en navigeringsfält när användarna bläddrar för nytt innehåll och gör det synligt när användarna drar ner för att komma tillbaka till toppen.

4. Använd funktionell animering för att engagera besökare

Kreativa effekter som parallaxrullning och rullningsaktiverade animeringar kan involvera användare att bläddra mer. De bläddrar till något roligare och får användaren att undra "vad kommer hända nästa?"

Överväg att bryta upp din sida i rullbara "bitar". Inom varje bit kan du presentera innehållet genom kreativa animeringar. När användarna bläddrar överför animeringar dem till nästa skärm medan du skapar en sökväg med innehåll som ska följas.

Parallax är en annan populär animerad effekt som kan förbättra rullningsupplevelsen. Parallax-effekten skapar en illusion av djup och nedsänkning genom att bakgrundsbilden flyttas långsammare än innehållet i förgrunden. När din webbplats vill berätta en historia på ett smidigt, linjärt sätt kan lång scrollning i parallaxeffekt skapa en helt nedsänkt surfupplevelse.

5. Undvik att rulle kapning

Webbplatser som implementerar rulla kapring tar kontroll över rullningen och åsidosätter en grundläggande funktion i webbläsaren. Rullning av kapning är dålig eftersom användaren inte längre har full kontroll över sidrullen och kan inte förutsäga sitt beteende. Användarnas förväntningar på en webbplatss rullningsinteraktion ska inte förstöras för berättande erfarenhetens skull.

6

Apple använder scroll kapning på deras Mac Pro-sida.

Slutsats

Lång rulla kan skapa en helt nedsänkt surfupplevelse. Det är helt möjligt att göra en resa så trevlig som destinationen. När användare gillar innehållet på din webbplats och hittar användargränssnittet intuitivt, så kommer de inte att tänka på längden på rullningen.