Your SlideShare is downloading. ×
Are Gjertin Urkegjerde Halland Senior informasjonsarkitekt are @ netliferesearch.com Tlf. + 47 908 70 026 Internett for alle
NetLife Research – ledende på brukeropplevelse i Norge <ul><li>Spesialisert </li></ul><ul><li>Uavhengig </li></ul><ul><li>...
Kort om meg <ul><li>Senior informasjonsarkitekt i NetLife Research </li></ul><ul><li>Tidligere fagansvarlig i WM-data/Icon...
 
<ul><li>” Offentlige Internett-sider skal være brukervennlige og oppfylle internasjonale retningslinjer for design og univ...
Bruksmåter og behov <ul><li>Blinde:  Skjerm-leser som tolker og leser  skjermbildet, en leselist som viser punktskrift  og...
Tilgjengelighet – ikke bare for funkjonshemmede <ul><li>EU regner med at minst 15% av befolkningen i alderen 16-67 år oppl...
Vanlige problemer <ul><li>Manglende beskrivelser av bilder </li></ul><ul><li>Ikke-skalerbar tekst </li></ul><ul><li>Når de...
Manglende beskrivelser av bilder <ul><li>Når ALT-tekst eller ikke beskriver </li></ul>Video!
Heter ikke denne siden ”Akutt legehjelp”? Hvorfor står det ingenting om legehjelp da?
Beskrivende lenkenavn <ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li><...
Lag gode alternative tekster! Jeg har vondt i magen,  hvilken lege skal jeg spørre?
Ikke-skalerbar tekst
Vanskelig språk  <ul><li>ALL-undersøkelsen (2003) anslår at 30 prosent av den voksne befolkningen i Norge har en leseferdi...
Når det som er klikkbart blir for smått
Når tastaturet brukes til navigasjon
Komplisert oppbygging av sidene <ul><li>www.antonsport.no </li></ul>Video!
 
<ul><li>Kompliserte tabeller til layout gir:  </li></ul><ul><ul><li>Lengre nedlastingstid </li></ul></ul><ul><ul><li>Vansk...
 
Manglende alternativ til multimedia og spesielle filformater
Standarder og anbefalinger <ul><li>USA:  Section 508 </li></ul><ul><li>W3C:  Web Accessibility Initiative (WAI) </li></ul>...
Hvor tilgjengelige er nettsted i dag  (Disability Rights Commission, 2004) <ul><li>81 % av britiske nettsider  oppfyller i...
Hvorfor skal vi ikke lage nettstedet tilgjengelig? <ul><li>Må bruke kjedelig design…  </li></ul><ul><ul><li>Feil:  Bruk st...
20 ting å huske på!
1. Sørg for enhetlig layout på nettstedet
2. Skriv inn alternative tekster for grafiske elementer <ul><li>Dette må det være enkel støtte for i publiseringssystemet ...
3. Bruk overskrifter for å vise strukturen
4. Lær deg forskjellen mellom avsnitt og linjeskift <ul><li>Avsnitt samler innhold, linjeskift er noe annet </li></ul><ul>...
5. Kjenn dine tagger og bruk dem riktig
6. Datatabeller må gjøres forståelige <ul><li>Gjør tabeller så enkle som  mulig, helst ikke mer avansert  enn en timeplan ...
7. Bruk meningsbærende lenketekster <ul><li>Alternativer til Les mer... </li></ul><ul><ul><li>La nyhetsoverskriften være l...
8. Bruk synlige lenker <ul><li>Særlig gjelder dette dersom de ikke er merket slik lenker vanligvis er det.  </li></ul><ul>...
9. Unngå lenker som åpner sider i nye vinduer <ul><li>http://www.storebrand.no/ </li></ul>
10. Strukturer teksten <ul><li>To versjoner, en kortversjon og en lengre </li></ul>
11. Skriv forståelig <ul><li>Unngå faguttrykk og fremmedord i tekster med alminnelig innhold </li></ul><ul><li>Husk at ca ...
12. Bruk farger med omtanke <ul><li>Unngå å bruke farge som eneste designelement  </li></ul><ul><li>I diagrammer kan du fy...
 
