Århus Kommunes nye hjemmeside - en ny side af Århus Kommune! Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

Transkript

1 Århus Kommunes nye hjemmeside - en ny side af Århus Kommune! Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

2 Projektplan Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Opstart Konceptudvikling Kravspecifikation Valg af leverandør Arkitektur og design Teknisk implementering Organisatorisk implementering Offentliggørelse (1. marts 2010) HER ER VI NU

3 Århus en god by for alle Adgang for alle! Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

4 Århus Kommune Projekt Ny Hjemmeside Århus Kommunes nye hjemmeside skal som minimum leve op til de obligatoriske standarder for offentlige hjemmesiders tilgængelighed. Borgmesterens Afdeling Århus Kommunes handicappolitik

5 Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

6 Opstart: Hvordan gør vi? Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Udgangspunkt: Vi ved intet! Kan vi stole på, at leverandørerne gør det? Vi har brug for eksperter!

7 Opstart: Tilknytning af ekspertviden Styregruppe Kvalitetssikring Projektledelse Leverance Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

8 Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Tilgængelighed i alle faser Konceptudvikling Ekspertvurdering Kravspecifikation Kvalitetssikring af kravspecifikation... Valg af leverandør Ekspertvurdering af tilbud Arkitektur og design Workshop Teknisk implementering Validering og brugertest Organisatorisk implementering Uddannelse og vejledning

9 Fase: Konceptudvikling Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Politisk Basis Værdi Involvering Personalisering Dybde Deling Vækstbehov Datauniformitet Dialog Åbenhed Opfølgning Brugervenlighed Information Kontakt Selvbetjening Dataredelighed Tilgængelighed Bredde Service Den digitale Maslow Mangelbehov

10 Fase: Konceptudvikling Identifikation af potentielle faldgruber, eksempelvis kortløsning Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

11 Fase: Konceptudvikling og kommunens skabeloner Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

12 Fase: Kravspecifikation Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Hjemmeside skal overholde retningslinier for tilgængeligt webdesign på niveau AA (kontrolpunkter med prioritet 1 og 2), jf. WCAG 1.0 (Web Content Accessibility Guidelines) Århus Kommune ønsker, at hjemmesiden og CMS-systemet skal leve op til kravene i ATAG 1.0 (Authoring Tool Accessibility Guidelines)

13 Fase: Kravspecifikation Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

14 Fase: Valg af leverandør Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Vurderingskriterier og vægte Pris: 35% Funktionalitet: 35% Implementeringskompetence: 15% Tilgængelighed: 15% Der findes ikke utilgængelige, eller tilgængelige CMS-systemer, kun utilgængelig og tilgængelige leverandører

15 Fase: Arkitektur og design Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Workshop for leverandøren: Hvad kræves af et tilgængeligt netsted? Uvildig ekspertvurdering af design, navigationsstruktur og systemarkitektur Ved udgangen af afklaringsfasen bliver ÅK og leverandør enige om et sæt godkendelseskriterier for bl.a. tilgængeligheden

16 Fase: Teknisk udvikling Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Test af tilgængelighed før overtagelse: ekspertvurdering automatisk validering brugertest baseret på godkendelseskriterier

17 Uvildig test af tilgængelighed Styregruppe Test Projektledelse Leverance Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

18 Fase: Organisatorisk implementering Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Uddannelse af indholdsleverandører tekniske færdigheder skriv-til-nettet Udarbejdelse af vejledning Organisering - arbejdsgange og roller - skal understøtte tilgængeligheden

19 Når hjemmesiden er i drift Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling Løbende kvalitetssikring af indholdet Evt. justering af arbejdsgange Løbende uddannelse af nye indholdsleverandører Uvildig test af tilgængelighed i takt med, at hjemmesiden udvikles yderligere

20 Erfaring En overordnet, kommunal tilgængelighedspolitik ville være rar at have Århus Kommune Projekt Ny Hjemmeside Borgmesterens Afdeling

21 Tilgængelighed i praksis i Erhvervs- og Byggestyrelsen

22 Om i dag Organisationen Processen Problemer Løsninger

23 EBSTs web-organisation EBSTs webafdeling Udvikling og drift af tre store sites, intranet + diverse subsites Udvikling af IA og design Webbureauer med kompetencer inden for IA, design og opkodning Ca. 15 sites og værktøjer Drift og udvikling i CMS, W2L It-konsulenter og udviklere af eget CMS W2L Designleverandør og kodehus Teknisk leverandør

