Institutionen för datavetenskap
Department of Computer and Information Science
Examensarbete
En kvalitativ studie i
användarcentrerad webbdesign
avSandra Eidergren och Maria Jacobsson
LIU-IDA/LITH-EX-G--09/005--SE
2009-06-01
Linköpings universitet SE-581 83 Linköping, Sweden
Linköpings universitet 581 83 Linköping
Rapporttyp Report category Licentiatavhandling Examensarbete C-uppsats D-uppsats Övrig rapport Språk Language Svenska/Swedish Engelska/English Titel Title Författare Author Sammanfattning ISBN ISRN LIU-IDA/LITH-EX-G--09/005--SE
Serietitel och serienummer ISSN
Title of series, numbering
Nyckelord
Keywords
Datum
Date
URL för elektronisk version X
Avdelning, institution
Division, department
Institutionen för datavetenskap Department of Computer and Information Science
http://urn.kb.se/resolve?urn=urn:nbn:se:liu:diva-19602
En kvalitativ studie i användarcentrerad webbdesign A qualitative study in user-centred web design
Sandra Eidergren Maria Jacobsson
Examensarbetet har gått ut på att genom kvalitativa undersökningar ta reda på hur grafisk form och
informationsstruktur samverkar för att skapa användarcentrerade webbplatser. Målet var att ta fram en grund för hur användarcentrerade webbplatser bör byggas. Denna grund är tänkt att fungera som riktlinjer för formgivare som vill skapa användarcentrerad webbdesign.
Studien visar att det viktigaste för att skapa användarcentrerad webbdesign är att involvera användarna kontinuerligt i utvecklingsprocessen. Detta sker genom användartester och intervjuer med representanter för målgruppen. Vi har kommit fram till att graden av användbarhet spelar stor roll för hur målgruppen uppfattar webbplatsen som sådan, men också vilken uppfattning de får om företaget bakom.
Abstract
This thesis considers a qualitative study in how info structure and graphical design collaborate to form a usercentred web site. The aim was to produce guidelines for how to build user-centred web sites. The results from the
study are built on qualitative interviews, user tests with the target group and expert evaluation.
The study has shown that the most important thing for creating user-centred web sites is to continuously involve the target group in the development process. This should be done through interviews and user tests. The level of usability determines how the target group experience both the company and their web site.
Webbdesign, användarcentrering, användbarhet, sökmotoroptimering, grafisk design, informationsstruktur Web design, user-centred design, usability, search engine optimization, graphical design, info structure
Linköpings universitet
Linköpings universitet Institutionen för datavetenskap
Examensarbete
En kvalitativ studie i
användarcentrerad webbdesign
avSandra Eidergren och Maria Jacobsson
LIU-IDA/LITH-EX-G--09/005--SE
2009-06-01
Handledare: Jakob Bandelin Examinator: Jalal Maleki
Sammanfattning
Examensarbetet har gått ut på att genom kvalitativa undersökningar ta reda på hur grafisk form och informationsstruktur samverkar för att skapa användarcentrerade webbplatser. Vi fick i uppdrag att ta fram en helt ny webbplats för konceptet ”Walking Dinner” till
eventföretaget Inspirationsbyrån i Göteborg. Uppdraget har medfört att studien har utförts med fokus på webbplatser från företag inom eventbranschen.
Målet var att ta fram en grund för hur användarcentrerade webbplatser bör byggas. Denna grund är tänkt att fungera som riktlinjer för formgivare som vill skapa användarcentrerad webbdesign.
Studien visar att det viktigaste för att skapa användarcentrerad webbdesign är att involvera användarna kontinuerligt i utvecklingsprocessen. Detta sker genom användartester och intervjuer med representanter för målgruppen. Vi har kommit fram till att graden av
användbarhet spelar stor roll för hur målgruppen uppfattar webbplatsen som sådan, men också vilken uppfattning de får om företaget bakom. Navigationen är den primära faktorn som avgör om en webbplats upplevs vara användarcentrerad eller inte. Besökaren ska enkelt kunna hitta det den söker utan att behöva ta sig igenom ovidkommande innehåll.
Stora som små företag har samma tekniska förutsättningar när det gäller att presentera ett innehåll på en skärm. Särskiljning sker då till stor grad genom orden som används. På
webbplatsen är det viktigt att företaget strävar mot ett personligt och direkt tilltal. Texten bör vara uppmanande och konkret. Företaget måste tänka på vad besökarna behöver veta för att bli intresserade liksom när de behöver veta det.
Eventföretag säljer upplevelser och då måste upplevelsen av tjänsten börja redan vid första kontakten på webbplatsen. Därmed ska såväl innehåll som struktur och form väcka känslor hos besökarna snarare än att ge dem så mycket information som möjligt. Studien har visat att det är den uppfattade känslan av tjänsten som avgör om den är intressant eller ej.
Sett till samarbetet mellan informationsstruktur och grafisk form på webben, har vi kommit fram till att informationsstrukturen fungerar som webbplatsens skelett. Den grafiska formens uppgift är att presentera innehållet på ett attraktivt sätt. Båda måste samarbeta för att
Abstract
This thesis considers a qualitative study in how info structure and graphical design co-operate to form a user-centred web site. Our mission was assigned to us from a company in the event industry, Inspirationsbyrån in Gothenburg. The mission was to create a new web site for the company’s concept “Walking Dinner”. Consequently the study is focused on web sites in the event industry. The aim was to produce guidelines for how to build user-centred web sites. The study has shown that the most important thing for creating user-centred web sites is to continuously involve the target group in the development process. This should be done through interviews and user tests. The level of usability determines how the target group experience both the company and their web site. The number one factor, which determines the level of usability, is the navigation structure. The visitors should never have to be uncertain about how to navigate through the web site and the most important content should be presented at a high hierarchy level.
Despite the size of the company, the web offers the same technical conditions regarding the presentation of content. Therefore the words are important to separate the company from its competitors. The company should address their target group with a unique voice and
preferably in a personal and direct matter. The company must know what their visitors are looking for when using the company’s web site as well as when they need certain
information.
Companies in the event industry are selling experiences, and consequently the experience of their service has to begin at the target group’s first contact with the company, which often takes place through the Internet. It is important to use feelings as a motivator, since it is the experienced feelings of the web site that determines if the company’s offer is interesting or not.
Regarding the cooperation between info structure and graphical design, the study has shown that info structure works as the skeleton of the web site. The duty of graphical design is to present the content in an appealing and understandable way. Both parts have to work together to create a user-centred environment.
Förord
Följande rapport sammanfattar vårt examensarbete vid Institutionen för datavetenskap vid Linköpings universitet. Det är den avslutande delen av vår utbildning Grafisk design och kommunikation, 180 hp. Under examensarbetet har vi tillämpat de kunskaper vi har fått under hela utbildningen.
Vi vill passa på att tacka de personer som har bidragit till att examensarbetet har kunnat genomföras:
Jakob Bandelin, Linköpings universitet Handledare
Jalal Maleki, Linköpings universitet Examinator
Carina Sundqvist, Inspirationsbyrån Uppdragsgivare
Vi vill också ge ett stort tack till alla som har deltagit i våra intervjuer och användartester. Utan er hade denna studie inte varit möjlig!
Norrköping, 2009
1
Innehållsförteckning
INTRODUCERANDE DEL 1 INLEDNING 4 1.1 BAKGRUND 4 1.2 PROBLEM 41.3 UPPDRAGSGIVARE OCH UPPDRAG 4
1.3.1 MÅLGRUPP FÖR UPPDRAGET 5
1.4 SYFTE OCH MÅL 5
1.5 FRÅGESTÄLLNINGAR 5
1.6 MÅLGRUPP FÖR RAPPORTEN 5
1.7 AVGRÄNSNINGAR 6
1.8 METOD OCH KÄLLOR 6
1.8.1 VAL AV METODER 6 1.8.2 URVAL AV TESTPERSONER 7 1.8.3 ARBETSPROCESS 7 1.8.4 ARBETSFÖRDELNING 8 1.8.4.1 Huvudansvar 8 1.9 DEFINITIONER 9 1.10 RAPPORTENS STRUKTUR 10 1.10.1 HARVARDSYSTEMET 10 HUVUDDEL 2 TEORI 11 2.1 ANVÄNDBARHET 11 2.1.1 KRAV FÖR ANVÄNDBARHET 11
2.1.2 UTFORMNING AV ANVÄNDBARA PRODUKTER 11
2.1.2.1 Hjälpmedel för att uppnå användbarhet 12
2.1.2.2 Iterativ utveckling 12
2.1.2.3 Målgruppsanalys 12
2.1.3 ANVÄNDBARHET APPLICERAT PÅ WEBBPLATSER 13
2.1.4 METODER FÖR UNDERSÖKNING AV ANVÄNDBARHET 13
2.1.4.1 Kvalitativa och kvantitativa metoder 13
2.1.4.2 Fenomenologisk metod 13
2.1.4.2.1 Kvalitativa intervjuer 14
2.1.4.2.2 Observationer 15
2.1.4.3 Innehållsanalys 15
2.1.5 METODER FÖR UTVÄRDERING AV ANVÄNDBARHET 15
2.1.5.1 Expertutvärdering 15 2.1.5.2 Användartest 16 2.2 DESIGN 16 2.2.1 DESIGNENS UPPGIFT 16 2.2.2 TILLÄMPNING AV DESIGN 17 2.2.3 STÖD FÖR FORMGIVNINGSPROCESSEN 17 2.3 GRAFISK FORM 18 2.3.1 GESTALTLAGAR 18 2.3.2 BILDSPRÅK 18
2
2.3.3 GRAFISK FORM PÅ WEBBEN 18
2.3.4 ESTETIKENS ROLL FÖR ANVÄNDBARHET 19
2.3.5 LAYOUT 19
2.3.6 FÄRG 20
2.4 INFORMATIONSSTRUKTUR PÅ WEBBEN 20
2.4.1 PRINCIPER FÖR BEGRIPLIG DESIGN 21
2.4.2 ATT SKRIVA FÖR WEBBEN 21
2.4.2.1 Särskilj företaget genom orden 22
2.4.2.2 Tilltal 22
2.4.2.3 Anpassa text för skumläsning 23
2.4.2.4 Tekniska anpassningar av text 23
2.5 INTERAKTIONSDESIGN 24 2.5.1 UTFÖRANDE AV INTERAKTIONSDESIGN 24 2.5.1.1 Tester av interaktionsdesign 25 2.6 SÖKMOTOROPTIMERING AV WEBBPLATSER 25 2.6.1 VIKTNING AV SÖKRESULTAT 25 2.6.1.1 PageRank 26 2.6.2 ÅTGÄRDER FÖR SÖKMOTOROPTIMERING 26 3 ARBETSPROCESS 27 3.1 GENOMFÖRANDE AV UNDERSÖKNINGAR 27 3.1.1 UNDERSÖKNING AV WEBBPLATSER 27
3.1.2 KVALITATIVA INTERVJUER MED MÅLGRUPP 28
3.1.3 ANVÄNDARTESTER MED MÅLGRUPP 28
3.1.4 WORKSHOP MED UPPDRAGSGIVARE 29
3.1.5 OBSERVATION UNDER GUIDNING 29
3.2 FORMGIVNING AV PROTOTYPER 29
3.2.1 FRAMTAGNING AV PROTOTYP FÖR NAVIGATION OCH STRUKTUR 30
3.2.2 FRAMTAGNING AV PROTOTYP FÖR DESIGNALTERNATIV 30
3.3 ANVÄNDARTESTER MED PROTOTYPER 30
3.3.1 GENOMFÖRANDE AV NAVIGATIONS- OCH STRUKTURTEST 30
3.3.2 GENOMFÖRANDE AV DESIGNTEST 31
4 ANALYS OCH RESULTAT 33
4.1 ANALYS AV WEBBPLATSER 33
4.1.1 TILLTAL 33
4.1.2 FOKUS OCH MÅLGRUPP 33
4.1.3 INNEHÅLL 33
4.1.4 INFORMATIONSSTRUKTUR OCH NAVIGATION 34
4.1.5 GRAFISK FORM OCH BILDSPRÅK 34
4.2 ANALYS AV KVALITATIVA INTERVJUER 35
4.2.1 INTERNET SOM VERKTYG 35
4.2.2 ANVÄNDBARHET SOM BEGREPP 35
4.2.3 ANVÄNDBARHET PÅ INTERNET 35
4.2.4 FÖRBÄTTRA ANVÄNDBARHETEN PÅ INTERNET 36
4.3 ANALYS AV ANVÄNDARTESTER 36
4.3.1 INTERNET SOM VERKTYG 37
4.3.2 INFORMATIONSSTRUKTUR OCH NAVIGATION 37
4.3.3 ANVÄNDARUPPLEVELSE 38
4.4 RESULTAT FRÅN WORKSHOP MED UPPDRAGSGIVAREN 38
3
4.4.2 MÅLGRUPP 39
4.4.3 FÄRGER 39
4.4.4 BILDSPRÅK 39
4.5 RESULTAT FRÅN NAVIGATIONS- OCH STRUKTURTEST 39
4.5.1 FRI NAVIGATION PÅ WEBBPLATSEN 40
4.5.2 OLIKA VARIANTER PÅ HUVUDMENY 40
4.5.3 ALLMÄNNA SYNPUNKTER 40
4.6 RESULTAT FRÅN TEST AV GRAFISK FORM 41
4.6.1 ALTERNATIV 1 41
4.6.2 ALTERNATIV 2 41
4.6.3 ALTERNATIV 3 41
4.6.4 ALTERNATIV 4 42
AVSLUTANDE DEL
5 SLUTSATS OCH DISKUSSION 43
5.1 SLUTSATSER FRÅN UNDERSÖKNINGAR 43
5.1.1 MÅLGRUPPENS UPPFATTNING OM ANVÄNDBARHET 43
5.1.2 PREFERENSER GÄLLANDE INNEHÅLL 43
5.1.3 INTERNET SOM VERKTYG 44
5.1.3.1 Sökningar 44
5.1.4 INFORMATIONSSTRUKTUR OCH NAVIGATION 44
5.1.4.1 Menyer 45
5.1.4.2 Språkversioner 45
5.1.4.3 Särskiljning av innehåll 45
5.1.4.4 Nyhetsflöden 45
5.1.4.5 Kontaktuppgifter och presentation av medarbetare 46
5.1.5 TILLTAL OCH FOKUS 46
5.1.6 TEXT OCH TYPOGRAFI 47
5.1.7 FÄRG OCH FORM 47
5.1.8 BILDSPRÅK 48
5.1.9 BILDELEMENT 48
5.2 SAMMANFATTANDE SVAR PÅ FRÅGESTÄLLNINGAR 49
5.3 DISKUSSION KRING GENOMFÖRD STUDIE 50
5.3.1 DISKUSSION KRING FRÅGESTÄLLNINGAR 51
5.3.2 HINDER UNDER ARBETSPROCESSEN 52
5.3.3 METODKRITIK 52
5.3.3.1 Kritik av valda metoder 52
5.3.3.2 Kritik av genomförda tester 53
5.3.3.3 Användartesternas tillförlitlighet 54
5.3.4 KÄLLKRITIK 54
5.3.5 TILLÄMPBARHET AV RESULTAT 55
5.4 IMPLEMENTERING AV RESULTAT FRÅN UNDERSÖKNINGAR 55
5.5 FÖRSLAG TILL FORTSATT FORSKNING 56
KÄLLFÖRTECKNING
4
Introducerande del
1 Inledning
Detta kapitel inleder rapporten med studiens bakgrund, varför vi har valt att göra denna studie och vilka problem som ligger till grund för den. Uppdragsgivaren och det uppdrag som getts till oss i samband med examensarbetet presenteras liksom uppdragets målgrupp. Vidare sätts studiens syfte och mål upp tillsammans med fyra frågeställningar, vilka gemensamt bildar studiens grund. Arbetsprocessens metoder och delar presenteras och motiveras samt hur arbetet har fördelats mellan oss. Kapitlet avslutas med en lista över definitioner på begrepp som används i rapporten samt en beskrivning av rapportens struktur.
1.1 Bakgrund
Som utbildade grafiska formgivare arbetar vi idag i stor utsträckning online med webbdesign och webbutveckling. Detta i kombination med att Internet mer och mer blir ett självklart verktyg för informationsökning och interaktion ledde till att vi ville undersöka användbarhet på webben. Vad är det som gör en webbplats användbar och hur kan detta påverkas?
Studiens fokus ligger på navigering och informationsstruktur samt den grafiska utformningen. Detta är områden där vi i vår yrkesroll som grafiska formgivare har mycket kunskaper att tillföra. Studien är en möjlighet för oss att konkret få svar på hur användarcentrerade webbplatser bör tas fram men också på vad användbarhet innebär.
1.2 Problem
Det är idag ingen självklarhet att webbplatser är anpassade efter användaren. De kan vara svårnavigerade eller ge dubbeltydiga budskap utan en tanke på vilka intryck de ger användarna.
Det är ingen ovanlig syn med webbplatser som använder sig av mycket flash-animationer och effekter, vilket inte tar hänsyn till konsekvenserna för webbplatsens sökbarhet.
Webbplatsen kan ofta fungera som en spegel för avsändaren. Webbplatsen är då uppbyggd enligt företagets struktur och tänkande och användarfokus har låg prioritet, liksom
målgruppens preferenser och behov. Det saknas ett tänkande som synliggör sambandet mellan webbplatsens användbarhet och dess utformning.
1.3 Uppdragsgivare och uppdrag
Det uppdrag som har utförts i samband med examensarbetet har getts av Inspirationsbyrån i Göteborg, genom Carina Sundqvist. Inspirationsbyrån anordnar skräddarsydda historiska evenemang, guidningar och resor samt utbildningar, seminarier/föreläsningar och workshops inom hållbar livsstil.
Den del av företaget vi har kommit i kontakt med är det nya konceptet ”Walking Dinner”, vilket är en stadsvandring kombinerad med besök på tre olika restauranger i Göteborgs innerstad. Vandringen beskriver Göteborgs historia i en samtida kontext där hållbar livsstil står i fokus.
5 Vårt uppdrag var att lägga grunden för en ny webbplats som är tänkt att komplettera den
webbplats Inspirationsbyrån har i dagsläget1. Den nya webbplatsen ska marknadsföra
”Walking Dinner” och locka målgruppen till att boka in en guidning.
Funktionalitet, tydlighet och enkelhet är centralt för webbplatsens uppbyggnad och dess struktur ska snabbt leda kunden rätt. Internet ska användas som ett verktyg för att ge kunderna en inblick i Inspirationsbyråns verksamhet och konceptet ”Walking Dinner”. Därefter kan de besluta sig för om de vill anlita företaget eller inte. Dessutom är det viktigt att den färdiga webbplatsen byggs för att ge höga resultat på specifika sökord hos sökmotorerna.
1.3.1 Målgrupp för uppdraget
Enligt uppdragsgivaren består målgruppen för ”Walking Dinner” av förbokade grupper från företag, organisationer eller föreningar som vill hitta på någonting ihop eller göra någonting för sin personal eller sina medlemmar. Det kan också röra sig om kompisgäng bestående av välbeställda privatpersoner eller eventuellt turister.
Konkurrerande verksamheter skulle kunna vara sådant som att paddla havskajak eller att ta en ballongfärd och som uppdragsgivaren själv uttryckte det ligger konkurrensen i allt annat som målgruppen kan välja att lägga sin tid på.
1.4 Syfte och mål
Syftet är att undersöka hur grafisk form och informationsstruktur på webben samarbetar och stödjer varandra på en användarcentrerad webbplats. Grafisk form och informationsstruktur är båda grundstenar för webbdesign och ska därför analyseras enskilt samt hur de tillsammans kan bidra till att skapa en användarvänlig webbplats.
Målet är att leverera riktlinjer för hur en användarcentrerad webbplats kan implementeras av Inspirationsbyrån och vidareutvecklas. Vi ska skapa grunden och förutsättningarna för webbplatsen sett till grafisk form och informationsstruktur.
1.5 Frågeställningar
Studien utgår från nedanstående frågeställningar:
• Vilka utgångspunkter bör fokuseras på vid framtagning av användarvänliga webbplatser?
• Hur påverkar grafisk form användarvänlighet på webben?
• På vilka sätt kan en webbplats struktur utformas för att skapa en användarvänlig och sökbar webbplats?
• På vilka sätt samarbetar grafisk form och informationsstruktur vid utformningen av en användarvänlig webbplats?
1.6 Målgrupp för rapporten
Målgruppen för denna rapport är personer med intresse i att veta vad som skapar en
användbar webbplats och hur processen att bygga en sådan bör fungera. Den tilltalar också de
6 som vill se de samband som finns mellan grafisk formgivning, informationsstruktur och användbarhet på webben.
1.7 Avgränsningar
Vi har valt att inrikta undersökningen om användbarhet på webben mot webbplatser som tillhandahåller tjänster eller produkter från företag. Detta för att få en överskådlig omfattning på undersökningen, särskilt vad gäller intervjuer och användartester. Olika webbplatser har olika förutsättningar och vad som är användarvänligt på ett community behöver inte vara det som uppfattas som användarvänligt på en webbplats som säljer produkter. Vi vill också ha ett resultat som är användbart för den webbplats vi har fått i uppdrag att lägga grunden till åt vår uppdragsgivare. Därför har vi valt inriktningen mot webbplatser för tjänsteföretag.
På grund av tidsbegränsningen för examensarbetet på tio veckor har vi fått avgränsa vårt uppdrag gentemot Inspirationsbyrån till att fokusera enbart på konceptet ”Walking Dinner” istället för samtliga koncept och tjänster som Inspirationsbyrån står bakom.
Tidsbegränsningen och delvis bristande kunskaper i webbprogrammering har lett till att vi har fått avgränsa uppdraget från att leverera en färdig produkt i form av en fungerande webbplats med administratörsgränssnitt till att istället leverera riktlinjer att följa gällande grafisk form, informations- och navigationsstruktur, webbcopy och sökmotoroptimering. Riktlinjerna ska utgöra en grund för att skapa användarcentrerade webbplatser i allmänhet och en webbplats åt konceptet ”Walking Dinner” i synnerhet. De kompletteras med att en komprimerad men fungerande webbplats levereras till uppdragsgivaren.
1.8 Metod och källor
Här beskrivs de metoder som har valts för studien, hur urval av testpersoner har gått till samt de arbetssätt och den arbetsfördelning som har rått under undersökningens gång.
1.8.1 Val av metoder
Metodval är enligt Holme (2006, s. 76) ett strategiskt val som bör göras utifrån den frågeställning som ska undersökas, de resurser som finns att tillgå samt eventuell tidigare erfarenhet av forskningsarbete.
För undersökningen om användbarhet på webben användes kvalitativa metoder eftersom en förståelse av användarnas upplevelser av specifika webbplatser har varit centralt i studien. Utforskande samtal har varit nödvändiga för att på ett personligt plan förstå hur användarna tänker och agerar på Internet samt vad som är viktigt när dessa söker och tar till sig
information.
Innehållsanalys (eng. Content Analysis) användes för att analysera existerande webbplatser från företag inom uppdragsgivarens bransch. För användartester tillämpades fenomenologisk metod (eng. Phenomenological Study) i form av kvalitativa intervjuer i kombination med praktiska moment.
Användartester genomfördes i tre olika stadier av arbetsprocessen. Dels testades befintliga webbplatser inom eventbranschen för att få en förståelse för vad målgruppen anser vara användarcentrering på webben samt hur de rör sig i olika typer av webbstrukturer. Ett andra användartest gjordes för att testa hur målgruppen navigerar och tänker kring
7 informationsstruktur, anpassat efter konceptet ”Walking Dinner”. Det tredje och sista
användartestet genomfördes för att exemplifiera hur olika typer av formgivning påverkar uppfattningen av ett och samma innehåll. Gemensamt för samtliga användartest var att vi i form av forskare höll en kontinuerligt observerande roll och lät testpersonerna vara de som förde testerna framåt.
1.8.2 Urval av testpersoner
För intervjuer och användartester valdes testpersoner i första hand ut ur uppdragsgivarens nätverk, i samråd med uppdragsgivaren. Detta berodde dels på praktiska omständigheter, men också på vikten av att utföra testerna med personer ur målgruppen för ”Walking Dinner”. När vi har använt testpersonerna som inte tillhör uppdragsgivarens nätverk har parametrar som ålder, Internetvana samt att testpersonerna skiljer sig åt inbördes gällande avgörande parametrar för målgruppen, fått styra urvalet.
1.8.3 Arbetsprocess
Arbetet påbörjades med att skriva en brief gällande vårt examensarbete inom användarvänlig webbdesign. Denna skickades ut till examinator, handledare och uppdragsgivare och
godkändes efter vissa justeringar.
Därefter inleddes litteraturstudier inom de områden som kunde tänkas vara nödvändiga för vår studie, däribland teorier om användbarhet i praktiken, forskningsmetodik, webbdesign med användarfokus, webbcopy samt sökmotorer och sökmotoroptimering. Teoriavsnittet blev mycket omfattande till en början, vilket var nödvändigt eftersom det var svårt att i
inledningen veta vilken sorts teori som skulle komma att spela störst roll i studien.
Intervjuer och användartester med målgruppen förbereddes och genomfördes i flera olika led av arbetsprocessen. De genomfördes i form av fysiska möten med ljudinspelning och
anteckningar som hjälpmedel.
En workshop med uppdragsgivaren genomfördes för att klargöra hennes synpunkter på vad företaget Inspirationsbyrån är och vilken information de vill nå ut med samt vad konceptet ”Walking Dinner” står för.
Efter genomförda tester och intervjuer kom arbetet med att sammanställa resultaten och att analysera dessa för att få fram det som var viktigt för vår studie.
Resultaten ledde sedan till formgivningsfasen där skisser och prototyper togs fram i olika steg, från navigationsprototyper utan någon grafisk form till olika grafiska designalternativ. Prototyperna testades med målgruppen. Resultaten från prototyptesterna sammanställdes och analyserades för att lyfta fram de delar som var viktiga för vår undersökning och dess
uppsatta frågeställningar. Utifrån studiens samtliga resultat togs en slutlig skiss för ”Walking Dinners” framtida webbplats fram samt en komprimerad men fungerande version av
webbplatsen.
Utifrån genomförda intervjuer och användartester drogs slutsatser kring de kriterier som krävs för att skapa en användarcentrerad webbplats. Studien som helhet diskuterades gällande valda metoder, felkällor, hinder i arbetsprocessen och källkritik. Slutligen lämnades förslag på vidare forskning i ämnet.
8 1.8.4 Arbetsfördelning
Under arbetets gång har vi delat upp arbetsuppgifterna i ett försök att skapa en jämn arbetsfördelning.
Den inledande uppdelningen som gjordes var mellan kontaktperson och dokumentansvarig. Kontaktperson innebar att hålla kontakt med externa parter såsom examinator, handledare och administratörer på universitetet samt uppdragsgivaren. Kontakt skedde genom e-post,
telefonsamtal eller chat. Dokumentansvarig ansvarade för tidsrapportering och att dagbok över arbetet skrevs kontinuerligt samt att styrdokument upprätthölls.
Sandra Eidergen har under examensarbetets gång fungerat som ansvarig kontaktperson och har även haft ansvaret att lämna in färdig examensrapport. Maria Jacobsson har i sin tur varit dokumentansvarig och har tilldelats ansvaret att publicera den godkända examensrapporten. Det är viktigt för oss att klargöra att trots att det i nedanstående stycke skrivits att en av oss har haft huvudansvaret för att skriva ner, ta reda på fakta om eller sammanställa valda delar ur arbetsprocessen har det totala arbetet varit ett fullgott samarbete. I samtliga delar har vi i hög grad influerat, inspirerat samt hjälpt varandra att nå önskat resultat. Alla delar har omarbetats av båda parter och lösningar och resultat har diskuterats. Under tester och intervjuer har vi bytt roller under tidens gång för att jämna ut vår arbetsfördelning och för att vi båda ska få ett varierat arbete.
1.8.4.1 Huvudansvar
De olika delar vi har haft huvudansvaret för att genomföra beskrivs nedan.
I teoriavsnittet har Sandra Eidergren haft övergripande ansvar för att ta fram fakta kring den fenomenologiska metoden och Maria Jacobsson har tagit fram information om metoden innehållsanalys.
De delar Sandra Eidergren har haft ansvar för att skriva om i rapporten är avsnitten om användbarhet, utvärdering av användbarhet, grafisk design, interaktionsdesign och informationsstruktur på webben.
Maria Jacobssons ansvarsdelar i teoriavsnittet har varit att skriva om valda metoder, estetikens roll för användbarhet, sökmotoroptimering samt hur man skriver för webben. Arbetsprocessen har alltigenom varit ett samarbete men vi har haft skilt ansvar för att sammanställa och skriva ner olika stycken i rapporten.
Sandra Eidergren har haft ansvar för att skriva om kvalitativa intervjuer och användartester samt hur prototyper för designtester togs fram. Hon har vidare skrivit om hur designtestet genomfördes och om analyserna av genomförda intervjuer och användartester samt resultatet från designtesterna.
Maria Jacobsson har haft övergripande ansvar för att skriva om undersökningen av
webbplatser, om workshopen med uppdragsgivaren samt hur prototyper för navigations- och strukturtester togs fram. Vidare skrev hon om analysen av webbplatserna och slutligen också resultaten från workshopen och navigationstesterna.
9
1.9 Definitioner
Inom ämnesområdet webbdesign och grafisk form finns ett antal begrepp, som kan behöva förklaras för att undvika oklarheter kring deras betydelse i vår studie. I den här rapporten avses följande betydelser för nedanstående begrepp och fackuttryck:
Alt-text
Skrivs i HTML-kod för att beskriva en bild eller länk. Texten visas normalt inte för besökaren men kan i vissa webbläsare synas om muspekaren förs över elementet som texten beskriver.
Banner
Webbannons eller annonsruta på webben som leder vidare till en extern webbplats om den klickas på. Har ofta rörligt innehåll.
Flash-animation
En populär typ av animation på Internet. Flash-animationer är ofta interaktiva och produceras i serier. De skapas med mjukvara som kan skriva swf-filer.
Dynamisk webbsida
Webbsidan är kopplad till en databas med information. Sidan skapas i samma ögonblick som den visas genom att specifik information väljs ut ur databasen.
Länk
En sida kan innehålla länkar till sidor på samma webbplats, till andra webbplatser eller till specifika ställen på samma sida. Länkar kan vara utformade som bilder, knappar eller text.
Startsida
Den sida som finns på adressen http://www.foretagsnamn.se (alternativt en annan toppdomän, så som .nu och .com). Startsidan är normalt den första sidan som användaren ser på
webbplatsen.
Tumnagel
En tumnagel är en miniatyrbild av en större bild. Tumnaglar är ofta klickbara och fungerar då som länkar till den större bilden.
Webbadress
En webbadress identifierar en resurs på webben, så som en webbsida, bild eller datafil. Dynamiska webbsidor, som ändras beroende på användarens aktivitet och interaktion med sidan, saknar vanligen fasta webbadresser.
Webbplats
En webbplats består av ett antal webbsidor som ligger grupperade under samma avsändare. Alla webbsidor har samma basadress, exempelvis http://www.foretagsnamn.se/...
Webbsida
En webbsida är ett dokument kodat i HTML (Hyper Text Markup Language) som är det språk som sidor på Internet skrivs i.
10
1.10 Rapportens struktur
Rapporten inleds med en introducerande del som innehåller bakgrund, uppdrag, syfte och mål samt uppsatta frågeställningar. Den introducerande delen fortsätter med metod och källor och avslutas med en definitionslista och ett beskrivande strukturavsnitt.
Nästa del är rapportens huvuddel och innehåller ett övergripande teoriavsnitt, beskrivning av vår arbetsprocess samt de resultat vi har kommit fram till.
Den avslutande delen presenterar undersökningens slutsatser och en sammanfattande diskussion. Rapporten avslutas med källförteckning samt medföljande bilageförteckning.
1.10.1 Harvardsystemet
Rapporten är uppbyggd kring Harvardsystemet, vilket är det referenssystem som vanligen används för studentuppsatser. Det som utmärker Harvardsystemet är att författarnamn och årtal refereras till i löptexten. Harvardsystemet använder sig inte av referenser i fotnoter utan lägger dem samlade i en referenslista i slutet av rapporten. En mening med att skriva
uppsatser är att ta till sig det akademiska författarskapets hantverk och dit hör att kunna följa en standard för litteraturreferenser. Den guide till Harvardsystemet som har använts till denna rapport är skriven av Bytoft-Nyaas (2008).
11
Huvuddel
2 Teori
I det här kapitlet ges en bakgrund till begreppet användbarhet och en beskrivning av flera metoder som kan användas för att undersöka och utvärdera användbarhet. Vidare tas design och grafisk form upp samt den inverkan de har på användbarhet. Kapitlet innehåller också teori om informationsstruktur på webben, interaktionsdesign och avslutas med ett avsnitt om metoder för sökmotoroptimering.
2.1 Användbarhet
Katzeff (1995, s. 2) definierar användbarhet som en egenskap hos ett system som gör det lämpat för de personer som ska använda sig av systemet, de uppgifter som systemet ska stödja och det sammanhang i vilket systemet ska användas.
Ottersten (2006, s. 7) menar att en användbar produkt inte syns förrän den brister i sin användbarhet. Då blir bristerna mycket tydliga för användarna. Vad som upplevs som användbarhet varierar från individ till individ och mellan olika typer av webbplatser. Vidare menar Ottersten (2006, s. 16) att användbarhet inte är någon objektivt observerbar, inneboende produktegenskap så som färg eller funktion. Istället är det en egenskap som uppstår vid produktens användning. Begreppet användningskvalitet innebär att fokus sätts på användningen av produkten, istället för på produkten i sig. Det blir då tydligt att användbarhet är en kvalitetsdimension och att produktens användbarhet är beroende av det sammanhang i vilket den används.
2.1.1 Krav för användbarhet
Användbarhet anses ofta vara ett icke-funktionellt krav. För att kunna beskriva mätbar användbarhet krävs det att användarnas mål och intentioner är klargjorda såväl som det sammanhang i vilket användningen sker, som inbegriper arbetsuppgifter, utrustning och miljö. De mål som har satts upp gällande ändamålsenlighet, effektivitet och tillfredsställelse i specifikt sammanhang ska vara tydliggjorda (Gulliksen 2002, s. 72).
2.1.2 Utformning av användbara produkter
Användbarhet är endast en av många kvalitetsegenskaper. För användbarhet är egenskaperna tillförlitlighet/stabilitet, säkerhet/skydd samt tillgänglighet för användarna särskilt viktiga. Om en eller flera egenskaper inte är uppfyllda finns det ingen mening med att tala om
användbarhet (Molich 2002, s. 21).
Vid utformandet av en användbar produkt bör hänsyn tas till det mänskliga systemet,
sammanhanget som produkten ska användas i samt den förväntade nyttan av produkten. Med det mänskliga systemet avses egenskaper hos den individ som använder produkten.
Egenskaperna kan vara sådant som hur människor ser, minns och uppfattar information samt specifika egenskaper hos målgruppen så som kunskaper, värderingar, attityder och
förväntningar. För produktens användare kan den förväntade nyttan exempelvis vara förenkling, effektivisering eller nöje (Ottersten 2006, ss. 14-15).
12
2.1.2.1 Hjälpmedel för att uppnå användbarhet
Grundprinciperna för att skapa ett användbart system är att fokusera på användarna och involvera dem i arbetsprocessen. Under utvecklingsfasen är det viktigt att delar som påverkar den slutliga användbarheten integreras med varandra. För att uppnå detta bör dessa delar utvecklas parallellt och beroende av varandra (Gulliksen 2002, ss. 32-37).
Det är viktigt att ha en målgrupp som är tydligt beskriven. Personer ur målgruppen kan användas för att genomföra intervjuer kring vilka förutsättningar, inställningar och förväntningar de har på en användarvänlig webbplats. Personer ur målgruppen kan också observeras när de löser uppgifter på redan befintliga webbplatser. Under hela
utvecklingsprocessen bör utvecklarna ha kontinuerlig kontakt med användarna, det vill säga målgruppen (Molich 2002, s. 31).
Det är lämpligt att ta fram prototyper för att visualisera en framtida användningssituation eller idé för användarna. Prototyperna bör sedan testas med användarna och om det är möjligt bör flera prototyper utvecklas parallellt (Gulliksen 2002, ss. 32-37). Prototyper kan vara fysiska, digitala eller av papper (Dan Saffer 2007, ss. 114-117). Erfarenheterna från prototyptesterna kan sedan användas för att förbättra designen. Vid tillräckligt goda resultat kan prototypen implementeras, alternativt förändras och testas igen. Normalt är det nödvändigt att formge, testa och korrigera 2-5 gånger innan designen uppfyller alla krav från såväl användare som beställare (Molich 2002, s. 31).
För att kunna mäta hur designen motsvarar kriterierna för användbarhet, bör enligt Gulliksen (2002, ss. 32-37) användarnas beteenden och reaktioner vid verklig användning observeras, dokumenteras och analyseras.
Andra webbplatser kan tjäna som förebilder och ge lärdomar om vad som är bra och vad som är dåligt. Att genomföra jämförande tester av användbarhet på konkurrerande webbplatser är att rekommendera. Det är också lämpligt att göra en mall för hur webbplatsen ska se ut och fungera gällande navigation och design för webbplatsens samtliga undersidor. En samordnare för mallen bör utses och dessutom bör procedurer för hur uppföljning och ändringar av mallen ska ske fastställas (Molich 2002, s. 31).
2.1.2.2 Iterativ utveckling
Iterativ utveckling innebär att under processens gång lära sig mer om problemet och de krav som finns. Genom att upprepa analys, design, utvärdering och återkoppling kan
designlösningar formas och förfinas efter hand för att resultera i en så optimal lösning som möjligt. Ett sådant arbetssätt är centralt i en användarcentrerad designprocess (Gulliksen 2002, s. 145).
2.1.2.3 Målgruppsanalys
Syftet med en målgruppanalys är att samla in reella krav från framtida användare, även krav som anses vara självklara och sammanhangsberoende. Kunskapen om målgruppen kan användas för att styra designbeslut och för att utforma användartester. Det finns flertalet tekniker för att genomföra målgruppanalyser, så som enkäter, intervjuer, observationer och dagböcker. Insamlad information ska bestå av rena fakta, men också av mjuka värden så som målgruppens värderingar och förväntningar (Ottersten 2006, ss. 17-18, 62-63).
13 2.1.3 Användbarhet applicerat på webbplatser
Enligt Molich (2002, s. 23) utmärks en användbar webbplats av att den är: • Lätt att lära sig
• Lätt att komma ihåg • Effektiv att använda • Begriplig
• Tillfredsställande att använda
2.1.4 Metoder för undersökning av användbarhet
I följande avsnitt beskrivs skillnaden mellan att använda kvalitativa och kvantitativa
undersökningsmetoder. Detta för att motivera de val av metoder som har gjorts för vår studie. Metoderna beskrivs därefter teoretiskt.
2.1.4.1 Kvalitativa och kvantitativa metoder
I huvudsak finns det två typer av metoder; kvantitativa och kvalitativa. De fokuserar på hård2-
respektive mjukdata3 och skiljer sig exempelvis åt genom hur siffror behandlas (Holme, s.14).
Kvantitativa metoder är till stor grad strukturerade och formaliserade och präglas av kontroll från forskarens sida. Den insamlade informationen omvandlas till siffror och analyseras sedan statistiskt för att komma fram till allmängiltiga resultat. För att kunna göra uttalanden av generell karaktär krävs ett selektivt upplägg och planering av studien samt avstånd till informationskällan (Holme, s 14).
För att få svar på vissa frågor räcker det inte med att skumma på ytan. Istället måste undersökningen vara djupgående för att ge en fullständig förståelse av fenomenet som
undersöks (Leedy & Ormrod, s. 133). Kvalitativa metoder fokuserar på att skapa en förståelse för omvärlden och det specifika problem som studeras, snarare än att komma fram till ett resultat som är allmängiltigt. Utifrån den information som samlats in gör forskaren tolkningar. Dennes uppfattning om fenomenet som studeras blir viktig och forskaren själv spelar därmed stor roll för resultatet (Holme, s. 14 och s. 76).
En nackdel med kvalitativa metoder är att datainsamlingen tar lång tid och informationen kan vara svår att analysera efteråt. Enligt Holme (2006, s. 83) är informationen öppen men inte nödvändigtvis enhetlig eftersom informationsinsamlingen har anpassats till varje enskild individ under studiens gång. Kvantitativa metoder ger oftast en mer effektiv datainsamling och sparar tid i detta skede. Enligt Holme (2006, s. 83) ger kvantitativa metoder däremot inte samma förståelse av det studerade fenomenet. Resultatet kan ha generell giltighet men ändå sakna relevans eftersom informationen inte ger utrymme för individuell anpassning.
2.1.4.2 Fenomenologisk metod
En fenomenologisk studie har till syfte att förstå människors upplevelser, perspektiv och uppfattningar kring en specifik situation. Studien svarar på frågan: ”Hur är det att uppleva det här och det här?” Genom att undersöka flera olika perspektiv av samma situation kan
2
Hårddata är statistiskt säkerställda data av objektiv karaktär. 3 Mjukdata är subjektiva betraktelser och erfarenheter hos individer.
14 forskaren göra generaliseringar av hur fenomenet ter sig vara för personer som har upplevt det (Leedy & Ormrod, s. 139).
Metoden bygger på djupgående intervjuer med noggrant utvalda deltagare, vilka alla har upplevt fenomenet som ska studeras. Lämpligt antal är 5-25 deltagare. Intervjuerna är tämligen ostrukturerade och forskarens roll är att lyssna medan de intervjuade berättar om sina upplevelser kring fenomenet. För att inte påverka resultatet är det viktigt att forskaren bortser från sina egna förutfattade meningar i ämnet. När materialet analyseras är
gemensamma teman i testpersonernas berättelser det centrala. Resultatet presenteras i form av en generell beskrivning av fenomenet, som det ses av människor som har upplevt det. Fokus ligger på vanligt förekommande teman i upplevelserna trots de skillnader som finns hos varje individ och den kontext som har studerats (Leedy & Ormrod, s. 139-140).
2.1.4.2.1 Kvalitativa intervjuer
Styrkan hos kvalitativa intervjuer ligger i att situationen liknar ett vanligt samtal.
Testpersonerna påverkar samtalets utveckling. Forskarens uppgift är att ge tematiska ramar för att få svar på det som eftersöks i undersökningen. Det finns emellertid en risk för att testpersonen svarar som denna tror att forskaren förväntar sig eller vill, för att inte göra forskaren besviken. Risken kommer av att det vid kvalitativa intervjuer råder ett
tillitsförhållande mellan forskare och testperson. För att forskaren inte ska påverka resultaten är det därför viktigt att denna agerar som den intresserade lyssnaren och avhåller sig från att med kommentarer eller kroppsspråk bedöma testpersonens svar. Metoden medför ett
begränsat antal intervjuobjekt, beroende på hur krävande intervjusituationen är, hur
intervjuobjekten väljs ut och hur informationen ska analyseras efteråt (Holme, s. 94, 99-100). Termen fokusintervju beskrivs av Trost (2005, s. 22) som en intervju med tydligt fokus, att den är strukturerad och handlar om ett bestämt tema. Han anser också att det bör vara självklart att seriösa intervjuer har tydligt fokus.
Testpersonerna som väljs ut ska antas ha rikligt med kunskap om det fenomen som undersöks och en förmåga att uttrycka sig (Holme, s. 101). Trost (2005, s. 117) tillägger att urvalet bör vara heterogent inom en given ram. Inom denna ram ska det finnas variation, men inte till sådan extrem att mer än någon enstaka persons uppfattning kring fenomenet är avvikande. Antalet intervjuade bör enligt Trost (2005, s. 123) vara begränsat till fyra, fem upp till åtta stycken. Vid ett alltför stort antal blir mängden information oöverskådlig och det är svårt att kunna se viktiga detaljer.
Enligt Molich (2002, s. 55) bör intervjuerna äga rum i användarnas egen arbetsmiljö. De är inte medvetna om allt de gör i kombination med arbetsuppgifterna, vilket då bäst observeras i den miljö där användarna känner sig trygga och vana att arbeta.
Informationen från intervjuerna analyseras genom att de skrivs ner ordagrant på papper. Är det en mycket lång och omfattande intervju kan det räcka med att skriva ner viktiga bitar och göra en sammanfattning över resterande delar. Ett referat av hela intervjun tillsammans med ljudinspelning kan med fördel skickas till testpersonen så att denna får möjlighet att rätta till eventuella felciteringar eller annat dylikt (Holme, s. 140).
Vid kvalitativa intervjuer och analyser eftersträvas ofta att få fram olika mönster på så sätt att det blir en analytisk kategori. Det är dock viktigt att inte försöka läsa mellan raderna och på så sätt övertolka insamlat material. Intervjuarens uppgift är inte att bedöma huruvida ett
15 Vid redovisning av data från kvalitativa intervjuer anser Trost (2005, s. 134) att den
intervjuade inte bör citeras enligt talspråk men att ordagranna citat kan komma att vara nödvändiga om det är formuleringar som sådana som ska analyseras. Fokus ska ligga på vem man skriver för och materialet ska uppfattas som levande. Läsaren ska själv kunna sätta sig in i hur resan från planering till rapport har löpt och uppleva densamma.
2.1.4.2.2 Observationer
Observationsteknik innebär att observera användarna i deras egen miljö då de löser uppgifter som motsvarar uppgifter som den framtida webbplatsen är tänkt att hjälpa dem med. Tekniken går inte ut på att diskutera webbplatserna utan istället se vad användarna gör (funktionalitet) och hur de gör det (användargränssnitt) (Molich 2002, s. 53).
Observationen anses också vara en god förberedelse inför intervjuer och minst tre användare bör ha observerats innan några som helst slutsatser kring resultatet kan dras. Den idealiska siffran ligger på sex personer (Molich 2002, s. 53).
2.1.4.3 Innehållsanalys
Innehållsanalys (eng. Content Analysis) lämpar sig för att hitta mönster, teman eller förutfattade meningar inom ett visst material och utförs ofta på olika typer av mänsklig kommunikation. Metoden innebär omfattande planering i början av studien då en tydlig
frågeställning ska identifieras samt det urval som ska testas, vilka karakteristika4 som
eftersöks och hur analysen av materialet ska gå till. Viktigt är att sammanställa förekomsten av varje karakteristikum som hittas i materialet. Frekvensen kan sedan analyseras statistiskt för att hitta samband som är relevanta för studien (Leedy & Ormrod, s. 142).
För att vara en kvalitativ metod är innehållsanalys tämligen systematisk och strukturerad, vilket kan vara en fördel om forskaren är ovan vid att utföra kvalitativa studier. Beroende på vad som studeras kan det som eftersöks i materialet kräva subjektiva bedömningar,
exempelvis när det handlar om beteenden i specifika situationer. För att studien ändå ska kunna anses vara objektiv bör två eller tre personer gå igenom samma material och sedan sammanställa sina bedömningar (Leedy & Ormrod, s. 142).
2.1.5 Metoder för utvärdering av användbarhet
Ottersten (2006, s. 93) skriver att utvärdering av användbarhet ska genomföras så snart det finns insamlad information att utvärdera. Det finns flera olika utvärderingstekniker
tillgängliga, vilka är anpassade efter olika situationer och har olika syften. Det bör inte finnas en särskild avsatt testfas i projektet utan tester ska ligga som ett kontinuerligt inslag genom hela processen.
2.1.5.1 Expertutvärdering
Expertutvärdering är enligt Ottersten (2006, s. 93) en granskning av befintliga eller föreslagna användargränssnitt. Utvärderingen baseras först och främst på hur mänskliga egenskaper så som syn, minne och tanke fungerar och påverkar utformningen.
16 Syftet med en sådan utvärdering är att med en mindre arbetsinsats upptäcka
användbarhetsproblem. Efter utvärderingen ska då dessa problem och brister finnas beskrivna. Vissa av dessa brister kan endast upptäckas vid användning av produkten, därför krävs det att produkterna testas av användare (Ottersten 2006, s. 93).
En expertutvärdering ska genomföras när produkten är färdigutvecklad eller så gott som färdigutvecklad gällande användargränssnitt. Gränssnittet kan vara formgiven som pappers- eller körbar prototyp (Ottersten 2006, s. 94).
2.1.5.2 Användartest
Användartest är en kostnadseffektiv teknik att få fram hur väl en produkt fungerar i ett faktiskt användningssammanhang. Eventuella problem som kan komma att uppstå vid
användning av produkten identifieras då användare utför realistiska arbetsuppgifter och testet ska utföras i en så naturlig miljö som möjligt (Ottersten 2006, ss. 98-99).
Strukturerat användartest innebär att användaren får ett antal realistiska uppgifter att lösa och ska under tiden förklara sina tankar (Ottersten 2006, ss. 99-100).
Trots fördelarna med användartest ger de inte nödvändigtvis en fullständig bild över hur effektiv en webbplats eller applikation är när det gäller att nå ut till användarna. På grund av att användaren guidas genom webbplatsen blir effektiviteten lägre gällande frågor som (Frontend 2009a):
• Vilken typ av meddelanden tar användaren till sig runt om på webbplatsen? • Vilka områden drar till sig uppmärksamhet då de själva navigerar på webbplatsen
snarare än följer instruktioner?
• Hur lång tid stannar en typisk användare kvar på webbplatsen efter att testproceduren är avklarad?
De mest kritiska frågorna; varför användare beter sig på ett specifikt sätt och vilka intryck de får av webbplatsen under sitt besök, kan vara svåra att få svar på genom användartester. Att tillåta så pass fritt surfande som möjligt och att möjliggöra för användarna att lämna
webbplatsen kan dock underlätta. Istället för att användarna ska besvara givna frågor under hela testet, är det bra att uppmuntra dem till att tänka fritt och kontinuerligt uttrycka sina känslor gällande innehållet (Frontend 2009a).
2.2 Design
Designaktiviteten är att beskriva hur webbplatsens användargränssnitt ska se ut och fungera (Molich, 2002 s. 59). Enhetlig design har stor betydelse för användbarheten. En icke-enhetlig design förvirrar istället användaren (Molich 2002, ss. 123-124).
2.2.1 Designens uppgift
Gulliksen (2002, s. 235) menar att en god design alltid på ett bra och passande sätt ska försöka lösa den spänning som byggs upp mellan estetiska och funktionella mål. På så sätt skiljer sig design från konst, vilken existerar för sin egen skull.
Gulliksen (2002, s. 237) menar att design i själva verket består av tre oskiljbara delar; varaktighet (eng. durability), nytta (eng. usefulness) och skönhet (eng. beauty). Dessa tre
17 komponenter blandas för att passa aktuell tillämpning. Paul Mijksenaar (1997) se Gulliksen (2002, s. 237) säger: ”Design is an activity that unities the elements of durability and
usefulness and intensifies the perception and beauty.”
Design kan forma information på flera olika sätt, exempelvis genom att poängtera, jämföra, ordna, gruppera eller sortera. Design kan också ge direkt eller försenad igenkänning eller en presentation av informationen på ett underhållande sätt (Paul Mijksenaar 1997, se Gulliksen 2002, s. 237).
2.2.2 Tillämpning av design
För att ge en så korrekt tillämpning av design som möjligt, bör följande fem punkter och deras respektive angreppsmetoder gås igenom (Gulliksen 2002, s. 239):
1. Förstå: Vad pågår och vilka problem ska lösas? Detta görs genom att studera och prata med användare. Utfallet ska sedan analyseras och dokumenteras.
2. Abstrahera: Vilka är problemets huvuddelar och vilken typ av information är aktuell? Hur används denna information och vad är viktigt respektive mindre viktigt? Detta görs genom skisser och listor som dokumenterar informationen.
3. Strukturera: Klargör förhållandet mellan de olika delarna som tagits fram.
4. Representera: Ta reda på hur designen bör representera informationen med tanke på användarnas bild. Angreppsmetoden för detta bör vara skisser, bildspel och olika typer av prototyper.
5. Detaljera. Vilka attribut ska användas, vilken stil och dynamik ska råda?
Det är viktigt att inte börja med det estetiska designarbetet för tidigt i processen. Det kan leda till att designen ser för färdig ut för tidigt och det kan då bli svårt att brainstorma fram nya designlösningar (Gulliksen 2002, s. 241).
2.2.3 Stöd för formgivningsprocessen
Moodboards är ett verktyg som hjälper formgivaren att utforska vilka känslor en produkt ska ge. Detta görs genom användning av bilder, ord, färg, typografi och andra tillgängliga verktyg. Resultatet blir ett kollage som används för att visa hur den slutliga designen ska uppfattas. Materialet till moodboarden kan komma från publicerade magasin och bildgallerier eller genom att designern skapar detta själv (Saffer 2007, ss. 108-109).
Traditionellt sett görs moodboards på stora pappersark, för att kunna hängas upp i
arbetsmiljön och fungera som en daglig inspirationskälla. De kan dock också skapas digitalt. Fördelen med digitala moodboards är att de kan innehålla både rörelse och ljud. Oavsett hur moodboarden utformas ska den visa på känslan som designen strävar efter att skapa hos produkten eller tjänsten. En moodboard ska inte utmana intellektet på samma sätt som konst gör utan påverka betraktarna på ett inneboende och direkt plan (Saffer 2007, ss. 108-109).
18
2.3 Grafisk form
Webbplatsers grafiska form innefattar områden som gestaltpsykologi, bildspråk, estetik, layout och färglära.
2.3.1 Gestaltlagar
Perceptionspsykologi förklarar hur människor uppfattar gestalter i en bild. Det finns uppsatta modeller för hur dessa gestalter uppträder. Dessa gestaltlagar presenteras nedan (Molich 2002, ss. 133-136):
Närhet
Symboler vilka ligger nära varandra i avstånd blir till en sammanhängande enhet.
Slutenhet
Symboler inom en ram eller vita ytor som avgränsar materialet upplevs som sammanhängande.
Likhet
Symboler vilka är lika varandra till form och/eller färg anses vara sammankopplade med varandra.
Kontinuitet
Symboler vilka följer ett likartat och kontinuerligt mönster upplevs som en sammanhängande helhet.
Regeln om kontrast är ingen fastställd gestaltlag men är likväl en modell för hur människor upplever gestalter i bilder. Kontrasten ska vara så pass kraftig att användarna med säkerhet lägger märke till den (Molich 2002, s. 136). En webbplats kan byggas upp av kontrastverkan mellan form, storlek, färg, placering, orientering samt rörelse av objekt (Molich 2002, s. 37).
2.3.2 Bildspråk
För att få ut rätt budskap till avsedd målgrupp, spelar bilder en stor roll. Det måste finnas ett syfte med att använda en bild och den ska förstärka eller förklara budskapet som ges i texten. Att använda ett konsekvent bildspråk ger möjlighet till igenkänning och att skapa trovärdighet i publicerat material (Göteborgs universitet, 2008).
2.3.3 Grafisk form på webben
Enligt Nielsen (1993) se Gulliksen (2002, s. 23) är närmare femtio procent av ett systems programkod tillägnat användargränssnittet, det vill säga webbplatsens visuella utseende. Grafik, HTML-kod och tjusiga färger är ingen garanti för att webbplatsen blir användbar. De ger dock en större möjlighet att skapa en användbar dialog mellan användare och företag (Molich 2002, s. 7).
19 På en webbplats finns det både nyttig och stödjande grafik. Nyttig grafik består av nödvändig information i form av exempelvis produktbilder eller kartor. För denna typ av information är det ofta en fördel att använda sig av tumnaglar. Det som benämns som stödjande grafik har till uppgift att stödja webbsidans struktur. Den stödjande grafiken kan exempelvis fungera som en tydlig avgränsning mellan webbsidans navigations- och informationsdelar (Molich 2002, s. 125).
Bildelement på webbplatser bör uppfylla ett antal kriterier. De ska vara relevanta och ha ett logiskt samband med webbplatsens text eller övriga innehåll och budskap. En bild ska aldrig behöva förklaras, särskilt inte vid användning som ikon (Molich 2002, s. 129).
2.3.4 Estetikens roll för användbarhet
Estetik är vetenskapen om hur människan uppfattar världen genom de fem sinnena, syn, hörsel, lukt, smak och känsel. Alla stimulus kan influera den interaktion som ständigt sker mellan människan och hennes omvärld. Det är vanligt förekommande att estetik och
användbarhet separeras, som om de vore två vitt skilda saker. Eftersom estetiken handlar om hur saker uppfattas finns det ingen mening med att skilja mellan hur någonting ser ut och hur det fungerar (Andersson, 2009).
Gällande webbplatser handlar estetik inte bara om utseendet eller andra visuella effekter, utan om hur människor reagerar på dem. Estetik kan kommunicera funktion genom
brukskvaliteter, det vill säga sådana element som hjälper användare att förstå hur de kan interagera med olika objekt. Element som på skärm efterliknar fysiska element, ger
användarna ledtrådar till att elementet fungerar på samma sätt som i den verkliga världen. Ser ett element ut som en knapp, är det troligtvis en knapp. Ledtrådarna skapas genom
användning av skuggor, toningar och färger. Dessa estetiska val uppmärksammas sällan, förutom när de blir fel så att det visuella intrycket kommer i konflikt med budskapet (Andersson, 2009).
Neurobiolog António Damásio har sagt: “[...] Emotion is not a luxury […]. It plays a critical role in virtually all aspects of learning, reasoning, and creativity.” Hur vi tänker kan med andra ord inte separeras från hur vi känner. Forskning i ämnet har visat att en visuellt attraktiv knapp är mer användbar för de flesta människor än en knapp med mindre lockande utseende. På samma sätt som människor skapar sig uppfattningar om andra människor beroende på hur de klär och uppför sig, skapar de sig också uppfattningar om olika produkter utifrån
produkternas utseende. Produkter har personligheter, vilka ligger till grund för identifiering med eller avståndstagande till produkten samt om användarna kan känna tillit till den. Det är därmed viktigt att vid formgivningsfasen betänka vilka förväntningar en viss personlighet bär med sig (Andersson, 2009).
Den primära faktorn som människor använder för att värdera en webbplats trovärdighet är den visuella designens övergripande dragningskraft. Detta innefattar layout, typografi,
teckenstorlek och färgscheman. Att lägga mycket tid på detaljer i designen indikerar för användarna att samma omsorg har lagts på de mindre synliga delarna av produkten och att den därmed går att lita på (Andersson, 2009).
2.3.5 Layout
Layouten ses som kärnan i visuell design och visar hur gränssnittets designelement så som knappar och ikoner liksom innehåll ska placeras över den givna ytan (Saffer 2007, s. 123).
20 Det misstag formgivare ofta gör är att de försöker fylla ytan som ges med så mycket
information och innehåll som möjligt. Detta ger ett rörigt intryck vilket också leder till låg användbarhet. Ögat kommer att hoppa från en sak till en annan utan att se ett klart
informationsflöde eller särskiljning mellan sidans olika delar. Att använda sig av vit yta för att särskilja gränssnittets olika delar skapar en renare och klarare design. En ytterligare orsak till varför för mycket information inte bör klämmas in på samma yta är att människans hjärna, genom gestaltpsykologin, upplever närliggande objekt som samhöriga. Detta är fördelaktigt då formgivare vill skapa samband men kan också skapa förvirring då orelaterade objekt flyter ihop (Saffer 2007, s. 126).
Formgivare bör arbeta med att ge sina användare ledtrådar till var de ska fästa blicken. Färg liksom typografi kan utnyttjas för att attrahera ögat. Linjer och rutor i sin tur kan användas för att linjera och gruppera objekt. Linjer och rutor bör dock användas med måtta och ofta
ersättas med vit yta då de annars tenderar att stjäla fokus från innehållet (Saffer 2007, s. 127).
2.3.6 Färg
Saffer (2007, s. 131) menar att färg har en rad olika uppgifter i ett visuellt gränssnitt. Den kan användas för att skapa personlighet och sätta en ton på innehållet, men också ge ledtrådar till användaren. Färg kan skapa samhörighet mellan åtskilda objekt över webbplatsen genom att dessa tilldelas samma färg. Färg kan också ange graden av betydelse beroende på om färgen är mättad eller omättad.
Genom att lägga till färg i formgivningen kan formgivaren ändra webbplatsens hierarki och på så sätt få objekt att stå ut och leda betraktaren till rätt plats i rätt ordning. På grund av detta är det ett smart val att börja strukturera en webbplats i svartvitt för att i ett senare stadium ge olika objekt färg efter hur de är strukturerade (Gärde 2007, s. 236).
Gärde (2007, s. 289) skriver att färgsättning i treklang innebär att det skapas en blandning mellan primärfärgerna, vilket aktiverar ögonens alla synceller. När ögats alla synceller aktiverats upplevs färgkompositionen vara balanserad, varken för varm eller för kall. Vidare menar Gärde (2007, s. 294) att ögat söker harmoni, det vill säga att hjärnan vill aktivera alla tre synceller så jämlikt som möjligt.
Designers kan skapa kontraster och framhäva färger mot varandra genom att utnyttja färgers lyskraft och temperatur. Beroende på vilka färger som omger en yta kan ytan antingen förlora eller öka i lyskraft (Gärde 2007, ss. 302-309).
Saffer (2007, ss. 131-133) påpekar att färg kan missbrukas. En webbplats kan uppfattas som allt ifrån grå och platt till en ren cirkus beroende på färgval och färgernas mättnad och
opacitet. Eftersom människans öga är väl justerat efter färg och våra hjärnor påverkas av färg såväl medvetet som omedvetet är det ett av de mest kraftfulla verktygen i visuell design.
2.4 Informationsstruktur på webben
Enligt Frontend (2009b) ligger utvecklarnas inledande fokus ofta på webbplatsens
navigations- och filstruktur. I verkligheten tenderar användare att förlita sig mindre på sådana navigationshjälpmedel än vad ansvariga utvecklare tror. Majoriteten av användarna är mer inriktade på att nå sina mål än att förstå en underliggande logisk struktur.
Navigerande strukturer möjliggör för användaren att förstå sidan men inte att hjälpa dem slutföra sina specifika uppgifter. För att kunna stödja användaren i sådana situationer krävs
21 det att webbplatsen innehåller ledtrådar på varje enskild webbsida för att leda användaren rätt så enkelt och naturligt som möjligt (Frontend, 2009b).
Gällande webbplatsens innehåll finns ett antal uppsatta regler som varje webbdesigner bör följa för att maximera dessa ledtrådar. Länkar bör vara tillräckligt långa för att eliminera alla oklarheter hos användaren. Idealt ligger länkar insprängda i den beskrivande texten, som klargör var användarna hamnar om de följer länkarna. Länkar bör vara så specifika som möjligt och varje webbsida bör ha länkar som leder till så många olika delar av webbplatsen som möjligt. Informationen ska vara synlig i förväg. På så sätt får användaren en klarare bild av var länkarna går och har dessutom där och då läst någonting av värde (Frontend 2009b). Enligt Molich (2002, s. 59) finns det tumregler för hur informationsstruktur bör utformas för att ge en användarvänlig webbplats. På startsidan bör det finnas tydliga vägvisare till de viktigaste uppgifterna. Olika målgrupper ska ges möjlighet att ta olika vägar för att finna olika typer av innehåll, helst redan på startsidan. Det är viktigt att startsidan ska utformas så att den blir så användbar som möjligt för den primära målgruppen. Övriga målgruppers behov uppfylls genom tydliga länkar från startsidan.
Molich (2002, s.59) menar också att besökarna inte ska behöva klicka sig igenom en lång struktur innan de kommer till den sida där de kan lösa sin uppgift. De viktigaste uppgifterna ska kunna lösas med att besöka så få sidor som möjligt och följden av sidor ska vara
optimerad så att användarna kommer till det viktigaste innehållet först. Om en sida innehåller många upplysningar, kan detta lösas med ett fliksystem och att eventuellt dubblera
information som ska synas i flera olika sammanhang. Webbplatsens undersidor bör också te sig så lika som möjligt.
2.4.1 Principer för begriplig design
Enligt Molich (2002, s. 69) finns det ett antal principer att följa för, vad han kallar en begriplig design. Dessa är som följer:
Sätt användaren i centrum
Se Internet som ett verktyg för att snabbt och effektivt ge svar på en viss fråga eller lösa en viss uppgift (Molich 2002, s. 70).
Synliggör användarens möjligheter
Webbplatsen ska visa användare vad de behöver göra och den ska vara intuitiv. Det är användarens möjligheter som ska vara synliga, inte organisationen bakom eller utmärkelser som tagits emot (Molich 2002, s. 73).
Tala om vad som händer
Webbplatsen ska tala om för användaren vad den håller på med, exempelvis vid tidskrävande dataöverföringar. Den ska förutse och besvara rimliga frågor (Molich 2002, s. 76).
2.4.2 Att skriva för webben
Det finns tre viktiga principer att ta fasta på vid författandet av texter för webben. För det första får webbplatsen inte se ut eller kännas som en annons. Det primära skälet till att människor vistas på Internet är för att söka information. Webbplatsens uppgift är därför att
22 presentera information som är relevant för kunderna och för att öka trovärdigheten bör texten ha en redaktionell känsla. Försäljningsstrategin som bör tillämpas är att erbjuda tilltalande innehåll som intresserar besökarna, till skillnad från tryckt material där strategin ofta är att mata texten med försäljningsargument (Veloso 2005, s. 11).
För det andra gäller det att fånga besökarnas uppmärksamhet. Det är viktigt att ge känslan av att webbplatsen presenterar nyheter, inte reklam eller annonser för företagets produkter eller tjänster (Veloso 2005, s. 13).
Till sist är syftet med att ha en webbplats att få någon slags respons från besökarna. Responsen kan ske i form av exempelvis telefonsamtal, e-post eller någon typ av inköp på webbplatsen (Veloso 2005, s. 16).
Rubrikerna är en av de viktigaste delarna på webbplatsen. Ofta är länkar både inom och utanför webbplatsen identiska med rubrikerna som finns på webbsidorna. Rubrikerna måste därför kunna stå för sig själva och locka till klickning eller vidare läsning av brödtexten. Det rekommenderas att variera längden på texterna och att kombinera korta inledande texter med längre och mer detaljerade. På så sätt tillfredsställs behoven för både de som vill se det viktigaste direkt och de som vill veta ha mer ingående information (Geijer, 2008).
2.4.2.1 Särskilj företaget genom orden
På Internet spelar det ingen roll hur stort eller litet företaget är, alla har samma tekniska förutsättningar att arbeta efter. Innehållet på webbplatsen kommer att presenteras på en skärm och begränsad bandbredd är en ständig faktor att ta hänsyn till. Orden blir därmed det främsta verktyget för att skilja ut företaget från konkurrenterna. Ett unikt tilltal skiljer ut företaget på ett mer effektivt sätt än uppseendeväckande tekniker som konkurrenterna snabbt kan ta efter. Ord är heller inte begränsade till en viss mjukvaruplattform (Usborne 2002, ss. 30-39).
Ordens betydelse för besökarnas upplevelse av webbplatsen uttrycker Jakob Nielsen (1999) se Usborne (2002, s. 23) på följande vis:
When writing for the web, you’re not only affecting the content, you’re affecting the core user experience because users look at the text and the headlines first. Although it’s important to be grammatically correct, it’s also important to present the content in a manner that draws in readers.
Orden spelar alltså roll för webbplatsens innehåll, användarupplevelsen och är också en faktor för att locka besökare till webbplatsen. Veloso (2005, s. 28) menar att det viktigaste för att skriva bra webbcopy är att ha koll på sitt mål, sin målgrupp och produkten eller tjänsten som saluförs.
2.4.2.2 Tilltal
Veloso (2005, ss. 22-26) listar ett antal punkter som bör finnas i åtanke gällande tilltal: • Sträva efter att skriva så som en person pratar till en annan.
• Använd vardagsuttryck, det ger ett familjärt intryck. • Undvik krångligt affärsspråk och fackuttryck. • Försök inte imponera med en tjusig vokabulär. • Var inte självupptagen eller arrogant.
