Så fixar du en mer användarvänlig hemsida

Går du i tankarna på hur du skulle kunna göra din webbplats ännu bättre?  Du har kreativiteten och det rätta språket men har kanske inte funderat på formgivning och struktur. I det här blogginlägget kommer jag analysera theguardian.com’s hemsida och förklara hur jag skulle utveckla den så att användarvänligheten blir bättre och hemsidan snyggare.

Bakgrund

The Guardian är en brittisk tidning som funnits under olika namn sedan 1800 talet.
Både tidningen och deras online upplaga ägs av The Scott Trust som bildades 1936 “för att säkra det finansiella och redaktionella oberoendet av tidningen  och att hålla The Guardian fri från kommersiell eller politisk inblandning.”

Faktaruta:

  • theguardian.co.uk lanserades 1999.

  • 2005, 2006 och 2007 vann hemsidan kategorin ”Best Newspaper”

  • Juli 2013 bytte de plattform från guardian.co.uk till theguardian.com för att kunna synas mer globalt. Nu har de en internationell, en australiensisk, en amerikansk och såklart en brittisk upplaga av webben

Idag – En hel del reklam

Idag har de tagit in annonser för att få in pengar till tidningen och online upplagan. När jag startade analysen möttes jag av en stor reklam-annons som täcker en stor del av skärmen, sen ser man en del av menyn och en liten del av nyheterna innan de kommer ännu en annons där de ber om ett bidrag för att kunna fortsätta leverera en gratis hemsida med välskrivna artiklar.

ska%cc%88rmavbild-2017-03-05-kl-12-28-11
Första anblick av hemsidan

Motiveringen till reklam och önskan om ett bidrag till tidningen är att The Guardian inte har någon “Paywall” vilket betyder att du inte behöver köpa ett abonnemang för att kunna läsa vissa nyheter.

The Guardian rapporterar om nyheter, livsstil, sport och en massa annat. De har alltifrån korta artiklar till halvtimmeslånga dokumentärer, detta gör analysen extra spännande då vi kan få in många olika aspekter på förbättringsåtgärder.

Målgrupper och Personas

Tänk på vilka som kan tänkas besöka din hemsida och vad du önskar att de gör när de där.

Säljer du något är det alltid bäst att tänka på målgrupper och vilka som kan tänkas köpa din produkt. Verksamt.se har gjort en jättebra sammanställning av hur du ska tänka för att hitta just din målgrupp (öppnas i ny flik).

När det gäller en hemsida med nyheter och man vill undersöka användarvänligheten skulle jag istället försöka hitta mina “Personas”.
Vill du lära dig mer om hur du själv kan hitta din webplats personas kan du göra det här (öppnas  i ny flik).

Exempel
Kalle 20 år är en riktig festprisse och använder theguardian.com för att läsa finanssidorna då han gillar att investera i aktier på sin fritid. Britta 50 år, har två barn och lever ett stilla liv men älskar aktier. Både hon och Kalle använder alltså theguardian.com till största del för att läsa på om aktier. De har alltså båda liknande behov av hemsidan men är inte samma målgrupp.

 

Om jag skulle gissa på hur en Personas som theguardian.com skulle kunna ta fram skulle den se ut ungefär såhär:

Fotbollstokige Frans

Frans är 30 år och bor i London, han röstar på The Labour Party och är väl medveten om världshändelser runt sig. Han använder theguardian.com för att vara påläst och kan enkelt argumentera för något han tror på. Han använder fliken Football flitigt för att följa matchresultat och fobollsartiklar regelbudet.

Man märker också snabbt att detta inte är något tidning för “Trump anhängare” då de har en (enligt mig) väldigt rolig artikelserie om honom och hans tid hitills som president.

2017-03-12_19-06-20

Struktur och navigering

När man skriver för webben är det extremt viktigt att få läsaren att stanna kvar på sin sida. Det finns så mycket information på webben att läsaren enkelt kan hitta en annan hemsida att surfa vidare till. Här kommer lite iaktagelser jag gjort på theguardian.com, kanske finns det något du kan ändra på din egen sida?

Megamenyn

Jag saknar att “Megamenyn”, dvs. länkarna högst upp på sidan som utgör strukturen för sidan, inte ligger kvar synlig upptill när du läser en artikel. Detta innebär att om du scrollar ner några rader i en artikel kan du inte längre se menyn nedan:

guardian-top-navigering
Megameny

Avsaknad av att lätta kunna klicka sig vidare till ett nytt ämne gör att man lätt kan lämna sidan. Det finns heller ingen vänsterkolumn med andra artiklar på hemsidan, istället har de valt att lägga alla relaterade artiklar längst ner på sidan. Detta kräver att läsaren läser klart hela artikeln enda ner vilket många inte gör.

Jag skulle också önska en större och bredare Megameny så att det är lättare att klicka på det man önskar läsa. Här är flikarna små och det är lätt att klicka på fel länk.

Toppnavigering

Topplänkar eller toppnavigering är de länkar som ligger högst upp på sidan över Headern.
Dessa är jättepraktiska på t.ex. ett intranät där du snabbt kan länka till de viktigaste supportfunktionerna. På en hemsida är det oftast där du loggar in eller byter språk.

2017-03-12_19-18-38

Jag tycker theguardian.com har en bra toppnavigering och även om du klickar på deras jobbdatabas är det enkelt att klicka back så kommer du tillbaka till första sidan istället för att behöva byta flik. Detta är självklart smaksak då man istället riskerar att läsaren blir kvar i jobbsöket istället för att gå tillbaka till hemsidan.

Struktur

