Gruppeoppgave i dag. Tilgjengelige nettsteder. Fordel roller i gruppa. Skrekkeksempler. En del ting å tenke på. Leselist Satellite fra Bojo as



Like dokumenter
Tilgjengelige nettsteder

Offentlige Internett-sider skal være brukervennlige. Offentlige Internett-sider skal være brukervennlige

Brukerdokumentasjon for LabOra portal - forfattere

Oppbygging av innhold på responsive nettsider.

Hjelp til å lage godkjente PDF-filer

Universell Utforming Intro til testing av webløsninger. Trondheim, mars 2015

[ Web Accessibility Initiative ]

Kom i gang. Nå er det enklere en noensinne å redigere hjemmesiden din med Plone CMS. 17. mars 2010

file:///c:/users/michaelp/sites/dkdm/dw6/dreamweaver6.html

Intro til WWW, HTML5 og CSS

oss? Hva må webredaktører kunne om universell Aud Marie Hauge, ekspert i brukervennlighet og

Oblig 4 Webutvikling. Oppgave

Internett og leselist

Introduksjon til universell utformning. Andreas Cederbom

WINDOWS 10 OPPDATERING HØSTEN 2018 (VERSJON 18.09) HVA ER NYTT?

Nedenfor er en punktvis gjennomgang av hvordan forholder seg til kravene som er omfattet av forskriften.

Brukerveiledning WordPress. Innlogging:

Brukerveiledning Bruk av siden. Når du går inn på siden får du opp følgende bilde:

Slik lager du et web-område bestående av flere sammenhengende websider i. Frontpage Laget av Magnus Nohr Høgskolen i Østfold

SkanRead hjelp. SkanRead 2.0. MikroVerkstedet as

De politiske partienes nettsteder oppsummering av testresultatet

ActiveBuilder Brukermanual

BRUK AV TEKSTEDITOREN

Lage klubbens webside i Rotary med verktøyet Webwiz 2.0

Publiseringsveiledning for

PBL Barnehageweb. Brukerveiledning

Manual for innlegging av standard sideinnhold og nyheter via «backend»

Brukerveiledning for SI Norge. Publiseringsverktøy for klubbenes hjemmesider

Publisere på nvfnorden.org

Oppgave 1 (Etter forelesning 31/8) Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.

OBLIG 1 - WEBUTVIKLING

Begrepet SEO er død i den forstand at det har blitt en del av innholdsmarkedsføringen i større grad enn før, påstår Jackson.

Odd Fellow Webadministrasjon

Kom godt i gang med CD-ORD 8. mikrov.no

Hvordan legge ut en melding i Fronter

(The Center for Universal Design, North Carolina State University)

KILDEKRITIKKURS PÅ 8. TRINN

Brukerveiledning for Lingdys 3.5

Web Accessibility Toolbar. Struktur. Funksjonene. Headinger. Mer om tilgjengelighet og Flash.

Installasjon av Nett-TV-meter Trinn for trinn

Kom i gang med. Dette dokumentet gir deg en kort innføring i hvordan du selv kan oppdatere ditt eget nettsted ved bruk av i-tools.

Aktivitetsplan - Adobe Pro kurs Infografikk våren 2015

BORRENYTT. Dette er en innføringsguide om hvordan man kan legge til nye poster, og hvordan disse bør settes opp.

Memoz brukerveiledning

Aktivitetsplan - Adobe Pro kurs Infografikk høsten 2015

OBLIG 2 WEBUTVIKLING

Brukermanual - Joomla. Kopiering av materiale fra denne Bonefish manualen for bruk annet sted er ikke tillatt uten avtale 2010 Bonefish.

I dette kapitlet omtaler vi Microsoft Outlook 2010, men mange råd og tips vil også gjelde for andre versjoner av Microsoft Outlook.

Brukermanual.

Måling av universell utforming på kommunale nettsider Resultater fra EIII. Daniel Scheidegger NAV Tilde

Oppgave 1: Gå gjennom nettsiden arngren.net og list opp alle problemene du ser. Både i funksjonalitet/bruk og i koden bak.

Tips til nettlærere: Hvordan tenke universell utforming av undervisning i Classfronter