24 ARBEJDSMODEL i ERHVERVS- OG BYGGESTRELSEN Fase 1 Projektopstart Fase 2 Specifikation Fase 3 Design Fase 4 Opkodning Fase 5 Implementering Fase 6 Idrift

25 Checkpunkter i arbejdet med tilgængelighed TJEKPUNKTER Fase 1 PROJEKTOPSTART Møder Kravspecifikation med HTML-krav Tidsplan med tid til test og itterationer Fase 2 IA /WIREFRAME Levering fra design leverandør Fungerer IA en Er flowet konsistent? OBR til leverandør LEVERANDØR Designbureau retter IA / Wireframe Der laves design udfra wireframen Fase 3 DESIGN Levering fra design leverandør Kontrastkrav tjekkes Er designet konsistent Tjek af at designet stemmer overens med den aftalte wireframe / IA OBR til leverandør Designbureau retter design og sender videre til HTML leverandør Fase 4 HTML Levering fra HTML leverandør Test af HTML på forskellige platforme og browsere Test af leveret HTML i forhold til W3C s prioritet 1 og 2 OBR til leverandør HTML-leverandør retter HTML Fase 5 IMPLEMENTERING EBST Implementerer Test af navigation, søgning, kvalitetstjek, links o.s.v EBST Implementerer EBST retter HTML efter implementering W3 scanning af websider.

26 Et typisk projektforløb FASE 1 FASE 2 FASE 3 FASE 4 FASE 5 FASE 6 Projektopstart Specifikation Design Opkodning Implementering Idriftsættelse Proces Mødeaktivitet og kravspecifikation (Alle) HTML-krav Procesmodel Specifikationsfas e, fx workshop, fokusgrupper, møder osv. Fra IA til Design (Designleverandør) Opkodning af design i XHTML (HTMLleverandør) Implementering af XHTML i CMS (Teknisk leverandør) Idriftsættelse (Teknisk leverandør) Resultat Tilbud fra designleverandør med opgavebeskrivelse, tidsplan og budget IA/Wireframes Design i Photoshop XHTML Løsning til test Publiceret løsning Tidsplan Proces Gennemgang af IA/Wireframes (EBST) Gennemgang af design ift. wireframes (EBST) Validering (EBST) OBR Test og fejlrapportering (EBST) Fejlrettelser (HTML-leverandør og Teknisk leverandør) evt. flere gange Resultat Godkendt IA/Wireframes Godkendt design Godkendt XHTML Godkendt løsning Tilgængelig webløsning.

27 I drift og top tunet men Vores tekniske tilgængelighed bliver vurderet til 68% i BPN

28 Hvorfor? Forkert placering af labels Ikke sigende alt-tekster Ikke sigende links

29 Labels? Sitet er testet uden fejl i labels med W3C XHTML test AIS toolbar SiteImproves Sitecheck

30 Sitecheck viser ingen fejl i labels Html validerer i W3C AIS toolbar viser ingen fejl i labels

31 Web Content Accessibility Report fra HiSoftware viser en fejl

32 Når det tilgængelige site skal driftes + 25 redaktører Alle regioner

33 Vi laver en manual

34 Men der går ikke mange redaktørtimer før Det går galt med: Sigende alt-tekster

35 Det går galt med: Sigende links

36 Det går galt med: Tabellerne

37 Det går galt med: H1, H2, H3 osv

38 Det går galt med: Title til links

39 Hvad kan automatiseres? Alt- tekst og title Information i title om eksternt websted Information i title om åbner i nyt vindue Tagging af sprog Markering af citater Link til Wai-test Link til W3C-test

40 Eftercheck før publicering Politiprogram..

41 Implementering af test i CMS

42 Tilgængelighedsrapport

43 Der er stadig udeståender Vi kommer ikke uden om fortsat at informere om at: Imagemap skal overholde visse krav Video/flash skal have alt-tekst som beskriver at det visuelle spor. Undgå at anvende images til at gengive tekst. Husk markering af overskrift-kollonner i datatabeller Brug fornuftige linktekster (ikke Klik her mfl.)