13. Illustrasjoner og ikoner kan understøtte teksten <ul><li>Ikoner må fremme forståelse </li></ul><ul><li>Bør alltid leds...
14. Unngå forkortelser <ul><li>NSB, EU og (kanskje) UD går bra </li></ul><ul><li>IA, SHDIR, TPH, ROI er lang verre </li></...
15. Sørg for alternativer til plugins <ul><li>Noter alle plugins som er i bruk, og sørg for alternativer  </li></ul>
16. Sørg for å gjøre nedlastbare filer tilgjengelige
17. PDF – ikke tilgjengelig for alle
18. Husk å angi dokumentopplysninger <ul><li>Det viktigste er tittelen på dokumentet </li></ul><ul><li>Angi språk </li></u...
19. Lydfiler må ha tekstalternativer http://www.doit.wisc.edu/accessibility/
20. Angi alternativer til video-filer og animasjoner
21. Kontroller resultatet av eget arbeid <ul><li>Disse punktene kan følges opp i sjekklisteform </li></ul><ul><li>http://w...
En ”mini-sjekk” av eget nettsted <ul><li>Kan man justere skriftstørrelsen? </li></ul><ul><li>Bruker dere alternative tekst...
Mer informasjon: <ul><li>WAT: Web Accessibility Toolbar (Internet Explorer) </li></ul><ul><li>Denne kan lastes ned fra  ht...
Spørsmål? Kommentarer? <ul><li>E-post:  [email_address] </li></ul><ul><li>Mobil: 908 70 026 </li></ul><ul><li>Blogg:  www....
www.webdagene.no
Upcoming SlideShare
Loading in...5
×

NTNU - Internett for alle

2,211

Published on

