Det är dags att prata om första skärmdesignen. Den första skärmen är den första glimten som en användare kommer in på din webbplats. Det är allt ovanför rullningen, om användaren åtkomst till en webbplats från ett skrivbord, en tablett eller en mobilenhet.
Den information du innehåller på den här första skärmen? är nyckeln till webbsucces. Designen kan locka och hålla användare klickande eller tvinga dem att navigera bort från sidan. Vad måste finnas på skärmen innan användarna börjar rulla? Låt oss ta en titt.
1. Skapa en distinkt första skärm
Det börjar med ett första intryck. Din webbplats ska skapa en med effekt.
Gå stort med en bild - bild, video eller illustration - att fånga publiken direkt. Bilden ska vara något som folk inte kan sluta titta på. Och det borde vara helt ditt och till skillnad från andra webbplatser.
Koppla ihop den här bilden med några nyckelord för att berätta för användarna varför de är där och vad din webbplats har att erbjuda. (Det här är din bästa chans att försäkra dig om att du klickar på din webbplats.)
Här är den sak som drar allt ihop: Den första skärmen måste passa exakt på den första skärmen. Innehållet måste anpassas till enheten så att hela bilden och all tillhörande kopia är tydligt synlig utan en enda rullning.
2. Navigation ska vara intuitiv
Borta är de dagar då navigeringen måste köra sidans höjd i ett sidofält eller överst på skärmen. Dolda och pop-out navigeringsstilar har blivit så populära (tack delvis till mobilen) att det är acceptabelt för alla webbdesigner.
Men göm inte navigeringen eller gör det svårt att använda. Gilla det eller inte, har navigeringsmenyn för hamburger stil blivit den mest dominerande användningen för dold navigering. Användare har lärt sig att arbeta med det, och kan enkelt hitta saker på sidor.
Se till att du placerar din staplade ikon på en plats som är lätt att hitta - du kan göra den större än en typisk ikon - och se till att navigeringen är helt funktionell med det klicket. Uve, ovanför, gör ett bra jobb med detta med en framträdande hamburger menyikon som expanderar till en helskärmslista med menyalternativ. Och bäst av allt behöver användarna inte gissa hur man använder den.
3. Skapa en kontaktpunkt
När du arbetar på en enda duk, som den första skärmen, är det viktigt att skapa ett enda fokus eller meddelande. Användare har kommit till din webbplats, avsiktligt eller tillfälligt - och behöver veta vad det handlar om.
Ett visuellt koncept kan hjälpa användarna att skapa den ideen om vad och vem du är. Detta kan åstadkommas med bilder eller text på ett antal olika sätt.
Medan komplexa stilar kan fungera, börja med att tänka enkelt. Minimalismen är både trendig och ett effektivt sätt att hjälpa till att förmedla information.
4. Skriv kopia med syftet
Tänk på den första skärmen som ett bokomslag, inte den första sidan av en roman.
Det bör innehålla tillräckligt mycket kopia för att hjälpa användarna att engagera sig. Ett enkelt rubrik och ett litet kopieringsblock är vanligtvis tillräckligt för att göra detta. Även om orden är få, kan detta vara en process som tar mycket arbete. Att skriva kortfattat, tydlig kopia kan vara utmanande.
Tänk på dina webbplatsmål som riktlinje. Varför är användarna här? Vad vill du att dom ska göra? Använd kopian för att skapa den anslutningen och börja berätta för din historia. Kom ihåg att sälja fördelarna med din webbplats till användaren.
5. Ger användare något att göra
Även om webbplatser erbjuder tydliga visuella upplevelser, måste de också ge en anledning till att användarna håller sig kvar. Din första skärm måste ge användarna något att göra.
Åtgärderna kan innefatta:
- Fylla i ett formulär, till exempel att tillhandahålla en e-postadress
- Spelar ett spel
- Dela på sociala medier
- Bläddring av tågobjekt till salu
- Kommenterar eller engagerar sig med innehållet
- Titta på en film eller ett bildspel
Inte bara bör din första skärm inkludera en av dessa åtgärder, det borde vara helt klart vad handlingen är och vad användaren ska göra. Designen bör locka dem tillräckligt för att de känner sig tvungna att göra det.
Webbplatsen för The Big Short-film, ovan, ger användarna massor av saker att göra. Videoklippen är bara nog att göra dig intresserad av filmen, och det finns en knapp för att titta på släpvagnen. Intresserad av denna sanna historia? Det finns en knapp för att träffa experterna. Har du redan sett det och vill dela med dig av dina tankar? Det finns sociala medier knappar. Det finns många sätt att interagera med webbplatsen från början.
6. Gör plats för branding
En webbplats kommer inte göra mycket bra om du inte vet vem det tillhör. Den första skärmen ska innehålla åtminstone en logotyp eller en anslutning till varumärket bakom webbplatsen.
Ett varumärke eller företagsnamn skapar legitimitet och trovärdighet. Det gör att webbplatsen verkar mer? Riktig.? (Detta är särskilt viktigt för webbplatser som innehåller någon typ av finansiella eller personliga transaktioner, så att användarna vet vem som får informationen.)
Större märken kan komma undan med mindre branding på sina första skärmar eftersom det är troligt att många redan känner till dem. (Vem vet du inte skulle erkänna de guldbågar som har kommit att symbolisera McDonald's?) För mindre märken är det tydligt att visa en logotyp och stil viktigt för att skapa en identitet som användare kan associera med och lita på.
7. Minimera distraktioner
Ge inte användarna för mycket att titta på eller hantera på den första skärmen. Det ska vara enkelt, strömlinjeformat och fokuserat.
Om du har mycket innehåll, placera det ut på flera skärmar. (Detta kan främja engagemang och förhindra en rörig eller oorganiserad webbplatsstruktur.)
Melanie DaVeid gör ett bra jobb med en enkel estetik som gör att du är intresserad av sitt andra arbete. Med enkla inslag av animering, färg och vacker bokstäver skapar den första skärmen en tydlig känsla, fokus och handlingssätt för användarna.
Slutsats
Medan rullningen kommer tillbaka till mode har sättet vi designar för det ändrats. De bästa webbdesignerna använder responsiva design- och rullningsfunktioner (till exempel parallax) för att skapa en skärmbaserad upplevelse för användarna.
Och den första skärmen är den viktigaste. Se till att skapa en intressant, läsbar och tydlig bild för att få användare till din webbplats.