Personlig uppsats -Analys av forsakringskassan.se

Relevanta dokument
Analys av com hems startsida

- en expertanalys. av Anna Olvenmyr

Slutrapport: Design av Hemsida för PolyPlast+

INDIVIDUELL INLÄMNINGSUPPGIFT

ZZZVIVH HQXWYlUGHULQJ

Projekt 1 Webb- och inform ationsdesign

SVENSK FILMINDUSTRIS WEBBPLATS

Webbdesign. Fotografiska vann bästa webbsite 2015 i kategorin turism:

Rapport Projekt 1 Från material till webb

PROJEKT: WEBB- OCH INFORMATIONSDESIGN Avvägningar och motiveringar vid gränssnittsdesign av webbsida för PolyPlast+

Analys av webbplatsen csn.se Personlig uppsats i kursen Interaktionsdesign Grafiska gränssnitt, hösten 2003

Omsorgen Användarhandledning

behövs för enhetlighet, tala samma språk, så att användaren kan lära sig och använda det vidare.

Tillämpad programmering CASE 1: HTML. Ditt namn

Gör en egen webbplats

Manual HSB Webb brf

Personlig uppsats - analys av webbplats

Analys av en hemsida

DESIGNDOKUMENT 1(8) 1. Idé & koncept. Grundidé, syfte & innehåll. Målgrupp, koncept & sammanhang

Gör en egen webbplats

Använda Internet. med hjälp av Internet Explorer. Nybörjarguide

Slutrapport: Informationsvisualisering av släktträd

Skolmaten. Användarhandledning

PRO Järbo Navigeringsguide

Grafisk profil för digitala gränssnitt MAJ 2019

WEBB OCH INFORMATIONSDESIGN

Kom i gång med PING PONG

GRATIS FÖR PRENUMERANTER

ANALYS AV EN WEBBAPPLIKATION

Webbsidekurs för nybörjare

Kom i gång med PING PONG

LATHUND TILL GOOGLE SITES

Dags att skriva uppsats?

I.site Webbsidesverktyg handledning

Sociala medier för företag

1. Uppdateringsmodul (CMS)

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Kom igång. Readyonet Lathund för enkelt admin. Logga in Skriv in adressen till din webbsida följt av /login. Exempel:

Nyheterna i Visma Tendsign 4.0

Hembokat Kom igång guide

1. Polopoly och webbpublicering på SU

IT-universitetet Göteborg Grafiska Gränssnitt Grafiska Gränssnitt. Inlämningsuppgift / Interaktions design. Författare: Cecilia Gustafsson

Projekt 2 Informationsvisualisering av släktträd

edwise Reviderad:

[ANVÄNDARMANUAL MYCLUB LAGSIDE-ADMINISTRATION]

Grundläggande funktioner i CMS ifrån Argonova Systems, 2011.

Manual för din hemsida

Inledning/innehållsförteckning. Hej!

Gör en egen webbplats

Inledning. SPF Seniorerna Leksand Hemsida

Info från Express - så visas det på bjurfors.se

TNM006 Kommunikation och Användargränssnitt. Uppdrag Granskning. David Kästel Campus Norrköping, LITH

Skapa spellista i play.lnu.se Gör en samling med filmer som hör ihop

Tillgänglighetskrav på interaktion och design Dessa krav baseras på WCAG 2.0,

Miljön i Windows Vista

Workshop II (1IK419) jp222px (Johnny Pesola) sid. 1 av 5

Utvärdering av webbplats,

ActiveBuilder Användarmanual

SJF LATHUND EPISERVER 7.0

Snabbkurs i Wordpress för IOGT-NTO

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Vad är Internet? Innehåll: Inledning Vad är Internet? Om du kan Internetadressen Söka på Internet Länklistor Övningar Repetition

Projekt 1: Webb- & informationsdesign

Lathund steg för steg

Info från Express - så visas det på bjurfors.se

Lathund länkar. Skapa en intern länk som en sida

MANUAL FÖR JÄGAREFÖRBUNDETS KRETSAR

Symmetry: Bortsett från menyn har innehållet av sidan viss symmetri när det kommer till videoklippen som är upplagda på sidan.

Manual - Introduktionskurs SiteVision

