Tag Archives: webbdesign

Instruktioner på webben – fel spår!

Om man känner att man måste ge mycket instruktioner på en webbsida för att besökaren ska förstå vad man vill den ska ta till sig eller göra är man inte på rätt spår. Då är det dags att göra om design och struktur.

Några av många gyllene regler för webbstruktur om man läser Steve Krugs Don’t Make Me Think är just orden – få mig inte att tänka som besökare på din sida. Till detta följer att du som webbredaktör ansvarar för att ditt innehåll ska vara lättillgängligt: gör dig av med hälften av alla ord på din sida och gör sedan dig av med ytterligare hälften av dessa. Då får besökaren översyn och kan lättare ta till sig vad som händer på sidan eller vad den ska göra där rentav.

Därför ska exempelvis instruktioner på webben för att besökare ska förstå hur de ska fylla i formulär, anmälan eller lämna personuppgifter anses som överflödiga så långt det går. Det ska vara logiskt för besökaren ändå. Alltså, om man skriver en inledning à la en prolog för en bok på sin webbsida för var eller vad besökaren ska fylla i är man på fel spår. Allt ska kunna begripas ändå.

Krugs ord var nämligen precis de jag tänkte på då jag såg en inloggningssida på studentkortet.se. Där har man tydligen känt sig tvingad att skissa upp var besökaren ska fylla i sitt kortnummer och lösen beroende på om man vill logga in som redan registrerad eller vill registrera sitt kort för att kunna gå lös på inloggningen direkt nästa gång. Varför röra till det? Varför ha två typer av design och typsnitt så nära inpå varandra?

Varför inte istället hålla struktur och design ren med en ruta med frågan “Vad vill du göra?” följt av en drop-down meny med: “Logga in” och valet “Registrera kort”. Därefter skulle respektive formulär/log in-ruta dyka upp. Ja, det kan förstås tyckas tråkigt med extra klick här och att besökaren måste tänka till inför detta valet. Men jag tror hellre på det snabbare valet än att konstruktionen som den ser ut nu (april 2011) är enkel att ta till sig.

www.studentkortet.se:

studentkortet.se

Blandad design och faktiskt för mycket att ta till sig för log in respektive registrering av kort:

Logga in eller registrera ditt kort?

Leave a comment

Filed under Webbredaktörsroll

Tips på bas till landningssidor

En landningssida för en webbkampanj är inte alltid lätt att konstruera utan att riskera att det blir för mycket på den. Utöver design, färgval och layout ska du ju också tänka på din rubrik, ingress, länkar, text och en himla massa annat som ska få besökaren att ta sig vidare för att det ska ge avkastning i konverteringssiffror. Konstruera den därför med omsorg.

Några enkla konkreta tips för att du ska få en bra bas för din landningssida för att komma nära önskvärda konverteringssiffror finns att hämta hos Formstack – The Anatomy of a Perfect Landing Page. Visuellt, koncist och förklarande!

Leave a comment

Filed under Webbredaktörsroll

Webbdesign och navigation

Designer och navigationskännare på webben. Omaka par? Sällan lätta att jämka ihop nämligen då det kan finnas många viljor och mycket tyckande kring design i en organisation. Men vi läser eller rättare sagt scannar inte av en webbsida på samma sätt som vi läser av en broschyr i handen och det finns många studier väl värda att lyssna till om detta. För helt ärligt, då du funderar på hur din webbsida ska se ut bör du se till konventioner, eller hur? För varför uppfinna hjulet om det redan finns?

Steve Krug säger i Don’t Make Me Think att en besökare inte ska behöva tänka efter vart den ska klicka vidare för att lösa sin uppgift. Det bör finnas som gyllene regel – min besökare ska inte behöva förstå mig/min organisation. Vi ska hellre fokusera på att besökaren vill skickas vidare och det ganska snabbt oftast för att kunna lösa en uppgift/få reda på rätt information. Man har nämligen ungefär 3 sekunder på sig innan en besökare bestämmer sig för om sidan är värd att vara kvar på. (Analysverktyg som t.ex. Google Analytics räknar för övrigt sin bounce rate på just 3 sekunder. Sen har besökaren lämnat din sida för att den exempelvis inte var rätt.)

Välkända Jakob Nielsen säger att enligt flertalet studier så scannar besökare av sidor huvudsakligen i ett F-mönster. Organisationen Poynterextra har studerat besökare på nyhetssidor och har funnit ett läsmönster som stödjer detta. Besökare scannar och läser alltså enligt ett F på webbsidan för att hitta det de letar efter. Visst, de är också inställda på att sökrutan finns längst upp till höger men jodå, för det mesta är det ett F-mönster som gäller. (Sökrutans placering är för övrigt en annan konvention att använda.)

Studierna talar också för att besökare vet med sig att det som finns i högerspalten på en sida många gånger bara är reklam vilket ofta kallas för banner blindness. Titta till exempel bara på hur Google eller din sida i Facebook ser ut. Vad hittar du till höger? Just det. Reklamannonser. Den tanken bär många besökare med sig till andra sidor och skyr högerspalter. Visst, konventioner ska inte alltid slaviskt följas men de lutar sig ju faktiskt mot studier som uttalas av kännare av webb sedan flera år tillbaka.

Så behåller du din besökare:

  • Tvinga inte din besökare att förstå hur du tänkt – tänk åt dem istället!
  • Besökare följer huvudsakligen ett F-mönster på din sida – placera viktiga funktioner enligt detta.
  • Kolla upp konventioner som t.ex. var sökrutan brukar finnas – då känner sig din besökare hemma.
  • Se alltid upp för tyckanden enligt design om att det är “snyggt och tilltalande för ögat” att en webbsida ser ut på ett visst sätt – det måste diskuteras!

Rekommendation för mer om ämnet:

Jakob Nielsens Alertbox

Poynterextras studier om nyhetsläsning på webben

Leave a comment

Filed under Webbredaktörsroll