Mer om tilgjengelighet og Flash. Kirsten Ribu 16.10.2007 HiO.

Presentasjon om: "Mer om tilgjengelighet og Flash. Kirsten Ribu 16.10.2007 HiO."— Utskrift av presentasjonen:

1 Mer om tilgjengelighet og Flash. Kirsten Ribu 16.10.2007 HiO

2 Web Accessibility Toolbar •Virker bare i Internet Explorer for Windows •Alternativ: Web Developer Toolbar for Firefox – har lignende funksjonalitetWeb Developer Toolbar for Firefox •Det jobbes med en toolbar for firefox og Opera

3 Funksjonene •12 hovedknapper •Dropdown-menyer •Eller keyboard shortcuts

4 Struktur •Det er viktig at strukturen i HTML koden reflekterer strukturen på websiden •Dette er hovedsaklig med tanke på brukere med leselist (blinde brukere) slik at de kan forstå sidestrukturen •Dette er også viktig for søkemotorene!

5

6 Headinger •Viser hvilke elementer som er headinger på siden. •Disse må være strukturert: • (heading nivå 1) – s (heading nivå 2). • (heading nivå 3). – (heading nivå 4). »ETC

7

8 Andre elementer •Lister: ved siden av lister –Leselisten sier hvor mange elementer det er i listen før den leser opp innholdet •Fieldset / Label –Viser hvilke elementer som har en ’label’ i HTML koden •Table border •Table cell order

9 CCA – Color Contrast Analyzer •Colour Choice controls er delt i forgrunn og bakgrunn •Det er 3 måter å velge ut en farge for testing.

10 1. Fargepaletter •Velg egnet farge •Test mørkere eller lysere verdier av fargen du velger – det kan forbedre fargekombinasjonene som er valgt.

11 2. Legg in fargeverdi •Skriv inn hex-verdien i en tekstboks •Nyttig hvis du har tilgang til hex-verdiene for farger du vil teste

12 3. Plukk farge •Hent farge fra en webside – eller på skjermen med verktøyet:

13

14 Synsforstyrrelser/ øysykdommer

15

16

17

18 Men –Viktig! •Blinde er en veldig liten gruppe •De største gruppene er mennesker med motoriske problemer •NB! Alt for mye fokus på blinde har ført til utestenging av andre grupper •http://www.equalityhumanrights.com/page s/eocdrccre.aspxhttp://www.equalityhumanrights.com/page s/eocdrccre.aspx

19

20 Problemer •Surfing uten mus – pass på antall klikk! •Dyslektikere, innvandrere – hold språket enkelt! –Ikke kursiv –Venstreorientert tekst –Ikke store bokstaver

21

22 Puslespillet •The most important aspect of this puzzle is its interactive nature. Full accessibility cannot be guaranteed unless all pieces fit together. To summarize, accessibility includes the skills of a webmaster who knows how to design with accessibility in mind and who uses authoring tools that help her do this. It also includes the use of browsers and assistive technology that work together and work well with what the designer has created. Furthermore, an accessible climate is created by a user who has current versions of browsers and assistive technology and knows how to use them.

23 Usability First •http://www.usabilityfirst.com/accessibility/w hatis.txlhttp://www.usabilityfirst.com/accessibility/w hatis.txl

24 Design av nettsted •Bruker-sentrert – dvs med gjennomgående brukermedvirkning •Å teste og fikse et nettsted etter at det er laget er lite effektivt •En modell ->

25 Kravanalyse •Bestem målene for nettstedet sett fra kundens perspektiv •Beskriv brukerens behov •Evaluer allerede eksisterende utgaver av nettstedet •Gjennomfør intervjuer og undersøkelser

26 2. Conceptual Design •Lag en skisse av designet og navigasjonen på et overordnet nivå. •(Bruk use case modellering) •Gjør en analyse av oppgavene som skal utføres på siden •Finn viktige funksjoner og beskriv dem

27 3. Mockups / Prototyper •Lag visuelle modeller/ tegninger (mockups) eller interaktive representasjoner på nett (prototyper) •Evaluer brukervennlighet med testing i fokusgrupper (dvs. aktuelle brukere, målgruppen), brukertester og walkthroughs med kunden •Bruk resultatene til å lage flere mockups/ forbedre prototyper •Gjenta denne prosessen (design-iterasjon) til designet møter usability målene

28 4. Produksjon •Lag det endelige produktet •Evaluer produktet - funksjonalitet, design og brukervennlighet - gjennom testing, kvalitetssikring, usability testing og kunde- testing •Bruk resultatene til å forbedre produktet

29 Flash •Siste versjon av Flash kan brukes! •Men det diskuteres hvor bra det er ? Bruker du Flash må du lage alternativ tekst. •Macromedia Flash 8 and Macromedia Flash Player 8. •https://admin.adobe.acrobat.com/_a29515 3/p70389301/https://admin.adobe.acrobat.com/_a29515 3/p70389301/

30 JAWS – Screen reader •https://admin.adobe.acrobat.com/_a29515 3/p85096505/https://admin.adobe.acrobat.com/_a29515 3/p85096505/

31 Rich Media Accessibility Website •http://ncam.wgbh.org/richmedia/http://ncam.wgbh.org/richmedia/ •Rich media = rich web sites