Jenny Dafgård, Fredrik Johansson, Nils Järgenstedt, Yael Katzellenbogen och Klara Mälarberg. IT-Universitetet i Göteborg, HT03

Lathund Episerver - Skapa menyer. Innehållsförteckning Rev: C

Guide till Mynewsdesk Hosted Newsroom - Kom igång och spegla ditt pressrum!

Myndighetsundersökningen 2011 Om lättläst information på svenska myndigheters webbplatser

Lathund länkar. Skapa en intern länk som en sida

Introduktion till Blästadsgatans diskussionsforum. Inledning. Layout ej inloggat läge

Sektionsdata webb är anpassat för att du ska kunna justera, jobba i eller visa dina kalkyler för kollegor, kunder och beställare.

Gleerups digitala läromedel. Info till dig som vårdnadshavare

Välkommen till Jaguarklubben på internet

Sektionsdata webb är anpassat för att du ska kunna justera, jobba i eller visa dina kalkyler för kollegor, kunder och beställare.

Kom i gång med PING PONG

Misstag i webbdesign som gör att din hemsida ser klumpig ut

Manual för webbpublicering. Enköpings kommun

Gör pdfdokument bläddringsbara

Bra konvertering Grunden till en lönsam affär för alla parter. A. Lägg grunden: Prioritera Strukturera - Fokusera

KLARA Lathundar för inventerare (inför versionslyft 2013) Version 2.4 ( )

Sovra i materialet. Vad är viktigt? Vad kan tas bort? Korta ner långa texter.

Grafisk profil till Dear Area

Hur man lägger upp och redigerar dokument i Typo3.

Sköt din vardagsekonomi

Grafisk Webbprofil. Skrivregler och grafiska riktlinjer för utformning och publicering av Sjökrogen bojens hemsida.

Hur du gör ditt Gilles hemsida - en liten hjälp på vägen

Bädda in spellista Publicera spellistor i Mymoodle eller på webbsida

Om Publisher Publisher är ett program som passar bra att använda när du vill sammanställa bild och text för att skapa tillexempel broshyrer,

Kom igång och redigera din hemsida!

Kom i gång med PING PONG

Snabbguide: Hur man öppnar en egen nätbutik

Infobank kvickguide. Kom i gång med Infobank. Logga in till Infobank. Installationsguiden

RACCOON DEVELOPMENT AB

Transkript:

IT-universitetet Göteborg MDI Interaktionsdesign Interaktionsdesign - Grafiska gränssnitt 6p HT-03 Personlig uppsats -Analys av forsakringskassan.se Theresa Harmanen it3hath@ituniv.se Inlämnat: 2003-10-27

INNEHÅLLSFÖRTECKNING 1 INTRODUKTION TILL ANALYS AV FORSAKRINGSKASSAN.SE - 2-2 ANALYS AV FORSAKRINGSKASSAN.SE - 3-2.1 STARTSIDAN - 3-2.2 ALLMÄN SIDLAYOUT - 5-2.3 FUNKTIONALITET - 7-2.4 NAVIGATION - 8-3 NÅGRA DESIGNFÖRSLAG - 11-3.1 KONSEKVENT NAVIGERING - 11-3.2 VISUELL KOMMUNIKATION - 11-4 DISKUSSION - 12 - REFERENSER - 13 - - 1 -