Veiledning hjemmeside Stjørdal Friidrettsklubb

Publiseringsløsning for internettsider

Analyse av eksisterende nettside

Brukermanual for kommuneansvarlig og testleder

Problem med innlogging til Sauekontrollen Web?

WEBUTVIKLING OBLIG 4. Installasjon

WordPress. Brukerveiledning. Kjære kunde. Innlogging:

Ny på nett Internett. Bruk av nettleser.

Avansert tekstmodul Eksempel Administrasjon Bilde Eksempel på en bildemodul Eksempel på en bildemodul lagt til uten

Universell utforming Deltakelse og tilgjengelighet

Dokumentasjon Publisere tilgjengelig

I denne oppgaven blir du introdusert for programmeringsspråket JavaScript. Du skal gjøre den klassiske oppgaven Hei verden, med en katt.

Web fundamentals. Web design. Frontend vs. Backend Webdesign 17. januar Monica Strand


Netttsideguide: Universell utforming

Noen viktige innstillinger

Bytte til OneNote 2010

Brukerveiledning for SparTi

Vedlikeholde nettstedet i Joomla 2.5 +

Retningslinjer for navigasjon i mobilgrensesnitt Sist oppdatert

Brukerveiledning mal for masteroppgaver ved Høgskolen i Hedmark

Generell brukerveiledning for Elevportalen

Tilgjengelighetstesting av elektronisk meldekort på nav.no

HTML5. Skjemaer på nettsider. Skjemaer med. Informasjonsteknologi 1 og 2. Gløer Olav Langslet Sandvika VGS

Tilgjengelighetsanalyse - Mi Side / DotLrn Universitetet i Bergen

Innhold 1 Universelt utformete og tilgjengelige PDF dokumenter Hvorfor PDF? Gjør det lettere for deg selv Eksporter fra Word

DIAGNOSERAPPORT. for. Dato: Utført av: Tommy Svendsen

Vurdering for Søke stilling - Trondheim kommune. Poengsum: 70 poeng av moglege 105 poeng - 67 %

Veiledning for Krets- og gruppesider.

1. Intro om SharePoint 2013

IST Skole Vurdering - Foresatt

Kom godt i gang med. IntoWords. mikrov.no

Del 1: Overgang fra gammel hjemmeside til ny hjemmeside

Bruk av Corepublish bruksanvisning for avdelingene

Standardsvar. edialog24 Operator. edialog24 AS. Avd. Oslo Hovfaret 17B 0275 Oslo. Avd. Trondheim Ingvald Ystgaards vei Trondheim

Bruksanvisning for publisering med ez publish 3.7.5

Brukermanual til Domenia Norges adminløsning

Kurs i bruk av JAWS. Magnar Høgalmen Oktober 2011

Moderne systemutviklingsmetoder

Test of English as a Foreign Language (TOEFL)

LIGHTNING ET PROGRAM FOR SKJERMFORSTØRRING BRUKERVEILEDNING. Bojo as Akersbakken 12, N-0172 Oslo Utgave 1206 Bojo as 2006

Ny designmanual og ny StudentWeb. Brukerforum 2012 Kathy Foss Haugen

Design og dokumentasjon

Båtforening på nett. Produktrapport

Løsningsskisse prøve IT1

Installasjonsveiledning Visma Avendo Lønn, versjon 7.60 Oktober 2011

the web Introduksjon Lesson

KOMME I GANG 2. Logge på 2. I redigeringsvinduet 3 OVERSIKT OVER KNAPPENE SOM LIGGER ØVERST I REDIGERINGSVINDUET 5

Transkript:

Gruppeoppgave i dag Tilgjengelige nettsteder 23. August 2007 Kirsten Ribu Begynn å planlegge nettstedet. Hva skal det inneholde? Hvor mange sider? Hvordan skal navigeringen være? Tegn opp hvordan man lenker mellom sidene, og ut til referanser og andre nettsteder. Fordel roller i gruppa Fordel oppgaver og roller i gruppa: Redaktør: Ansvarsområde: ledelse, innkalling til møter, ansvar for at arbeidet gjøres, frister overholdes, oveordnet ansvar for innhold og utforming Utvikler: Ansvar for HTML og CSS Tester: Ansvar for at sidene validerer og er tilgjengenlige Innholdsansvarlig: Ansvar for tekst, både innhold og presentasjon Designer: Ansvar for visuell utforming, valg av utseende på tekst og lenker, farge og presentasjon. Skrekkeksempler www.webpagesthatsuck.com En del ting å tenke på Leselist Satellite fra Bojo as Ta hensyn til hjelpemidler og programvare for tilpasninger! 1

