Vägledningen 24-timmarswebben –  få fler att använda er webbplats Magnus Burell och Peter Krantz, Verva
 
 
Källa: ”The Design of Everyday Things”, Donald Norman,  SAS Coffee Pot: www.ergonomidesign.se
 
Nya krav <ul><li>Internationalisering </li></ul><ul><li>Åldrande befolkning </li></ul><ul><li>Högre förväntningar </li></u...
Tillgängligt och användbart - för alla! ” Myndigheternas  elektroniska tjänster skall utformas och tillhandahållas på ett ...
 
 
Få stöd i  Vägledningen 24-timmarswebben <ul><li>Ca 150 riktlinjer för utveckling av   webb och e-tjänster i offentlig sek...
<ul><li>Varför använda vägledningen? </li></ul><ul><li>Få ut mer  av er investering i webbplatsen </li></ul><ul><li>Nå fle...
Effektivare och bättre service <ul><li>Fler ska  kunna  använda er webbplats     Bygg och publicera rätt! </li></ul><ul><...
Kapitel utifrån vägledningens  målgrupper och webbplatsens  livscykel <ul><li>Effektivare och bättre service </li></ul><ul...
Tydlig struktur och konkreta råd <ul><li>” Gör så här”- rubrik </li></ul><ul><li>Prioritet 1 till 3 </li></ul><ul><li>Moti...
2: Utvecklingsprocessen <ul><li>Definiera de  förväntade effekterna  med webbsatsningen </li></ul><ul><li>Kartlägg och eff...
Vad vill er verksamhet uppnå med er webbplats? <ul><li>De önskade effekterna uppstår när webbplatsen används </li></ul>
Förväntade effekter och uppföljning <ul><li>Vilken effekt vill vi uppnå med webbplatsen eller tjänsten? </li></ul><ul><ul>...
Hantera gapet <ul><li>Verksamhetsnytta realiseras genom  användning   </li></ul><ul><li>För att veta vilken design man beh...
Utgå från era målgruppers behov <ul><li>Vem  är användaren? </li></ul><ul><li>Var  och  när  sker användningen? </li></ul>...
Användarprofiler <ul><li>Användningsmål </li></ul><ul><li>Behov </li></ul><ul><li>Kompetens </li></ul><ul><li>Drivkrafter ...
IT-system i ditt arbete <ul><li>Arbetsmiljölagen (1977:1160) </li></ul><ul><li>” Teknik, arbetsorganisation och arbetsinne...
Arbeta med prototyper <ul><li>Skisser som beskriver funktioner  </li></ul><ul><li>Fungerar som kommunikation mellan projek...
 
 
<ul><li>Andra ingångar </li></ul><ul><li>Sverige och EU </li></ul><ul><li>Lag och rätt </li></ul><ul><li>Så fungerar offen...
 
 
Fungerar er webbplats i faktisk användning?
Fungerar er webbplats i faktisk användning? <ul><li>Utvärdera med  riktiga användare  som får göra  realistiska uppgifter ...
Exempel på användningstest Källa:  Exempel på användningstest – Problem att betala, av Inuse AB
3: Bygg rätt från början – följ standarder <ul><li>Gör den enklare för fler </li></ul><ul><li>Bygg struktur och navigation...
Tvinga inte er användare att tänka efter… <ul><li>1. Visa tydligt vad som är  klickbart/länkat </li></ul><ul><li>2. Visa t...
Kräv inte extraprogram för grundläggande  funktionalitet Till exempel: Javaskript eller Flash
Mätning – Örebro län okt 2007 2ggr per år:  www.verva.se/24-timmarswebben/matning
4: Webbplatsens innehåll och tjänster   <ul><li>Grundinformation </li></ul><ul><ul><li>Kontaktinformation </li></ul></ul><...
5: Stöd skumläsning <ul><li>Vem är läsaren? </li></ul><ul><li>Skriv enkelt och begripligt </li></ul><ul><ul><li>det viktig...
<ul><li>Beskriv  meningsbärande  bilder och grafiska objekt med  textalternativ . </li></ul>Pröva 2 minuter som blind… 1) ...
Samma sida för seende personer
5: Länkar och dokument <ul><li>Skriv självförklarande länkar </li></ul><ul><li>Undvik länkar som  klicka här ,  gå till… ,...
<ul><li>Alla länkar på sidan </li></ul><ul><li>Läs mer </li></ul><ul><li>Läs mer </li></ul><ul><li>Finns här </li></ul><ul...
Uppföljning av användning och innehåll <ul><li>Mät mot uppsatta mål </li></ul><ul><li>Kontrollera statistik och sökbeteend...
6: Webbinnehåll i mobila enheter <ul><li>Användningen ser annorlunda ut </li></ul><ul><li>Bygg plattformsoberoende </li></...
Specifik  mobiltjänst   eller  vanliga webbplatsen  i mobilen
7: Välja publiceringsverktyg <ul><li>Testa och ställa krav på: </li></ul><ul><li>Grundkonstruktion </li></ul><ul><li>Textf...
Kapitel utifrån vägledningens  målgrupper och webbplatsens  livscykel <ul><li>Effektivare och bättre service </li></ul><ul...
Kom igång! <ul><li>STEG LADDA NER </li></ul><ul><li>Avsätt resurser   argument, mätningar </li></ul><ul><li>Utbilda medar...
Mer stöd från Verva <ul><li>Frågor om webbutveckling och förslag: [email_address] </li></ul><ul><li>Intro-seminarium </li>...
Tack! <ul><li>Ladda ner extramaterial   –   www.verva.se/24-timmarswebben </li></ul><ul><li>Hör av dig –  vägledningen utv...
Upcoming SlideShare
Loading in...5
×