1 Introduktion till analys av forsakringskassan.se Uppgiften består av att analysera en webbsida utifrån de koncept och begrepp som tas upp i kursen Grafiska Gränssnitt 6p på IT-universitetet i Göteborg. Jag kommer att analysera jag webbsidan utifrån vissa riktlinjer och genom detta även väva in relevant fakta om webbdesign. Jag kommer att analysera startsidan, gå igenom den allmänna sidlayouten, funktionaliteten och navigationen, ge designförslag, för att slutligen diskutera kring vissa relevanta delar. Efter att ha letat på Internet efter en lämplig sida att analysera har jag till slut valt Försäkringskassans webbsida. Forsakringskassan.se är en sida som ska vända sig till den stora allmänheten i Sverige vilket innebär att målgruppen är väldigt stor. Detta gör även att sidan måste vara anpassad till en så bred målgrupp som möjligt. Det första som slog mig när jag kom in på sidan var att jag inte alls visste var jag skulle börja. Att komma till en sida med minst tre olika navigationsmenyer, utan någon vidare logisk struktur eller placering, kan vara väldigt frustrerande och förvirrande för såväl ovana som vana användare. Genom min analys har jag bl.a. hittat olika nyckelkomponenter i sidan som bidrar till att sidan upplevs som ostrukturerad trots att det syns att man jobbat väldigt mycket med strukturen. Jag ska i denna analys utreda om man skulle kunna förbättra designen på sidan genom att titta på vad som gör den rörig. Frågan är alltså: Vad är det som gör att sidan känns rörig och går det att förbättra detta? För att analysera sidan och lösa frågan kommer jag ha W3C:s riktlinjer 1 [1] i bakhuvudet samtidigt som jag tittar på Jakob Nielsens riktlinjer 2 [2] och även informationsvisualiseringsprinciper ur Edward R. Tuftes 3 bok Envisioning Information (Tufte, 2001). För att analysera har jag själv agerat expertanvändare och därför inte gjort utvärderingar med riktiga användare. Om mer tid hade funnits hade jag gjort användartester med potentiella användare för att sedan visualisera ett omdesignförslag (som nu endast är i textform). Jag har inte varit i kontakt med Försäkringskassan utan har direkt utifrån sidan analyserat vad syftet kan vara och varför viss information finns där den finns osv. Sidan är stor och jag har därför inte kunnat analysera alla länkar var för sig utan tittat på den övergripande strukturen inom varje komponent på sidan. 1 W3C är en organisation som har tagit fram riktlinjer man bör använda sig av vid designandet av en webbsida. 2 Jakob Nielsen är webbgurun som även han har tagit fram riktlinjer för publicering på webben. Han har skrivit en hel del webbdesignböcker och är ett välkänt namn inom webbdesignvärlden. 3 Edward R. Tufte är en känd profil inom informationsvisualisering och har skrivit ett antal kritikerhyllade böcker, bl.a. Envisioning Information - 2 -

2 Analys av forsakringskassan.se Att designa för webben verkar vara något som uppfattas som en allmän kunskap, alla vet hur man gör. Om jag tycker att det är snyggt och lättfattligt så borde det ju vara korrekt? Men det finns många saker att tänka på om man vill rikta sidan till en större publik än sig själv. Jakob Nielsen, som jag tog upp i föregående stycke, talar främst om fyra huvudpunkter som man bör tänka på när man designar för webben: att på ett effektivt sätt visa sidans syfte för användaren, att hjälpa användaren hitta rätt information, att avslöja sidans innehåll så att användaren vet vad som finns, och att använda det rent visuella för att förstärka ett budskap och inte enbart för estetikens skull. Ett företags hemsida är dess ansikte ut mot världen vilket gör det till en värdefull första länk mellan en potentiell kund och företaget. [3] Försäkringskassan är inte en kommersiell enhet men det är fortfarande viktigt att fungera som en första länk mellan Försäkringskassan och den som behöver Försäkringskassans hjälp. När man ska utforma en webbsida är det en bra idé att gå igenom W3C:s riktlinjer eller andra riktlinjer för hur man presenterar information på webben. Detta för att kontrollera att man vidtagit tillräckliga åtgärder för att skapa en användarvänlig sida. Något som är viktigt att tänka på inom design är att låta användaren få tillbaka kontrollen över informationen genom att låta denne själv ställa in, ta olika vägar, göra personliga inställningar och ta del av information på sitt sätt. It is not how much empty space there is, but rather how it is used. It is not how much information there is, but rather how effectively it is arranged. (Tufte, 2001) 2.1 Startsidan Färger kan, vid måttlig användning, användas för att förstärka och liva upp information på en dataskärm. För att veta vilka färger som harmoniserar kan man gärna titta på färger som förekommer i naturen, dessa är naturligt harmoniserande för ögat tillsammans (Tufte, 2001). Det första jag lägger märke till när jag går in på sidan är den gröna färgen som är väldigt utmärkande. Försäkringskassan har försökt använda färgen som finns i logotypen i så stor utsträckning som möjligt även på webbsidan, möjligtvis som ett sätt att få användaren att snabbt förstå vart denne har kommit. Den gröna färgen har blivit som ett starkt kännemärke för Försäkringskassan vilket gör att det är fullt förståeligt att använda den på webbsidan. Hur den används är en intressantare fråga. Som sidan ser ut nu används olika nyanser av grönt i menyn, länkarna, logotypen och i bannern längst upp på sidan. Men man har inte varit riktigt konsekvent. Det finns olika typer av menyer på sidan och de har i sin tur olika färger vilket kan förvirra användaren då denne inte vet vad som är menylänkar och vad som är andra länkar. - 3 -