Skjermlesere, talesyntese og leselist Skjermleseren kan ved hjelp av talesyntese, (tekst-til-tale system), lese opp titler, menyer, innhold og brukerens egne inntastinger. Navigasjonen blir enklere dersom innholdet er strukturert. Opplesningsutstyr For personer med lesevansker. Det kan installeres mulighet for opplesning på flere språk. Opplesningsprogrammer er ofte avhengig av at det er mulig å kopiere tekst til utklippstavlen. Hvis teksten ligger som grafikk, er det ikke mulig. Forstørringsprogrammer For vanskeligheter med å se og lese det som står på en skjerm Disse programmene gjør det mulig å zoome inn det område av skjermen der markøren befinner seg. Forstørringsprogrammer Vanskelig å holde oversikten over sider som er låst i stor størrelse med scrolling både vannrett og loddrett. Tekst som vises som et bilde, for eksempel på en logo, eller knapp fungerer dårlig for personer med sterkt nedsatt syn. Manglende tekst til bilder Utstyrer bilder, grafikk, tabeller, lenker m.m. med en alternativ tekst - alt-tekst. Brukes til å beskrive hva bilder forestiller, hva grafer inneholder eller hvor lenkene sender deg. 2

Ikke-skalerbar tekst Behovene varierer fra bruker til bruker. Noen foretrekker å få vist teksten med små skrifttyper slik at de får se mest mulig av teksten. Brukere med nedsatt syn har behov for store skrifttyper for å kunne lese teksten. Når det som er klikkbart blir for smått Lyd og video Vidoesnutter kan tekstes og tekstversjoner av lydklipp/video kan legges ut. Tilsvarende problemer oppstår også ved bruk av andre filformater, som for eksempel PDF-dokumenter og Flash-filer. 3

Vanskelige tekster ALL-undersøkelsen, som ble presenteret av Nasjonalt senter for leseopplæring og leseforskning i 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. Begrensinger på teksten Lange ord, faguttrykk og forkortelser fører til problemer for brukere som får teksten lest opp ved hjelp av skjermleser Skjermleseren ofte får problemer med å uttale spesielle ord. Det er også et problem dersom sidene på nettstedet er tettpakket med tekst. I en slik situasjon er det vanskelig å få oversikt. Komplisert oppbygging av sidene Et nettsted inneholder ofte store mengder med informasjon. Informasjonen er ofte ordnet i en rekke forskjellige kategorier og på ulike sider. Det er derfor svært viktig at strukturen er ordnet og ensartet. Dette gjelder både nettstedet som helhet og den enkelte siden. For personer som har en hjerneskade eller som leser langsomt, er det en stor belastning dersom nettstedet ikke er bygd opp på en enkel og logisk måte. Tilgjengelige nettsider hvem har ansvar? 4

Praktiske råd 21 råd. Noen av dem: -> Husk at ca 40 prosent av den voksne befolkningen har en leseferdighet som ikke er bedre enn nivået på 6.skoletrinn. Skriv derfor enkelt med korte, direkte og aktive setninger. Sørg for enhetlig layout på nettstedet Sørg for en enhetlig layout på nettstedet. Designelementer bør gjenbrukes på alle sider. Skriv inn alternative tekster for grafiske elementer Beskriv alle bilder med det som kalles alttekst. Alt står for alternativ, og alt-teksten er den teksten som leses opp eller vises for de brukere som ikke kan se bildene. Bruk overskrifter for å vise strukturen De brukerne som er avhengig av systemer som leser opp sider, navigerer ofte ved hjelp av overskriftene på en nettside. Dersom overskriftene bare består av uthevet tekst, får disse brukerne problemer. Av samme grunn er det viktig at bare virkelige overskrifter markeres som overskrifter. Overskriftstagger skal ikke brukes til å lage stor og iøynefallende tekst. Lær forskjellen mellom avsnitt og linjeskift Avsnitt begynner med koden <p> og slutter med </p> Linjeskift vises som <br> eller <br /> 5

