Introduktion till användbarhet Det är  inte  mänskligt att fela. Det är något produktutvecklare tutar i oss när de strunta...
Välkomna! intranät extern webb Synlig i sökmotorerna. Kvalitetssäkrad. Tillgänglig för funktionshindrade. Lätt att hitta, ...
Upplägg <ul><li>Användbarhet </li></ul><ul><ul><li>vad är användbarhet </li></ul></ul><ul><ul><li>vilken nytta ger hög anv...
Möten med användbarhet
Älskling, kan du ställa om klockan på videon? Asch, jag satte på fel platta! Vi får vänta lite till på potatisen. Men va f...
Slutsatser / utgångspunkter <ul><li>Många produkter är formgivna för att spara tid men misslyckas </li></ul><ul><li>Det fi...
Vad vill vi med användbarhet? <ul><li>Förbättra sådant som funkar dåligt. </li></ul><ul><li>Visa hänsyn inför problem och ...
Vad vinner vi på hög användbarhet? <ul><li>När organisationer designar för hög användbarhet och förståelse, upptäcker de e...
Varför är det svårt? människans förmåga att ta till sig information 2005 1800 informationsmängd var dag tid
informationsöverflöd kaos ilska svårt att få/hitta rätt information svårt att förstå informationen frustration besvikelse ...
Hur ska vi börja med webben? <ul><li>För att uppnå hög användbarhet måste vi eliminera sådant som gör webbsajten  långsam ...
Vad är vår webb? <ul><li>Information ämnad för kunder, intressenter, allmänhet (så kallade målgrupper/människor). Är det i...
Användbarhet handlar om…
Vad är hög användbarhet på webben? <ul><li>En ovan användare går in på en webbsajt och kan  snabbt och enkelt  få svar på ...
 