Bild 1. Forsakringskassan.se startsidan. Att det finns flera menyer som är olika utformade förvirrar ytterligare, användaren vet inte vart hon ska börja. Man får intrycket av att det är två huvudmenyer på sidan; en textmeny till vänster och en ikonmeny till höger. Menyn till vänster har hela 21 länkar som inte känns direkt grupperade eller strukturerade. Att navigera i den tar tid då man måste läsa igenom varje länk för att få en uppfattning om vart man ska. Om man istället grupperar dem kan ögat lättare söka sig till rätt grupp och effektiviteten ökar. Den blinkande bannern på sidan som försöker locka användaren till att läsa mer om bostadsbidrag ger intrycket av att man kan klicka på den för att komma vidare, vilket inte alls är fallet. Det gör att bannern helt förlorar sin funktion. Bannern tar dessutom mycket uppmärksamhet från användaren då den blinkar, men eftersom sidan i övrigt känns död fungerar denna funktion samtidigt underligt nog som en upplivare. Det kan dock verka underligt att Försäkringskassan måste göra reklam på sin egen sida. Man kan fråga sig vad den har för syfte egentligen. Det kan vara så att många användare upplever att de inte hittar till den undersida där man kan läsa om bostadsbidrag och behöver guidas dit, men i så fall borde bannern vara länkad. De raka linjerna och avsaknaden av direkt utsmyckning på sidan gör att den känns myndig och saklig vilket är bra då det är en myndighet vars huvuduppgift är att informera. Men i den myndiga och sakliga skuggan kommer ord såsom icke-humant och stelt upp. En myndighet som vänder sig till den stora folkmassan, och då speciellt människor som kanske är sjuka eller behöver bidrag eller annan viktig information, måste tänka på att inte skrämma bort sina användare utan istället kännas välkomnande. Ett enkelt sätt att göra detta är att använda sig av bilder utav människor på olika sätt (utan att för den sakens skull enbart använda de som estetisk utfyllnad). - 4 -

I mitten finns två spalter med aktuell information och viktig information. Detta är översiktligt och ger intrycket av att sidan ständigt uppdateras. Däremot är det mycket information som ska rymmas på en liten yta vilket medför en scrollist. I en upplösning på 1024*768 innebär det (underligt nog då man helst ska anpassa en sida till 800x600) både en vertikal och en horisontell scrollist. Speciellt horisontella scrollister ska undvikas i största möjliga mån.[4] Den mittersta informationsytan skulle utnyttjas bättre om man kortade ner den beskrivande texten och istället fokuserade på att formulera bra rubriker, användaren kan sedan få mer information under en läs mer länk. I den högra navigeringsytan finner man en scrolldown list med en inloggningsfunktion som riktar sig till arbetsgivare men även till privatpersoner. Trots det finns ingen information i närheten om vad denna funktion är till för. För att få reda på detta måste man klicka i menyn på Privatpersoner vilket gör att en inloggningssida med förklaring kommer fram. När det står logga in på en sida kan det vara lätt att anta att det går till en intern sida vilket gör att man undviker att ens undersöka saken. 2.2 Allmän sidlayout Sidan är uppdelad i vad som kan uppfattas som två navigeringsytor och två informationsytor. Till vänster och till höger på sidan finns navigeringsytorna. I mitten och längst upp finns informationsytorna. Allt detta gör att jag får illusionen av att sidan består av två olika sidor i en. Bild 2. Forsakringskassan.se - allmän layout Huvudtexten, som är svart på vit bakgrund, finns i den mittersta informationsytan. Färgerna går i grått, svart och olika nyanser av grönt. Menyn till vänster (Navigeringsyta 1), eller rättare sagt halva den menyn, ligger på en ljusblå bakgrund medan halva menyn ligger på en ännu svagare ljusblå bakgrund. Detta med undantag för länken Startsida som ligger på den vita bakgrunden. Meningen med detta kan tänkas vara att gruppera likartade menyval, men detta skulle lika bra kunna åstadkommas genom att använda samma blåa färg som bakgrund på båda delar. Man skulle t.o.m. kunna ta bort mellanrummet mellan grupperingarna om man behåller linjen emellan som är en fullt - 5 -