Kjenn taggene og bruk dem riktig En vanlig feil er å bruke HTML-tagger som <blockquote> eller <dd> for å lage tekstinnrykk. Taggen <blockquote> er beregnet på å angi sitater og vil av en skjermleser bli lest opp som et sitat. Taggen <dd> er beregnet på definisjoner og vil gi HTML-feil dersom den brukes isolert og ikke sammen med den tilhørende termen i en <dt> - tagg. Datatabeller må gjøres forståelige Gjør tabeller så enkle som mulig, helst ikke mer avansert enn en timeplan. Lag heller flere enkle tabeller enn én stor og kompleks tabell. Sørg for at rad- og kolonneoverskriftene er markert som tabelloverskrifter. Gi tabellen en egen overskrift og lag eventuelt et tekstlig resymé som klargjør de viktigste konklusjonene man kan trekke av tabellen. Bruk meningsbærende lenketekster Lenker er selve limet som binder nettsider sammen, og må kunne brukes av alle. Et vanlig eksempel er de lenkene som er utstyrt med teksten Les mer. Navigerer man ved å hoppe fra lenke til lenke, eller ved å få lest opp en liste over samtlige lenker på en side, gir ikke Les mer fem ganger etter hverandre mening. 9. Unngå lenker som åpner sider i nye vinduer Et nytt vindu dekker for det eksisterende. Brukeren kan heller ikke benytte nettleserens tilbake-knapp for å komme tilbake til startsiden. Problemet er stort for personer med forståelsesvansker og personer som bruker skjermlesere. 10. Strukturer teksten Både enkel og full versjon Tekster som er vanskelige å lese og å forstå, er et problem for alle. Det blir vanskelig å finne den informasjonen man søker, og brukeren vil bruke lang tid for å få det ønskede utbyttet. Personer med lesevansker og brukere av skjermlesere har spesielt store problemer med lange og vanskelige tekster. Del opp siden i to deler: En del med korte hovedpoenger fra teksten med lenke til den andre delen som inneholder den fullstendige teksten. Når en bruker kommer til den første delen skal han/hun kunne avgjøre om informasjonene er tilstrekkelig. Mange vil dessuten foretrekke å skrive ut fullversjonen i og med at det er anstrengende å lese lange tekster på skjerm. 6

17. PDF ikke tilgjengelig for alle PDF står for Portable Document Format, PDF er populært fordi det bevarer dokumentenes opprinnelige utseende. Mange PDF-dokumenter er ikke tilgjengelig for alle, og det bør derfor suppleres med andre formater. PDF Velger dere å bruke PDF-filer, bør de suppleres med en HTML-utgave med det samme innholdet. Det må legges ut godt synlige henvisninger til hvordan man henter og aktiverer programmet. Det må ikke legges ut PDF-filer der innholdet er skannet inn. 21. Bruk testverktøy Kontroller alle ferdigstilte sider. Det finnes verktøy på nettet som programvare på din egen PC. Det finnes også verktøy som du kan teste sidene dine uten at du selv installerer enkelt kan installere og som du kan bruke til å sjekke sider som ikke er lagt ut. Testing Det er oppgaven som avgjør hvilke verktøy du skal benytte. Har du installert Accessibility Toolbar kan du kontrollere at selve HTML-koden er korrekt. Det gjør du ved å velge Validation > W3C HTML Validator, og deretter velge det som passer til situasjonen. W3C og WAI Du bør sørge for å følge de retningslinjer og standarder som finnes hos W3C (World Wide Web Consortium). Det er viktig å teste nettstedet ved å la faktiske brukere prøve det ut og gi tilbakemelding. W3C og WAI Det mest anerkjente og hyppigst benyttede grunnlaget for arbeid med tilgjengelighet er retningslinjene fra Web Accessibility Initiative (WAI). WAI er en undergruppe i W3C. 7