De använder sig av många kolumner i olika höjd och längd både vågrätt och lodrätt. Detta ger ett rörigt intryck om man jämför med t.ex. svenska DN där använder de två lodräta kolumner av text och bilder så ögat får vila. Du ser flera exempel lite längre ner i detta inlägg.

Bilder

Bilder gör att din hemsida lockar läsare och lättar upp artiklar och hemsidor. Tänk efter hur du själv ser på en sida du just kommit in på, dras inte ögat alltid till det färgglada och roliga?

The Guardian använder extremt mycket olika bildstorlekar, speciellt på första sidan, vilket jag kan tycka gör sidan lite rörig. På bilden nedan kan jag hitta inte mindre än fyra olika bildstorlekar (och en hel del olika färger men mer om det längre ner i inlägget).

bildhantering-guardian

 

I vissa modeartiklar hade det enligt mig  varit bättre med en karusell där du kan klicka dig framåt för att se fler bilder istället för att lägga alla på rad så man måste scrolla sig igenom alla. Exempel kan du hitta här.

Ett tips att ta med sig från theguardian är att de länkar även bilderna till nyheten det berör samt att bilderna expanderar när man öppnar dem.

Clickbait

Förklaring från Google:
(on the Internet) content whose main purpose is to attract attention and encourage visitors to click on a link to a particular web page.

Vilket kort förklarat betyder att man skriver rubriker som lockar till klick för att en hemsida ska kunna få in mer pengar på reklam. Detta då många företag idag köper annonser efter hur många som klickar in på en sida. Ett exempel är när en nyhetssida t.ex. väljer rubriken “You cannot believe what happened to Katy Perry”. Motsatsen hittade jag på The Guardians hemsida då de istället skriver “Katy Perry’s dancer falls off stage as she performs with Trump and May effigies”. Denna rubrik ger ett seriöst intryck av hemsidan och intrycket att man kan lita på det som står i artikeln.

 

 

Video

Funderar du på att använda dig av videoklipp eller ljud, fundera över behovet för just din sida. Snabb streaming på videotjänsterna är A och O för att en läsare ska stanna kvar, måste man vänta en minut för att en video ska ladda tappar de flesta intresset. Här har The Guardian lyckats bra, jag testade att klicka på en halvtimmes långt filmklipp och det tog under en halv minut att ladda. Viktigt att tänka på är att streaming tjänster ofta kostar extra så fundera på att göra kortare videos som inte tar lika lång tid att ladda. The Guardian har heller  ingen reklam innan videon startar vilket man såklart uppskattar.

Ljud

Det är bra att inte mötas av musik när du går in på en sida så ha gärna en playknapp innan din video startar så att det inte kommer som en chock. Sitter du t.ex på jobbet och det dånar ut musik kan dina kollegor dels bli störda och för att inte tala om irritationen som skapas när de tror att någon kollega kollar på film på arbetstid.

Formgivning och färgval

Som jag nämnde under rubriken bilder blandar The Guardian många olika färger, jag skulle satsa på ett tema av max två färgval för att inte göra det allt för rörigt för ögat. Se exempel nedan på förbättringar:

guardian-homepage

Text

Tänk på vem du riktar dig till, här är det bra att ha tänkt till över målgrupp/Personas,

The Guardians texter är skrivna av journalister och krönikörer med akademisk bakgrund och de håller hög nivå till skillnad från t.ex svenska Nyheter 24 som oftast använder facebookinlägg eller instagrambilder som underlag till sina artiklar. De räknar då med att deras besökare har en viss akademisk bakgrund och kan läsa en vis svårighetsgrad av text.

Rubriker

Rubriken ska belysa det allra viktigaste i din artikel, tänk på vad som fångar just dina läsares intresse. The Guardian har enligt mig bra och seriösa rubriker så att du snabbt kan se vad som intresserar dig istället för att känna dig lurad av Clickbaites som jag nämnde tidigare.

Mellanrubriker

Inte i en enda artikel jag sett har The Guardian använt sig av mellanrubriker. Det gör att texten känns tung att läsa. Ett exempel är denna artikel det är så extremt mycket text och jättestora bilder mitt i. Varför inte satsa på fler små bilder och mellanrubriker? Ett bra mått är att inte skriva fler än cirka 5 rader text innan man gör ett radbryt eller lägger in en mellanrubrik.

Länktexter

The Guardian jobbar inte särskilt mycket med länktexter och har de länkar så är det oftast endast ett ord som är länkat. Försök länka flera ord så det blir lättare för läsaren att klicka sig fram.

Genus

Genus är svårt när man rapporterar om nyheter, de flesta chefer, presidenter, statsministrar och andra inflytelserika personer är män och får där med ofta mycket plats i media. Kvinnor blir istället uppmärksammade i mode och livsstilsreportage.

Exempel:
Män fotograferas ofta snett nerifrån –  vilket får en att se större och mäktigare ut. De får vara aktiva på bild och skildras ofta i sina arbetsmiljöer. Samtidigt får män inte visa sina känslor utan visas som dominanta och aggressiva. Kvinnor å sin sida visas ofta som passiva, flörtiga och leende. De förminskas ofta till sexobjekt, inte bara i mode och reklam utan även i personporträtt.

The Guardians’s hemsida och dess reportrar och fotografer  är väldigt duktiga på att vinkla både bilder och artiklar så att både män och kvinnor visas i maktsituationer.

2017-03-12_18-48-08
En avbild av första sidan där flera kvinnor får ta plats

Till sist

Jag tycker att theguardian.com har bra och välskrivna artiklar men inte en särskilt användarvänlig hemsida.  Jag saknar en vänster kolumn som gör att du lätt kan navigera vidare på sidan. Jag tror att de lätt förlorar läsare då man tappar intresset snabbt eftersom det är kompakt text utan mellanrubriker.

 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s