tillräcklig avdelare. En vit yta kan, om den placeras fel, bli en stark störande grafisk signal som upptar onödig uppmärksamhet. I det här fallet är det en avvägning beroende på om man medvetet hade tänkt att jobba med luft eller om det var ett snabbt sätt att dela av menyn på. Men i all denna välmening att skapa en sida vars färger går efter de i logotypen har man missat att de vita ytorna mellan de gröna bildar en form i sig som stör ögat. När man målar två mörka fält mot en ljus bakgrund uppstår en s.k. 1+1 = 3 eller mer effekt. (Tufte, 2001). I detta fall kan man tydligt se det i mellanrummet mellan startsidans Viktig information, Aktuellt och den blinkande reklambannern. Skillnaden mellan denna vita yta och den vita ytan mellan menyns grupperingar är att 1+1=3 fältet bildar en stark grafisk komponent som inte är påtänkt från början och som stör den egentliga informationen som ska förmedlas. Bild 3. Forsakringskassan.se de två huvudmenyerna. Eftersom man i västvärlden oftast läser från vänster till höger är många menyer på webbsidor placerade just till vänster. Ögat söker sig automatiskt till vänster och man antar ofta att information presenteras med början till vänster. Forsakringskassan.se använder sig av två menyer som är placerade både till vänster och till höger (Navigeringsyta 1 och 2). Resultatet av detta blir ett oroligt öga och en onödig kognitiv belastning i att försöka klura ut var man ska börja. Menyn till höger på sidan är grafiskt starkare, genom mörkare färg och en kombination av både text och ikoner, vilket drar uppmärksamhet till sig. Den primära informationsarean är placerad i mitten vilket är vanligt inom webbdesign. Detta är bra då man intuitivt vill placera och hitta viktig information eller huvudinformation centralt. Annan information såsom menyer och annat hör hemma i de mer perifera delarna av webbsidan där de inte stjäl uppmärksamhet från webbsidans huvudinformation. (Allt detta beror självklart på vad sidan har för syfte och vilken målgrupp den riktar sig till. Mer om detta i diskussionen, punkt 4.) I den sekundära informationsarean får man kvittot på var man har kommit, ex. till undersidan Förälder. Detta kvitto, eller huvudtiteln på undersidan, är en bra hjälp för användaren att visa på var denne är på sidan. Dock har denna informationsarea bidragit till att det på förstasidan upprepas en del information; det står Välkommen till - 6 -