Foredrag om tilgjengelighet, ved Are Halland, NetLife Resarch

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,211
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Transcript of "NTNU - Internett for alle"

  1. 1. Are Gjertin Urkegjerde Halland Senior informasjonsarkitekt are @ netliferesearch.com Tlf. + 47 908 70 026 Internett for alle
  2. 2. NetLife Research – ledende på brukeropplevelse i Norge <ul><li>Spesialisert </li></ul><ul><li>Uavhengig </li></ul><ul><li>Faglig tyngde </li></ul><ul><li>Brukerfokuserte utviklingsløp </li></ul><ul><ul><li>Strategi, brukere, innhold </li></ul></ul><ul><ul><li>Konseptuvikling </li></ul></ul><ul><ul><li>Interaksjonsdesign </li></ul></ul><ul><ul><li>Informasjonsarkitektur </li></ul></ul><ul><li>Brukertester og ekspertevalueringer </li></ul><ul><ul><li>Over 800 brukertester siste 5 år </li></ul></ul><ul><li>Ekstern kvalitetssikring </li></ul><ul><li>Kurs, mentoring, rådgivning </li></ul>Typiske tenester
  3. 3. Kort om meg <ul><li>Senior informasjonsarkitekt i NetLife Research </li></ul><ul><li>Tidligere fagansvarlig i WM-data/IconMedialab </li></ul><ul><li>Spesialområder: søk, navigasjon, innhald </li></ul><ul><li>Lokal ambassadør for UXnet Norge </li></ul><ul><li>Blogger på brukaropplevingar.com og iallenkelhet.no </li></ul><ul><li>Hovedfag i medievitenskap fra Universitetet i Oslo </li></ul>
  4. 5. <ul><li>” Offentlige Internett-sider skal være brukervennlige og oppfylle internasjonale retningslinjer for design og universell utforming. ” K ap 5.2, eNorge 2005 </li></ul>eNorge 2009: &quot;I 2004 oppfylte 7 prosent av offentlige nettsteder kriteriene for tilgjengelighet ifølge Norge.no .&quot; &quot;I løpet av 2007 skal 80 prosent av offentlige nettsteder oppfylle Norge.no’s kvalitetskriterier for tilgjengelighet&quot;.
  5. 6. Bruksmåter og behov <ul><li>Blinde: Skjerm-leser som tolker og leser skjermbildet, en leselist som viser punktskrift og/eller syntetisk tale. </li></ul><ul><li>Svaksynte: Må kunne forstørre skrift og trenger gode kontraster </li></ul><ul><li>Døve: Trenger teksting eller utskrift av lyd </li></ul><ul><li>Bevegelseshemmede: Mulighet for å navigere med tastatur eller alternative pekeredskaper </li></ul><ul><li>Lesevansker: Behov for lettlest tekst og konsistent navigasjon </li></ul>Video!
  6. 7. Tilgjengelighet – ikke bare for funkjonshemmede <ul><li>EU regner med at minst 15% av befolkningen i alderen 16-67 år opplever å ha en eller annen funksjonsnedsettelse </li></ul><ul><li>Andelen over 67 år vil øke fra 13% i dag til 23% i 2040 </li></ul><ul><li>Brukere av PDA-er og mobiltelefoner </li></ul><ul><li>Brukere av gamle eller spesialtilpassede nettlesere </li></ul><ul><li>Brukere som er slitne </li></ul><ul><li>Brukere som er uvant med å bruke Internett </li></ul><ul><li>I tillegg er verdens mest aktive nettbruker er blind... </li></ul>
  7. 8. Vanlige problemer <ul><li>Manglende beskrivelser av bilder </li></ul><ul><li>Ikke-skalerbar tekst </li></ul><ul><li>Når det som er klikkbart blir for smått </li></ul><ul><li>Når tastaturet brukes til navigasjon </li></ul><ul><li>Innstilling av tekststørrelse i Internet Explorer </li></ul><ul><li>Manglende alternativ til multimedia og spesielle filformater </li></ul><ul><li>Arbeidsplass med leselist, skanner og høyttalere </li></ul><ul><li>Vanskelige tekster </li></ul>
  8. 9. Manglende beskrivelser av bilder <ul><li>Når ALT-tekst eller ikke beskriver </li></ul>Video!
  9. 10. Heter ikke denne siden ”Akutt legehjelp”? Hvorfor står det ingenting om legehjelp da?
  10. 11. Beskrivende lenkenavn <ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul><ul><li>Les mer </li></ul>
  11. 12. Lag gode alternative tekster! Jeg har vondt i magen, hvilken lege skal jeg spørre?
  12. 13. Ikke-skalerbar tekst
  13. 14. Vanskelig språk <ul><li>ALL-undersøkelsen (2003) anslår at 30 prosent av den voksne befolkningen i Norge har en leseferdighet som er utilstrekkelig i forhold til kravene i dagens arbeids- og hverdagsliv </li></ul>
  14. 15. Når det som er klikkbart blir for smått
  15. 16. Når tastaturet brukes til navigasjon
  16. 17. Komplisert oppbygging av sidene <ul><li>www.antonsport.no </li></ul>Video!
  17. 19. <ul><li>Kompliserte tabeller til layout gir: </li></ul><ul><ul><li>Lengre nedlastingstid </li></ul></ul><ul><ul><li>Vanskeligere å lese med skjermlesere </li></ul></ul><ul><li>Alternativet: Bruk stilsett (CSS) for plassering og utseende </li></ul>
  18. 21. Manglende alternativ til multimedia og spesielle filformater
  19. 22. Standarder og anbefalinger <ul><li>USA: Section 508 </li></ul><ul><li>W3C: Web Accessibility Initiative (WAI) </li></ul><ul><li>Norge: Flere initiativ og anbefalinger. Ingen lovpålagte retningslinjer, men dette kommer… </li></ul>
  20. 23. Hvor tilgjengelige er nettsted i dag (Disability Rights Commission, 2004) <ul><li>81 % av britiske nettsider oppfyller ikke WAI sine krav på nivå 1 (utvalg på 1000 nettsider) </li></ul><ul><li>Nettstedseiere: oppmerksomme på tilgjengelighet, men får det ikke helt til </li></ul><ul><li>Utviklere av nettsted: har ikke nok forståelse for tilgjengelighet </li></ul>
  21. 24. Hvorfor skal vi ikke lage nettstedet tilgjengelig? <ul><li>Må bruke kjedelig design… </li></ul><ul><ul><li>Feil: Bruk stilsett, CSS </li></ul></ul><ul><li>Det blir komplisert og dyrt å tilrettelegge løsningen </li></ul><ul><ul><li>Feil: Det koster ikke mye </li></ul></ul><ul><li>Kan vi ikke heller lage en egen tekstversjon </li></ul><ul><ul><li>Tja: Hvorfor? </li></ul></ul><ul><li>Det er jo så få brukere dette gjelder </li></ul><ul><ul><li>130 000 er synshemmede i Norge… </li></ul></ul><ul><li>Alle har nytte av forbedringer av tilgjengeligheten! </li></ul>
  22. 25. 20 ting å huske på!
  23. 26. 1. Sørg for enhetlig layout på nettstedet
  24. 27. 2. Skriv inn alternative tekster for grafiske elementer <ul><li>Dette må det være enkel støtte for i publiseringssystemet </li></ul>
  25. 28. 3. Bruk overskrifter for å vise strukturen
  26. 29. 4. Lær deg forskjellen mellom avsnitt og linjeskift <ul><li>Avsnitt samler innhold, linjeskift er noe annet </li></ul><ul><li>Avsnitt begynner med koden ”<p>”og slutter med ”</p>” </li></ul><ul><li>Linjeskift vises som ”<br>” eller ”<br />” </li></ul>
  27. 30. 5. Kjenn dine tagger og bruk dem riktig
  28. 31. 6. Datatabeller må gjøres forståelige <ul><li>Gjør tabeller så enkle som mulig, helst ikke mer avansert enn en timeplan </li></ul><ul><li>Lag heller flere enkle tabeller enn én stor og kompleks tabell </li></ul><ul><li>Sørg for at rad- og kolonneoverskriftene er markert som tabelloverskrifter </li></ul><ul><li>Gi tabellen en egen overskrift </li></ul><ul><li>Lag eventuelt et tekstlig resymé som klargjør de viktigste konklusjonene man kan trekke av tabellen </li></ul><ul><li>http://www.accessify.com/tools-and-wizards/accessibility-tools/table-builder/ </li></ul>
  29. 32. 7. Bruk meningsbærende lenketekster <ul><li>Alternativer til Les mer... </li></ul><ul><ul><li>La nyhetsoverskriften være lenken </li></ul></ul><ul><ul><li>Endre ”les mer” til ”les mer om konferansen i Wien” </li></ul></ul><ul><ul><li>Det beste er om lenkene har et meningsbærende ord først. For eksempel: ”Konferansen i Wien” </li></ul></ul>
  30. 33. 8. Bruk synlige lenker <ul><li>Særlig gjelder dette dersom de ikke er merket slik lenker vanligvis er det. </li></ul><ul><li>I de fleste nettlesere er lenker merket med blå, understreket tekst. </li></ul>
  31. 34. 9. Unngå lenker som åpner sider i nye vinduer <ul><li>http://www.storebrand.no/ </li></ul>
  32. 35. 10. Strukturer teksten <ul><li>To versjoner, en kortversjon og en lengre </li></ul>
  33. 36. 11. Skriv forståelig <ul><li>Unngå faguttrykk og fremmedord i tekster med alminnelig innhold </li></ul><ul><li>Husk at ca 40 prosent av den voksne befolkningen har en leseferdighet som ikke er bedre enn nivået på 6.skoletrinn </li></ul><ul><li>Skriv derfor enkelt med korte, direkte og aktive setninger. </li></ul>
  34. 37. 12. Bruk farger med omtanke <ul><li>Unngå å bruke farge som eneste designelement </li></ul><ul><li>I diagrammer kan du fylle ut søyler med mønstre </li></ul><ul><li>I tekst kan du føye til nummer eller andre henvisninger for å markere forskjeller </li></ul><ul><li>Velg farger som har god kontrast </li></ul>
  35. 39. 13. Illustrasjoner og ikoner kan understøtte teksten <ul><li>Ikoner må fremme forståelse </li></ul><ul><li>Bør alltid ledsages av tekst og ALT-tagger </li></ul>
  36. 40. 14. Unngå forkortelser <ul><li>NSB, EU og (kanskje) UD går bra </li></ul><ul><li>IA, SHDIR, TPH, ROI er lang verre </li></ul><ul><li>Bruk evt <abbr> og <acronym> </li></ul>
  37. 41. 15. Sørg for alternativer til plugins <ul><li>Noter alle plugins som er i bruk, og sørg for alternativer </li></ul>
  38. 42. 16. Sørg for å gjøre nedlastbare filer tilgjengelige
  39. 43. 17. PDF – ikke tilgjengelig for alle
  40. 44. 18. Husk å angi dokumentopplysninger <ul><li>Det viktigste er tittelen på dokumentet </li></ul><ul><li>Angi språk </li></ul><ul><ul><li><html lang=”no” ...> </li></ul></ul><ul><ul><li><meta name=”DC.language” scheme=”ISO 639-2/B” content=”no”> </li></ul></ul><ul><ul><li>www.loc.gov/standards/iso639-2/langcodes.html </li></ul></ul>
  41. 45. 19. Lydfiler må ha tekstalternativer http://www.doit.wisc.edu/accessibility/
  42. 46. 20. Angi alternativer til video-filer og animasjoner
  43. 47. 21. Kontroller resultatet av eget arbeid <ul><li>Disse punktene kan følges opp i sjekklisteform </li></ul><ul><li>http://www.shdir.no/deltasenteret/publikasjoner/ </li></ul><ul><li>http://www.norge.no/kvalitet/ </li></ul>
  44. 48. En ”mini-sjekk” av eget nettsted <ul><li>Kan man justere skriftstørrelsen? </li></ul><ul><li>Bruker dere alternative tekster for bilder? </li></ul><ul><li>Er kontrasten god nok? </li></ul><ul><li>Bruker dere ”Les mer” lenker? </li></ul><ul><li>Følger dere WAI-standarden? </li></ul><ul><li>Bruker dere PDF-dokumenter? </li></ul><ul><li>Har dere tenkt på hvem dere stenger ute? </li></ul><ul><li>Nå flere brukere og få et bedre nettsted! </li></ul>
  45. 49. Mer informasjon: <ul><li>WAT: Web Accessibility Toolbar (Internet Explorer) </li></ul><ul><li>Denne kan lastes ned fra http:// www.nils.org.au / ais /web/ resources / toolbar / </li></ul><ul><li>Evalueringsversjon av Jaws - skjermleser </li></ul><ul><li>http:// www.freedomscientific.com / fs_downloads / jaws.asp </li></ul><ul><li>W3C sine krav WCAG 1.0 </li></ul><ul><li>http://www.w3.org/TR/WCAG10/ </li></ul><ul><li>Veiledere fra Sosial og helsedirektoratet </li></ul><ul><li>http:// www.shdir.no/deltasenteret/publikasjoner/ </li></ul><ul><li>EU initiativ </li></ul><ul><li>http://www.wabcluster.org/ </li></ul>
  46. 50. Spørsmål? Kommentarer? <ul><li>E-post: [email_address] </li></ul><ul><li>Mobil: 908 70 026 </li></ul><ul><li>Blogg: www.iallenkelhet.no / www.brukaropplevingar.com </li></ul>
  47. 51. www.webdagene.no

×