24timmarswebben Introduktion 2008 01 15

693

Published on

Introduktion till Vägledningen 24-timmarswebben - riktlinjer och praktiska tips för att bygga webbplatser i offentlig sektor. Se www.eutveckling.se

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
693
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Vad är och gör Verva? Varför är vi här idag?
  • 24timmarswebben Introduktion 2008 01 15

    1. 1. Vägledningen 24-timmarswebben – få fler att använda er webbplats Magnus Burell och Peter Krantz, Verva
    2. 4. Källa: ”The Design of Everyday Things”, Donald Norman, SAS Coffee Pot: www.ergonomidesign.se
    3. 6. Nya krav <ul><li>Internationalisering </li></ul><ul><li>Åldrande befolkning </li></ul><ul><li>Högre förväntningar </li></ul><ul><li>Tillgänglighet för alla </li></ul>
    4. 7. Tillgängligt och användbart - för alla! ” Myndigheternas elektroniska tjänster skall utformas och tillhandahållas på ett sådant sätt att de kan användas av alla och inte utestänger grupper av medborgare.” Regeringens skrivelse 2000/01:151 EU:s medlemsländer har enats om att 2010 ska alla offentliga webbplatser följa W3C:s riktlinjer för tillgänglighet WCAG. Riga-deklarationen 2006 och Handlingsplanen i2010 ” Kommuner och landsting skall behandla sina medlemmar lika, om det inte finns sakliga skäl för något annat.” Kommunallagen 1991:900, 2kap §2 ” Statliga myndigheter ska verka för att deras verksamhet, lokaler och information är tillgängliga för funktionshindrade”. Förordning 2001:526 och Handisams riktlinjer ”Riv hindren!
    5. 10. Få stöd i Vägledningen 24-timmarswebben <ul><li>Ca 150 riktlinjer för utveckling av webb och e-tjänster i offentlig sektor </li></ul><ul><li>Extramaterial </li></ul><ul><li>Skriven tillsammans med läsare och experter </li></ul><ul><ul><li>Myndigheter </li></ul></ul><ul><ul><li>Kommuner och landsting </li></ul></ul><ul><ul><li>Leverantörer/företag </li></ul></ul>
    6. 11. <ul><li>Varför använda vägledningen? </li></ul><ul><li>Få ut mer av er investering i webbplatsen </li></ul><ul><li>Nå fler - kan användas av fler personer </li></ul><ul><li>Ge enklare och effektivare service – spar tid för medborgare och företag </li></ul><ul><li>Bli tydligare beställare – få bättre leveranser </li></ul><ul><li>Er information och tjänster blir lättare hittade, lästa och förstådda </li></ul><ul><li>Bättre träffar i sökmotorer </li></ul><ul><li>Går att använda oberoende av användarens val av utrustning </li></ul>
    7. 12. Effektivare och bättre service <ul><li>Fler ska kunna använda er webbplats  Bygg och publicera rätt! </li></ul><ul><ul><li>Kunskap om olika förutsättningar </li></ul></ul><ul><ul><li>Följ webbstandarder, plattformsoberoende </li></ul></ul><ul><li>Fler ska vilja använda er webbplats  Användarcentrera! </li></ul><ul><ul><li>Utgå från era målgruppers behov och språk </li></ul></ul><ul><ul><li>Följ konventioner för layout och utseende </li></ul></ul><ul><ul><li>Utvärdera med riktiga användare </li></ul></ul>
    8. 13. Kapitel utifrån vägledningens målgrupper och webbplatsens livscykel <ul><li>Effektivare och bättre service </li></ul><ul><li>Utvecklingsprocessen </li></ul><ul><li>Standarder för webbplatser </li></ul><ul><li>Webbplatsens innehåll och tjänster </li></ul><ul><li>Håll webbplatsen levande </li></ul><ul><li>Webbinnehåll för mobila enheter </li></ul><ul><li>Publiceringsverktyg </li></ul><ul><li>Hjälpmedel </li></ul><ul><li>Extramaterial : Checklistor, exempel, kravdokument, testverktyg, argument </li></ul>
    9. 14. Tydlig struktur och konkreta råd <ul><li>” Gör så här”- rubrik </li></ul><ul><li>Prioritet 1 till 3 </li></ul><ul><li>Motiv: Vad och varför? </li></ul><ul><li>Åtgärd: Hur gör jag? Exempel och teknisk lösning </li></ul><ul><li>Mätbarhet: Hur testar jag? </li></ul><ul><li>Fördjupning </li></ul>Prioritet: 1
    10. 15. 2: Utvecklingsprocessen <ul><li>Definiera de förväntade effekterna med webbsatsningen </li></ul><ul><li>Kartlägg och effektivisera organisationens processer </li></ul><ul><li>Utgå från målgruppernas behov </li></ul><ul><li>Arbeta med prototyper och scenarior </li></ul><ul><li>Testa och utvärdera kontinuerligt </li></ul>
    11. 16. Vad vill er verksamhet uppnå med er webbplats? <ul><li>De önskade effekterna uppstår när webbplatsen används </li></ul>
    12. 17. Förväntade effekter och uppföljning <ul><li>Vilken effekt vill vi uppnå med webbplatsen eller tjänsten? </li></ul><ul><ul><li>Fler ansökningar? Färre fel i ansökningar? </li></ul></ul><ul><ul><li>Ökad kunskap hos våra målgrupper? </li></ul></ul><ul><ul><li>Mer kvalificerade frågor via telefon och mail? </li></ul></ul><ul><li>Har vi lyckats? När är vi nöjda? </li></ul><ul><ul><li>Hur många fler? Till vilket datum? </li></ul></ul>
    13. 18. Hantera gapet <ul><li>Verksamhetsnytta realiseras genom användning </li></ul><ul><li>För att veta vilken design man behöver måste man förstå hur den ska användas </li></ul><ul><li>Användbarhetsarbete handlar om att ta reda på detta innan tekniken finns </li></ul><ul><li>Användbarhetsarbete kan användas som länk mellan verksamhet och teknik i systemupphandling </li></ul>Källa: Erik Markensten ”Mind the Gap” Verksamhetsnytta Användarnytta Användarvänlighet       Teknik      
    14. 19. Utgå från era målgruppers behov <ul><li>Vem är användaren? </li></ul><ul><li>Var och när sker användningen? </li></ul><ul><li>Varför sker användningen? </li></ul><ul><ul><li>Besökaren har ett ärende att uträtta </li></ul></ul><ul><ul><li>Behov och drivkrafter </li></ul></ul>
    15. 20. Användarprofiler <ul><li>Användningsmål </li></ul><ul><li>Behov </li></ul><ul><li>Kompetens </li></ul><ul><li>Drivkrafter </li></ul><ul><li>Användningssituation </li></ul><ul><li>Baserad på faktiska data </li></ul><ul><li>Samlar all information om en användargrupp </li></ul>
    16. 21. IT-system i ditt arbete <ul><li>Arbetsmiljölagen (1977:1160) </li></ul><ul><li>” Teknik, arbetsorganisation och arbetsinnehåll skall utformas så att arbetstagaren inte utsätts för fysiska eller psykiska belastningar som kan medföra ohälsa eller olycksfall.” </li></ul><ul><li>” Målet är att arbetet ska kunna upplevas som en meningsfylld och berikande del av tillvaron.” </li></ul>
    17. 22. Arbeta med prototyper <ul><li>Skisser som beskriver funktioner </li></ul><ul><li>Fungerar som kommunikation mellan projektets olika intressenter </li></ul><ul><li>Underlag för test med användare </li></ul><ul><li>Fel kan upptäckas innan en rad kod är skriven </li></ul>www.verva.se/24timmarswebben/exempel
    18. 25. <ul><li>Andra ingångar </li></ul><ul><li>Sverige och EU </li></ul><ul><li>Lag och rätt </li></ul><ul><li>Så fungerar offentlig sektor </li></ul><ul><li>Nyckelord </li></ul>sök <ul><li>Situationer i livet </li></ul><ul><li>Fjalkjflfkldsafkljsdkfjf. Kajfaklfkalsfjlkasflkja. Bla fla mompa fomf ah fjakjf jaflkj. </li></ul><ul><li>Söka och byta arbete </li></ul><ul><li>Gå i Pension </li></ul><ul><li>Söka och byta arbete </li></ul><ul><li>Gå i Pension </li></ul><ul><li>Söka och byta arbete </li></ul><ul><li>Gå i Pension </li></ul><ul><li>Söka och byta arbete </li></ul><ul><li>E-tjänster </li></ul><ul><li>Med e-tjänster kan du få en service enkelt och bekvämt. </li></ul><ul><li>Följa ärenden och räkna ut </li></ul><ul><li>Räkna ut och jämföra </li></ul><ul><li>Följa ärenden och räkna ut </li></ul><ul><li>Räkna ut och jämföra </li></ul><ul><li>Följa ärenden och räkna ut </li></ul><ul><li>Kontaktuppgifter </li></ul><ul><li>Här hittar telefonnummer, adresser… </li></ul><ul><li>Myndigheter, bolag, organisationer </li></ul><ul><li>Län, landsting, regioner </li></ul><ul><li>Sveriges kommuner </li></ul><ul><li>Utdrag av adresslistor </li></ul>Sverige.se
    19. 28. Fungerar er webbplats i faktisk användning?
    20. 29. Fungerar er webbplats i faktisk användning? <ul><li>Utvärdera med riktiga användare som får göra realistiska uppgifter </li></ul><ul><li>Valda delar av befintlig webbplats, prototyper, skisser </li></ul><ul><li>Avsätt resurser för att åtgärda problemen som hittas </li></ul><ul><li>Öka er trygghet inför lanseringar </li></ul>
    21. 30. Exempel på användningstest Källa: Exempel på användningstest – Problem att betala, av Inuse AB
    22. 31. 3: Bygg rätt från början – följ standarder <ul><li>Gör den enklare för fler </li></ul><ul><li>Bygg struktur och navigation utifrån era användares förväntningar </li></ul><ul><li>Ge god läsbarhet </li></ul><ul><li>Färg, kontrast och typografi </li></ul><ul><li>Separera innehåll från layout  Mer oberoende av utrustning </li></ul><ul><li>Använd stilmallar – inte tabeller eller ramar </li></ul><ul><ul><li>Exempel: www.kungalv.se , www.su.se </li></ul></ul><ul><li>Bygg med relativa mått </li></ul><ul><ul><li>Förstora text </li></ul></ul><ul><ul><li>Flytande layout </li></ul></ul>
    23. 32. Tvinga inte er användare att tänka efter… <ul><li>1. Visa tydligt vad som är klickbart/länkat </li></ul><ul><li>2. Visa tydligt vad som hör ihop </li></ul><ul><li>3. Följ konventioner om du inte har starka argument för att alternativet är bättre för er verksamhet och era målgrupper </li></ul>SÖK > Sök Sök Webbkarta
    24. 33. Kräv inte extraprogram för grundläggande funktionalitet Till exempel: Javaskript eller Flash
    25. 34. Mätning – Örebro län okt 2007 2ggr per år: www.verva.se/24-timmarswebben/matning
    26. 35. 4: Webbplatsens innehåll och tjänster <ul><li>Grundinformation </li></ul><ul><ul><li>Kontaktinformation </li></ul></ul><ul><ul><li>Juridisk information </li></ul></ul><ul><ul><li>Beskriv er verksamhet på ett begripligt sätt </li></ul></ul><ul><li>Sökning </li></ul><ul><ul><li>Få bättre rankning i sökmotorer </li></ul></ul><ul><ul><li>Ge webbplatsen en begriplig sökfunktion </li></ul></ul><ul><li>Spridning av webbplatsens innehåll och tjänster </li></ul><ul><ul><li>Prenumeration </li></ul></ul><ul><ul><li>Återanvända innehåll – krisinformation, bloggar, media </li></ul></ul><ul><ul><li>Öppna databaser </li></ul></ul>
    27. 36. 5: Stöd skumläsning <ul><li>Vem är läsaren? </li></ul><ul><li>Skriv enkelt och begripligt </li></ul><ul><ul><li>det viktigaste först </li></ul></ul><ul><ul><li>tydliga och beskrivande rubriker </li></ul></ul><ul><ul><li>våga vara lagom exakt </li></ul></ul><ul><li>Dela upp </li></ul><ul><ul><li>längre texter i stycken </li></ul></ul><ul><ul><li>uppräkningar i listor </li></ul></ul><ul><li>Var konsekvent </li></ul><ul><ul><li>Begrepp </li></ul></ul><ul><ul><li>Datum och tid enligt standard </li></ul></ul><ul><ul><li>Undvik förkortningar </li></ul></ul><ul><ul><li>Skriv datum och tid enligt standard </li></ul></ul>Checklista för webbpublicering: www.verva.se/24-timmarswebben/checklistor
    28. 37. <ul><li>Beskriv meningsbärande bilder och grafiska objekt med textalternativ . </li></ul>Pröva 2 minuter som blind… 1) Lägg händerna avslappnat på bordet 2) Blunda
    29. 38. Samma sida för seende personer
    30. 39. 5: Länkar och dokument <ul><li>Skriv självförklarande länkar </li></ul><ul><li>Undvik länkar som klicka här , gå till… , läs mer </li></ul><ul><li>Använd title-texter för att ge mer information </li></ul><ul><li>Tala om när en länk öppnas i nytt fönster </li></ul><ul><li>Ge dokument tydliga filnamn </li></ul><ul><ul><li>Inte 2003_56.doc </li></ul></ul><ul><li>Publicera i första hand dokument i (X)HTML </li></ul><ul><ul><li>Checklista för publicering av PDF:er </li></ul></ul>
    31. 40. <ul><li>Alla länkar på sidan </li></ul><ul><li>Läs mer </li></ul><ul><li>Läs mer </li></ul><ul><li>Finns här </li></ul><ul><li>Läs mer </li></ul><ul><li>Alla rubriker på sidan </li></ul><ul><li>… </li></ul><ul><li>2. Fakta </li></ul><ul><ul><li>3. Filmarbetarkatalogen </li></ul></ul><ul><ul><li>3. Matiné </li></ul></ul><ul><ul><li>3. Filmarkivet i Grängesberg </li></ul></ul>Skumläsare Synskadade Sökmotorer
    32. 41. Uppföljning av användning och innehåll <ul><li>Mät mot uppsatta mål </li></ul><ul><li>Kontrollera statistik och sökbeteende </li></ul><ul><li>Följ upp hur webbplatsen används </li></ul>
    33. 42. 6: Webbinnehåll i mobila enheter <ul><li>Användningen ser annorlunda ut </li></ul><ul><li>Bygg plattformsoberoende </li></ul><ul><li>Stilmall för små skärmar </li></ul><ul><li>Samma information eller mobilspecifika tjänster? </li></ul>
    34. 43. Specifik mobiltjänst eller vanliga webbplatsen i mobilen
    35. 44. 7: Välja publiceringsverktyg <ul><li>Testa och ställa krav på: </li></ul><ul><li>Grundkonstruktion </li></ul><ul><li>Textformatering </li></ul><ul><li>Stöd för redaktören </li></ul><ul><li>Formulär och tabeller </li></ul><ul><li>Bildhantering och länkar </li></ul><ul><li>www.verva.se/24-timmarswebben/verktyg </li></ul>
    36. 45. Kapitel utifrån vägledningens målgrupper och webbplatsens livscykel <ul><li>Effektivare och bättre service </li></ul><ul><li>Utvecklingsprocessen </li></ul><ul><li>Standarder för webbplatser </li></ul><ul><li>Webbplatsens innehåll och tjänster </li></ul><ul><li>Håll webbplatsen levande </li></ul><ul><li>Webbinnehåll för mobila enheter </li></ul><ul><li>Publiceringsverktyg </li></ul><ul><li>Hjälpmedel </li></ul><ul><li>Extramaterial : Checklistor, exempel, kravdokument, testverktyg </li></ul>
    37. 46. Kom igång! <ul><li>STEG LADDA NER </li></ul><ul><li>Avsätt resurser  argument, mätningar </li></ul><ul><li>Utbilda medarbetare  checklistor, lästips </li></ul><ul><li>Formulera mål  boktips </li></ul><ul><li>Utvärdera webbplatsen  checklistor, testverktyg </li></ul><ul><li>Planera åtgärder kort/lång sikt  prio 1-3, dela upp </li></ul><ul><li>Kartlägg behov  boktips </li></ul><ul><li>Skissa och prototypa  boktips </li></ul><ul><li>Formulera tydliga krav  kravdokument, exempel </li></ul><ul><li>Välj leverantör och system  ramavtal </li></ul><ul><li>Producera innehåll  checklistor, exempel </li></ul><ul><li>Testa leveranserna  mätpunkter, testverktyg </li></ul><ul><li>Följ upp målen </li></ul>
    38. 47. Mer stöd från Verva <ul><li>Frågor om webbutveckling och förslag: [email_address] </li></ul><ul><li>Intro-seminarium </li></ul><ul><li>Erfarenhetsutbyte, utbildning och nyheter Nätverket 24-timmarswebben www.verva.se/natverk/24h </li></ul><ul><ul><li>Gratis, seminarier </li></ul></ul><ul><li>Lästips och Leverantörslistor </li></ul><ul><li>Ramavtal </li></ul>
    39. 48. Tack! <ul><li>Ladda ner extramaterial – www.verva.se/24-timmarswebben </li></ul><ul><li>Hör av dig – vägledningen utvecklas utifrån dina synpunkter! </li></ul><ul><li>Magnus Burell, [email_address] </li></ul>
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×