Försäkringskassan! precis intill logotypen med texten Försäkringskassan. Dessutom finns Välkommen till Försäkringskassan även i webbläsarens titelfält. Man får intrycket av att de försöker fylla ut en plats enbart för att den är tom vilket i så fall är onödigt. Inom grafisk form och reklam försöker man ofta utnyttja den tomma yta som ibland uppkommer när man har för lite information i förhållande till den totala arbetsytan genom att använda det i sig som en grafisk komponent och utnyttja det till sin fördel. I detta fall kan det möjligtvis vara svårt att anamma den tanken på den ytan eftersom den har en stark färg och det kan ge fel signaler. Men det går att byta ut texten så att informationen inte upprepas onödigt många gånger. Det viktiga är att visa användaren var denne har kommit, dvs. till startsidan vilket man skulle kunna skriva istället. Bild 4. Forsakringskassan.se exempel på kvitto. Logotypen är placerad längst upp till vänster vilket även det är vanligt. Här har logotypen en fast plats. Logotypen är även länkad till förstasidan vilket är bra om man vill slippa gå in i menyn för att komma till startsidan. Logotypen har en vit bakgrundsfärg vilket man skulle kunna fortsätta arbeta med. Istället har man valt att lägga en grön bakgrundsfärg på den intilliggande Informationsarea 2. Detta medför ett stelt avbrott i designen där det kan kännas som att informationsarean är förskjuten åt höger. En bra tumregel kan vara att föränderlig information, såsom informationsareorna, bör vara grupperad för sig och statisk information, såsom menyer och logotyp, bör vara för sig. På det sättet vet ögat var det ska söka sig för att få reda på ny information utan att den statiska informationen behöver dra till sig onödig uppmärksamhet. 2.3 Funktionalitet Forsakringskassan.se är en sida med väldigt mycket information vilket innebär att det kan vara svårt att få till en bra struktur. De har delvis lyckats med att förmedla informationen, men den skulle kunna struktureras på ett bättre sätt. Sidan behandlar mycket som har med den praktiska sidan av vuxenlivet att göra. Här kan man exempelvis hitta information om studiebidrag, bostadsbidrag, lumpenbidrag och annat som kan vara relevant som ung vuxen, hur det fungerar med föräldrapenning, barnbidrag och anmäla sjukt barn när man är förälder, vad man bör tänka på när man är arbetslös eller när man driver företag, vad som gäller vid funktionshinder och arbetsskada etc. I stort kan man dela upp informationen i tre huvudkategorier: informering av regler och hur praktiska saker fungerar, blanketter och broschyrer via nätet, samt kontakt med Försäkringskassan och andra instanser. Mycket av denna information finns förmodligen just på nätet för att minska ner arbetsbördan på Försäkringskassans kontor i form av minskat antal telefonsamtal med frågor om hur saker och ting fungerar och minskade kostnader för pappersinformationsutskick och liknande. Att kunna beställa blanketter via Internet istället för via telefon är bra då man slipper sitta i telefon och då mycket av informationen angående vilken blankett man ska välja finns att tillgå på webbsidan. På sidan informeras även om nya regler för ex. sjukpenning och liknande vilket är bra att kunna hitta på en webbsida. Webbsidan fungerar lite som ett nyhetsforum vilket är bra då det är lätt att - 7 -

surfa in och ta del av informationen (men observera att det är lätt för de som har tillgång till Internet, för andra kan det vara svårt att få tag i denna information lika lätt). Det är väldigt mycket man ska hålla reda på när det gäller dessa livets praktiska frågor men de har en naturlig plats på denna sida. Hemsidan har, förutom alla resurser, även en sökfunktion som är placerad i den högra menyn. Denna är väldigt enkelt utformad vilket gör den intuitiv och okomplicerad att använda. Detta är väldigt bra om man vill slippa gå igenom menylänkar för att komma till specifik information. Handikappanpassningen på sidan är väl utbyggd. Texten går att ändra storlek på, talkassetter och information i punktskrift går att beställa, inspelade texter finns att lyssna på direkt via nätet, och alternativtexter används flitigt vilket möjliggör för uppläsningsprogram (som synskadade använder) att få en förklaring på bilder trots att användaren inte kan se dem. 2.4 Navigation Ett problem när man designar ett gränssnitt är att informationen inte är konsekvent, den presenteras inte på samma sätt hela tiden. Menyer byter skepnad och försvinner. När huvudmenyn syns försvinner underlänkarna och vice versa. Detta innebär att mycket uppmärksamhet tas från det visuella i gränssnittet medan det är den egentliga information som ska förmedlas som bör få den största uppmärksamheten. Det innebär även en belastning för korttidsminnet i det att användaren själv måste komma ihåg den information som försvann för att kunna använda och sålla bland den information som för tillfället är aktiv. (Tufte, 2001) Som tidigare nämnts uppfattar jag navigationen som ostrukturerad, icke-konsekvent och icke-intuitiv. På ett sätt hjälper den till i sökandet då den täcker in det mesta som går att hitta på sidan vilket gör den relativt översiktlig, men grupperingen av menyvalen skulle kunna göras bättre. Som det ser ut nu består den vänstra menyn (Navigeringsyta 1) av hela 21 länkar. Om man räknar in den högra menyn (Navigeringsyta 2) är vi uppe i 30 menyval (även om vissa överlappar varandra informationsmässigt). Brödsmulor är länkar som visar på var i strukturen man har varit. Vill man komma tillbaka i strukturen klickar man bara på en utav länkarna. Forsakringskassan.se använder sig av detta vilket är funktionellt och översiktligt då det finns så många val på sidan. - 8 -