WAI WAI arbeider på 3 områder med tilgjengelighet: innhold på nettsider: Web Content Accessibility Guideline (WCAG). utviklingsverktøy: Authoring Tool Application Guideline (ATAG). nettlesere: User Agent Accessessibility Guideline (UAAG). www.w3.org/wai/ Ressurser WCAG 1.0 finner du på adressen: www.w3.org/tr/wcag10/ Teknikker tilpasset WCAG 1.0 finner du på: www.w3.org/tr/wcag10-techs/ HTML-teknikkene tilpasset WCAG 1.0 finner du på: www.w3.org/tr/wcag10-html-techs/ CSS-teknikker tilpasset WCAG 1.0 finner du på: www.w3.org/tr/wcag10-css-techs/ Ressurser Det finnes flere nettsteder som beskriver hvordan retningslinjene kan implementeres i praksis. Et slikt nettsted er Accessify www.accessify.com, som har samlet en rekke linker og verktøyer som er nyttig for å kunne kontrollere og forbedre tilgjengeligheten. Ressurser På www.webaim.org/ finner du også mange gode råd og verktøy. Nettsteder og tilhørende URLer ikke alltid like lett å finne tilbake til. Derfor har Deltasenteret www.shdir.no/deltasenteret/ og Norge.no www.norge.no egne sider som gir deg oppdatert informasjon om tilgjengelighet og arbeidet med å fremme tilgjengelighet i Norge. HTML-verktøy W3C HTML validator W3Schools W3Schools er en referansemanual for HTML. Her kan du se hvilke HTMLtagger som er i bruk og hvilke attributter som finnes. Her kan du også finne ut hvilke tagger som hører til i hvilke HTML-versjoner, hva taggene kan brukes til og hvilke nettlesere de fungerer i. W3Schools er integrert i Accessibility Toolbar. Se menypunktet References > Language references, eller på adressen: http://www.w3schools.com/tags/ W3C s HTML-validator kan brukes for å teste hvorvidt nettsiden overholder en valgt HTMLstandard. Dersom HTML-koden ikke er riktig, er det stor sannsynlighet for at nettsiden heller ikke er tilgjengelig. Testing av nettsider bør derfor alltid starte med en test av HTML-koden. HTML-validatoren er integrert i Accessibility Toolbar, men finnes også på adressen: validator.w3.org Med HTML-validatoren kan man både teste sider som er lagt ut på nettet og laste opp og teste sider som ennå ikke er lagt ut. 8

HTML Tidy HTML Tidy er et program som rydder opp i HTML-dokumenter. Programmet kan fjerne spesielle koder som blir satt inn når Microsoft Word brukes til å generere HTML-dokumenter. HTML Tidy er integrert i Accessibility Toolbar, men du finner den også på adressen: infohound.net/tidy/ WCAG-retningslinjene WCAG-retningslinjene deler opp kravene til tilgjengelighet i tre nivåer: Krav som må oppfylles, utgjør nivå 1 eller A. Krav som bør oppfylles, utgjør nivå 2 eller AA. Krav som kan oppfylles og som forbedrer tilgjengeligheten ytterligere, utgjør nivå 3 eller AAA. Innstilling av tekststørrelse i Internet Explorer Alle nettlesere har innebygd en funksjon som gjør det mulig å endre tekststørrelse. Likevel er det slik at mange nettsider overstyrer denne funksjonen. Dette skjer ofte fordi webdesigneren ønsker at sidene skal framstå med det samme utseendet uansett hvilke nettleser og hvilke innstillinger som benyttes. Resultatet blir at mange brukere rett og slett ikke kan lese teksten på nettsiden. Hvordan funksjonshemmede opplever nettet Film med funksjonshemmede nettbrukere kan lastes ned fra: www.doit.wisc.edu/accessibility/video Offentlige retningslinjer for nettsteder Du finner nærmere informasjon om hvilke krav til som stilles til offentlige nettsteder på Norge.no. Retningslinjer for hvordan Internett kan bli tilgjengelig for alle finner du sidene til Deltasenteret. Se: http://www.norge.no/kvalitet/default.asp http://www.shdir.no/samspill/involvere_brukerne/inter nett_for_alle/ Se også Deltasenterets sider: http://www.shdir.no/deltasenteret/ Neste gang Tirsdag 28: Praktisk prosjektarbeid 9