Varför blir det låg användbarhet? <ul><li>Webbprojekt börjar ofta i fel ände, med teknik i stället för människor (man miss...
Paradox? <ul><li>En webbsajt kan vara  användbar  eftersom den utför alla aktiviteter som behövs, men den kan ha  låg   an...
 
Upp med handen <ul><li>Hur många tror att era användare har svårt att hitta information på er webbplats och/eller intranät...
Vanliga missuppfattningar <ul><li>Alla kan använda en mus </li></ul><ul><li>Alla kan uppgradera webbläsaren eller installe...
Vilka typer av problem uppstår? <ul><li>Användare har svårt att förstå </li></ul><ul><ul><li>texter </li></ul></ul><ul><ul...
Varför uteblir testerna? <ul><li>” Vi har inte tid” </li></ul><ul><li>” Vi har inte pengar” </li></ul><ul><li>” Vi har int...
Efter pausen: hur man identifierar vanliga brister
Hitta fel <ul><li>Heuristisk analys (expertgranskning) är en diagnostisk metod där experter antar rollen som mindre erfarn...
Vad vi uppmärksammar var är jag? förstår jag i vilket sammanhang informationen återges? vad kan jag göra? får jag en enkel...
Var är jag? <ul><li>Design </li></ul><ul><ul><li>var leds blicken </li></ul></ul><ul><li>Gäller  alla  sidor </li></ul><ul...
Vilka val finns tillgängliga? <ul><li>Vad är huvudkategorierna </li></ul><ul><li>Ordningen på länkarna signalerar priorite...
 
Vad händer om jag klickar? <ul><li>Ordförståelse </li></ul><ul><li>Sidor som öppnas i nytt fönster </li></ul><ul><li>Länka...
Recalculate total / Remove products Product catalog Empty basket Buy products
Var är jag nu? <ul><li>Brödsmulor </li></ul><ul><li>Aktiverade menyval markerade </li></ul><ul><li>Djupa strukturer är svå...
 
När du måste förklara Ja, så är det förstås! Oj, hur ska jag komma ihåg det?
Vad ingen bör göra <ul><li>Utesluta användare på grund av </li></ul><ul><ul><li>webbläsare och webbläsarteknologier </li><...
Viktigast när jag undersöker/testar? <ul><li>Hinna med många iterationer. </li></ul>Ähm, är det här navigationen? Åh tusan...
Vad testar man? <ul><li>Konkurrenters sajter </li></ul><ul><li>Skisser </li></ul><ul><li>Designförslag </li></ul><ul><li>P...
Användbarhetstest, steg för steg <ul><li>Vilka krav finns på webbplatsen och vilka affärsmål skall den stödja?  </li></ul>...
Goda nyheter! <ul><li>Historiskt sett har det varit svårt att bygga webbsajter för massor av olika webbläsare och operativ...
Slutsatser <ul><li>Användbarhet handlar om effektivitet. Användare ska snabbt kunna utföra uppgifter och nå tydliga mål. A...
Bra länkar <ul><li>Jakob Nielsen, Alertbox  http:// www.useit.com / alertbox /   </li></ul><ul><li>Keith Instone, Usable W...
Frågor, kommentarer Vad sa han?
Upcoming SlideShare
Loading in …5
×

Introduktion till användbarhet på webben

3,819 views

Published on

En hyfsat heltäckande guide till användbarhet på webben för alla som på något sätt har ansvar för en webbplats.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,819
On SlideShare
0
From Embeds
0
Number of Embeds
59
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Introduktion till användbarhet på webben

  1. 1. Introduktion till användbarhet Det är inte mänskligt att fela. Det är något produktutvecklare tutar i oss när de struntat i användbarhet. Med några väl valda ord om tillgänglighet…
  2. 2. Välkomna! intranät extern webb Synlig i sökmotorerna. Kvalitetssäkrad. Tillgänglig för funktionshindrade. Lätt att hitta, använda och förstå. AB_? C Tack. Integrerad I övrig kommunikation. Vi gör din webb… Muntlig info
  3. 3. Upplägg <ul><li>Användbarhet </li></ul><ul><ul><li>vad är användbarhet </li></ul></ul><ul><ul><li>vilken nytta ger hög användbarhet </li></ul></ul><ul><ul><li>vanliga problem </li></ul></ul><ul><ul><li>hur hittar man brister </li></ul></ul><ul><li>Pratar inte om: </li></ul><ul><ul><li>behovsanalys </li></ul></ul><ul><ul><li>sökbarhet / sökmotoroptimering </li></ul></ul><ul><ul><li>tillgänglighet (så mycket) </li></ul></ul>
  4. 4. Möten med användbarhet
  5. 5. Älskling, kan du ställa om klockan på videon? Asch, jag satte på fel platta! Vi får vänta lite till på potatisen. Men va f-n? Vilken dammsugar-påse är det vi ska ha nu igen? Men, hur får jag i backen? Uh! Jaha, tack, jag trodde den gick inåt…
  6. 6. Slutsatser / utgångspunkter <ul><li>Många produkter är formgivna för att spara tid men misslyckas </li></ul><ul><li>Det finns en brist på förståelse för hur design påverkar människor </li></ul><ul><li>Mänskliga misstag kostar pengar </li></ul><ul><li>Människor klandrar sig själva </li></ul><ul><li>Mycket går att göra bättre </li></ul>Tänk om det kunde funka så här i stället…
  7. 7. Vad vill vi med användbarhet? <ul><li>Förbättra sådant som funkar dåligt. </li></ul><ul><li>Visa hänsyn inför problem och mänskliga behov. </li></ul><ul><li>Göra livet lättare. </li></ul><ul><li>Minimera fel. </li></ul>Skönt, datorn ställde om klockan själv…
  8. 8. Vad vinner vi på hög användbarhet? <ul><li>När organisationer designar för hög användbarhet och förståelse, upptäcker de en strategisk konkurrensfördel : </li></ul><ul><ul><ul><li>Användare sparar tid och pengar och blir mer nöjda. </li></ul></ul></ul>Vad smidigt, det måste jag utnyttja! Och jag måste berätta för Lasse.
  9. 9. Varför är det svårt? människans förmåga att ta till sig information 2005 1800 informationsmängd var dag tid
  10. 10. informationsöverflöd kaos ilska svårt att få/hitta rätt information svårt att förstå informationen frustration besvikelse inte en effektiv och nöjd användare
  11. 11. Hur ska vi börja med webben? <ul><li>För att uppnå hög användbarhet måste vi eliminera sådant som gör webbsajten långsam och svår att använda. </li></ul><ul><li>För att förstå vad som gör sajten svår och långsam att använda måste titta på hur användarna använder webbsajten. </li></ul><ul><li>Internt måste vi vara överens om vad vår webbsajt är och hur den kompletterar verksamheten . </li></ul>
  12. 12. Vad är vår webb? <ul><li>Information ämnad för kunder, intressenter, allmänhet (så kallade målgrupper/människor). Är det intranät så handlar det om medarbetare. </li></ul><ul><li>Möjlighet för människor att få svar på frågor. </li></ul><ul><li>Möjlighet för människor att begära tjänster utförda. </li></ul><ul><li>Ett stöd i arbetet. </li></ul><ul><li>En informationskälla dit människor vänder sig med en specifik frågeställning. </li></ul><ul><ul><ul><li>en informations- och kommunikationskanal skapad av människor för människor </li></ul></ul></ul>
  13. 13. Användbarhet handlar om…
  14. 14. Vad är hög användbarhet på webben? <ul><li>En ovan användare går in på en webbsajt och kan snabbt och enkelt få svar på en fråga eller utföra en förutbestämd uppgift. Återkopplingen går att förstå och använda sig av, och hon känner tillfredställelse över att ha uppnått målet. </li></ul><ul><ul><ul><li>inga missförstånd och inga misstag </li></ul></ul></ul>
  15. 16. Varför blir det låg användbarhet? <ul><li>Webbprojekt börjar ofta i fel ände, med teknik i stället för människor (man missuppfattar vad en webbsajt är). </li></ul><ul><li>De viktigaste personerna, användarna, är sällan involverade i utvecklingen av webbplatsen. </li></ul><ul><li>Formgivare har en webbvana som flerfaldigt överskrider de flesta användares webbvana. </li></ul><ul><li>Formgivare har skärmar, datorer och internetuppkopplingar som de flesta webbanvändare bara kan drömma om. </li></ul><ul><li>Formgivare utmärker sig inte genom att följa konventioner. </li></ul>
  16. 17. Paradox? <ul><li>En webbsajt kan vara användbar eftersom den utför alla aktiviteter som behövs, men den kan ha låg användbarhet om dess komplexitet gör den svår att använda effektivt för nybörjare. </li></ul><ul><li>www.fk.se – anmäla sjukt barn </li></ul>
  17. 19. Upp med handen <ul><li>Hur många tror att era användare har svårt att hitta information på er webbplats och/eller intranät? </li></ul>
  18. 20. Vanliga missuppfattningar <ul><li>Alla kan använda en mus </li></ul><ul><li>Alla kan uppgradera webbläsaren eller installera en plug-in </li></ul><ul><li>När användarna inte förstår är det för att de är (a) ovilliga att lära sig (b) lata (c) dumma </li></ul><ul><li>Förstasidan är allt </li></ul><ul><li>Det räcker om jag låter mina kollegor testa </li></ul><ul><li>Användbarhet hämmar snygg design </li></ul><ul><li>Användbarhet handlar om blå, understrukna länkar, max 8 sekunder i nedladdningstid, 2 klick till innehåll… annars går användarna någon annanstans </li></ul>
  19. 21. Vilka typer av problem uppstår? <ul><li>Användare har svårt att förstå </li></ul><ul><ul><li>texter </li></ul></ul><ul><ul><li>vad som ligger bakom varje menyval/rubrik, </li></ul></ul><ul><ul><li>var de befinner sig i strukturen </li></ul></ul><ul><ul><li>hur de hittar tillbaka till tidigare vyer </li></ul></ul><ul><ul><li>den snabbaste vägen för att lösa en uppgift </li></ul></ul><ul><li>Webbsajter har låg tillgänglighet </li></ul><ul><ul><ul><ul><ul><li>användare ser inte sajten som det är tänkt </li></ul></ul></ul></ul></ul>
  20. 22. Varför uteblir testerna? <ul><li>” Vi har inte tid” </li></ul><ul><li>” Vi har inte pengar” </li></ul><ul><li>” Vi har inte expertisen” </li></ul><ul><li>” Vi har inget användbarhetslabb” </li></ul><ul><li>” Vi vet inte hur man tolkar resultatet” </li></ul>
  21. 23. Efter pausen: hur man identifierar vanliga brister
  22. 24. Hitta fel <ul><li>Heuristisk analys (expertgranskning) är en diagnostisk metod där experter antar rollen som mindre erfarna användare och identifierar potentiella problem. </li></ul>
  23. 25. Vad vi uppmärksammar var är jag? förstår jag i vilket sammanhang informationen återges? vad kan jag göra? får jag en enkel överblick över mina valmöjligheter och förstår jag i förväg vad som händer när jag väljer att göra något? hur kommer jag tillbaka där jag var? för att återgå till en tidigare vy och göra ett nytt val därifrån, vad är enklaste vägen dit? <ul><li>barriärer till information </li></ul><ul><li>ordval /begrepp, krystat språk </li></ul><ul><li>bildelement som tar uppmärksamhet från information </li></ul><ul><li>plottrigt gränssnitt </li></ul><ul><li>opersonligt tilltal </li></ul><ul><li>skrollning </li></ul><ul><li>miljö / mänskliga egenskaper </li></ul><ul><li>stress </li></ul><ul><li>bullrig miljö </li></ul><ul><li>funktionshinder </li></ul><ul><li>förutfattade meningar </li></ul><ul><li>erfarenhet av webb-gränssnitt </li></ul><ul><li>en mus som trilskas </li></ul>INFO A-Ö SÖK
  24. 26. Var är jag? <ul><li>Design </li></ul><ul><ul><li>var leds blicken </li></ul></ul><ul><li>Gäller alla sidor </li></ul><ul><li>Ordval </li></ul><ul><li>Informationsstruktur </li></ul><ul><li>Antalet val </li></ul>Hej, här är jag – vad är det här för något? Hej, vad trevligt att du kom. Du kan läsa om dagens program och söka efter tidigare program. Du kan också låna eller köpa program, om du är en skola.
  25. 27. Vilka val finns tillgängliga? <ul><li>Vad är huvudkategorierna </li></ul><ul><li>Ordningen på länkarna signalerar prioritet </li></ul><ul><li>Konsekventa menyer </li></ul><ul><li>Vad är klickbart </li></ul>Varför går inte bilden att klicka på?
  26. 29. Vad händer om jag klickar? <ul><li>Ordförståelse </li></ul><ul><li>Sidor som öppnas i nytt fönster </li></ul><ul><li>Länkar som leder till andra webbplatser </li></ul><ul><li>Flera länkar till samma innehåll </li></ul>Varför funkar inte bakåt-knappen? Klicka här Avancerad sökning Karriärmöjligheter FAQ E-giro
  27. 30. Recalculate total / Remove products Product catalog Empty basket Buy products
  28. 31. Var är jag nu? <ul><li>Brödsmulor </li></ul><ul><li>Aktiverade menyval markerade </li></ul><ul><li>Djupa strukturer är svåra </li></ul>Jag har ingen aning om var jag är!!
  29. 33. När du måste förklara Ja, så är det förstås! Oj, hur ska jag komma ihåg det?
  30. 34. Vad ingen bör göra <ul><li>Utesluta användare på grund av </li></ul><ul><ul><li>webbläsare och webbläsarteknologier </li></ul></ul><ul><ul><li>uppkoppling </li></ul></ul><ul><ul><li>handikapp </li></ul></ul>Vad sjutton!? Varför syns inte sidan!?
  31. 35. Viktigast när jag undersöker/testar? <ul><li>Hinna med många iterationer. </li></ul>Ähm, är det här navigationen? Åh tusan. Fixa. Vad är FAQ för något? Åh tusan.
  32. 36. Vad testar man? <ul><li>Konkurrenters sajter </li></ul><ul><li>Skisser </li></ul><ul><li>Designförslag </li></ul><ul><li>Prototyp </li></ul><ul><li>Befintlig webb </li></ul><ul><li>Delar av befintlig webb </li></ul><ul><ul><li>Kontaktformulär </li></ul></ul><ul><ul><li>Förståelse av specifika sidor </li></ul></ul><ul><ul><li>etceteras. </li></ul></ul>
  33. 37. Användbarhetstest, steg för steg <ul><li>Vilka krav finns på webbplatsen och vilka affärsmål skall den stödja? </li></ul><ul><li>Definiera en användarprofil och rekrytera personer som matchar </li></ul><ul><li>Skapa en diskussionsguide som leder användarna genom testet </li></ul><ul><li>Genomför intervjuerna/sittningarna </li></ul><ul><li>Analysera resultatet </li></ul><ul><li>Utarbeta och presentera rekommenderade förändringar </li></ul><ul><li>Åtgärda </li></ul><ul><li>Gör om </li></ul>
  34. 38. Goda nyheter! <ul><li>Historiskt sett har det varit svårt att bygga webbsajter för massor av olika webbläsare och operativsystem. </li></ul><ul><li>Det är i dag lättare än för ett år sedan att anpassa en webbsajt för fler människor. </li></ul><ul><li>Man bygger inte längre för olika webbläsare och operativsystem – man bygger för tillgänglighet och användbarhet (med hjälp av standarder). </li></ul>
  35. 39. Slutsatser <ul><li>Användbarhet handlar om effektivitet. Användare ska snabbt kunna utföra uppgifter och nå tydliga mål. Allt som gör processen långsammare (som krångliga ord eller svårtydbar navigering) hämmar användbarheten. Omvänt så förhöjs användbarheten av enkel, intuitiv navigation och upplysande texter. </li></ul><ul><li>Tester är inte engångsföreteelser. Du gör något, testar, fixar och testar igen. </li></ul>
  36. 40. Bra länkar <ul><li>Jakob Nielsen, Alertbox http:// www.useit.com / alertbox / </li></ul><ul><li>Keith Instone, Usable Web http:// www.usableweb.com / </li></ul><ul><li>Dive into Accessibility http:// www.diveintoaccessibility.org / </li></ul><ul><li>Yale/CAIM, Web Style Guide http:// www.webstyleguide.com </li></ul><ul><li>Worldwide Web Consortium (W3C), Web Accessibility Initiative http://www.w3.org/WAI/ </li></ul><ul><li>World Wide Web Consortium (W3C) HTML Validation Service http://validator.w3.org/ </li></ul>
  37. 41. Frågor, kommentarer Vad sa han?

×