Bild 5. Forsakringskassan.se - exempel på brödsmulor. På många undersidor skapas en scrollist då informationen (Informationsarea 1) blir för lång. Då utseendet på denna scroll ser ut som vilken som helst gör detta att man får illusionen av att det är två sidor i en. Där scrollen börjar slutar sidan och en ny sida med en ny meny tar vid till höger om scrollen. Detta kan man undvika om man skapar en diskretare scroll som använder sig av likadana färger som på sidan vilket skulle medföra att den smälter in bättre. Ett alternativ till scroll är att använda sig av en Nästa funktion men det kan göra att den mängdöversikt som man får i en scrollist försvinner. I menyn finns det som mest två underlänkar till de länkar som syns i huvudmenyn. Denna struktur hjälper till att dölja allt som ska få plats på webbsidan samtidigt som man får chansen att läsa om precis det man är ute efter. Men resten av huvudlänkarna försvinner när man går in i strukturen vilket är väldigt förvirrande och gör att man förlorar översikten. Man måste hela tiden klicka på Till startsidan för att komma tillbaka och välja en annan huvudlänk. När man klickar på en länk blir den svart för att markera vilken länk som är aktiv. Detta ger en dubbel signal, då brödsmulorna uppe i informationsarea 2 visar exakt samma sak, men som faktiskt fungerar väldigt bra. Det finns däremot ingen åtskillnad mellan huvudlänk och - 9 -

nästa underlänk till denna. Båda blir svarta och båda ser likadana ut med tanke på typsnitt, storlek och färg. Däremot skiljs de åt genom en linje emellan vilket gör att det ändå fungerar. Underlänk 2 är placerad en bit in från marginalen och är markerad med ett streck framför för att markera att den är ett steg ner i strukturen. Detta är tydligt och lätt att förstå. Den återkoppling man får när man håller musen över länkarna är att en länkhand bildas men länken markeras inte på något sätt vilket hade varit bra. Syftet med bilderna på sidan är att fungera både som illustration och uppmjukning men även som förtydligande utav var man är på sidan. Som synes på bilden nedan är vi inne på huvudlänken Förälder vilket förtydligas med hjälp av bilderna på barn och en förälder. Bild 7. Forsakringkassan.se exempel på bilder och dess placering på sidan. Man bör låta användaren själv bestämma hur stor texten ska vara genom att ställa in relativa storlekar på texten. [4] Något som är väldigt positivt är att textstorleken inte är fast vilket gör att användare med synproblem kan ställa in önskad storlek på texten i sin webbläsare. All text på Forsakringskassan.se ändras om man använder den funktionen även menytexten, vilket är väldigt bra. Användaren får en bättre möjlighet att ta till sig informationen. Man bör även skriva på ett enkelt sätt, speciellt när man vänder sig till en så stor målgrupp som Försäkringskassan måste göra, så att så många som möjligt kan ta del av informationen på webbsidan. För att göra detta kan man exempelvis markera nyckelord i texten och flitigt använda sig av styckeindelning. [4] På forsakringskassan.se används inga nyckelord men däremot är texten väldigt bra indelad och luftigt upplagd. Under huvudlänken Foreign Speaking hittar man en länk som heter Lättläst svenska vilken leder till PDF-filer med lättlästa texter på svenska om vissa viktiga saker som kan vara bra att känna till såsom sjukförsäkring, bostadsbidrag och föräldraförsäkring. Frågan är dock varför denna länk Lättläst svenska inte är direkt tillgänglig för alla utan ligger - 10 -

gömd under Foreign Speaking. Denna länk skulle vara av stor nytta även för människor utan utländsk bakgrund, exempelvis dyslektiker. 3 Några designförslag Sidan är i behov av två stora ändringar som har med navigering och visuell kommunikation att göra. 3.1 Konsekvent navigering Den största designändringen som jag skulle vilja genomföra på sidan är navigeringen. För att göra den mer intuitiv skulle jag först och främst integrera den vänstra och den högra menyn så att det blir endast en huvudmeny på sidan. Att använda ikoner är bra för tydlighet och effektivitet, men med den mängd menyval som finns kan det bli svårt att få plats med ikoner även vid en omdesign av menyn. För att strukturera menyn bättre skulle jag exempelvis vilja placera den överst på sidan med scrolldown-menyer som kommer fram när man håller musen över (innebär dock JavaScript men för de som inte har stöd för det brukar man lösa det genom att en textbaserad meny kommer fram istället). 4 En sådan meny skulle ge en bättre översikt, vara platsbesparande med tanke på att många menyval döljs utan att vara otillgängliga, samtidigt som det innebär att delar av menyn inte behöver försvinna för att ge plats åt undermenyer. 3.2 Visuell kommunikation Den nya menyraden som beskrivs ovan skulle kunna ligga under en banner med en bildkomposition av människor som mjukt går in i varandra för att göra helhetsintrycket mer välkomnande. 5 När det gäller allmän designlayout kan man försöka mjuka upp de kantiga gröna fält som bildas här och var på sidan i form av rubrikbakgrunder och reklambanners. För att bryta av lite mot den gröna färgen, utan att skapa onödig kontrastinformation, kan man, som tidigare nämnts i analysen, använda sig av färger som finns i naturen och som är harmoniserande för ögat. (Tufte, 2001) När man använder en mörkgrön färg mot en vit bakgrund blir den vita bakgrunden väldigt stark, nästan som en ljuskälla som kan bli väldigt jobbigt för ögonen. För att minska ner 1+1=3 fälten som uppkommer på diverse ställen på sidan kan man arbeta med färg i olika gröna nyanser för att ge sidan ett mer välkomnande och mjukt intryck och göra att färgen arbetar bättre med bakgrunden. Man kan även förstärka länkarna genom att använda en annan färg vid mouse-over vilket ger en bra återkoppling. Dessutom bör alla länkar ha samma färg för att signalera att det är just länkar. 4 Exempel på liknande menysystem finns på http://www.interaction-ivrea.it/en/index.asp 5 Exempel på liknande banner med människor http://www.telia.se/pw/privat/frame.do?mainframe=/privat.do - 11 -

4 Diskussion Det är svårt att sätta upp allmänna regler för webbdesignande då målgruppen och syftet varierar så mycket mellan två webbsidor. Mer artistiskt utformade sidor fyller ett syfte på sitt sätt, men kanske inte kan kallas användarvänliga då de är kryptiska att navigera runt på. Om Jakob Nielsen fick på sitt sätt så skulle alla sidor se ut som hans webbsidor [2], med enkla, stora, tydliga länkar och uppdelningar utan någon större tanke på estetiska värden och användarupplevelse. Forsakringskassan.se är en informerande webbsida som ska rymma mycket information och många resurser. De har delvis lyckats med föresatsen att strukturera denna information. Mycket på sidan är välorganiserat med det större undantaget navigationen som från början är relativt översiktlig men vid användning visar sig vara alldeles för komplex och minneskrävande för användaren. En slutsats jag drar av analysen är att en förändring av främst navigationen skulle göra sidan mycket mer lättillgänglig och användbar. Trots att Försäkringskassan är en myndighet ska de rikta sig till den vanliga människan med all dess betydelse bör även estetiken vävas in till en naturlig del av sidan, främst då för att förstärka informationen men även för att avparagrafisera information, dvs. för att förenkla formell information. Skulle dessa ändringar genomföras tror jag sidan skulle bli än mer tillgänglig och välkomnande för användaren än vad den för tillfället är. - 12 -

Referenser Tryckta källor Tufte, E. Envisioning Information. Cheshire, Connecticut. Graphics Press (2001). Källor på webben Försäkringskassan, 031027, URL http://forsakringskassan.se [1] W3C, 031027, URL www.w3c.org [2] Jakob Nielsen s Website, 031027, URL www.useit.com [3] Jakob Nielsen, Top Ten Guidelines for Homepage Usability, 031027, URL http://www.useit.com/alertbox/20020512.html [4] Jakob Nielsens, Top Ten Web-Design Mistakes, 031027, URL http://www.useit.com/alertbox/20021223.html Businessweek, Diss my website please, 031027, URL http://www.businessweek.com/2000/00_47/b3708076.htm Interaction Design Institute Ivrea, 031027, URL http://www.interactionivrea.it/en/index.asp Telia.se, 031027, URL http://www.telia.se/pw/privat/frame.do?mainframe=/privat.do - 13 -