Sajt javne institucije se prečesto dizajnira kao ogledalo organizacije: meni po sektorima i odeljenjima, početna sa porukom direktora i grbom, „Dokumenta“ sa tri stotine fajlova. Građanin koji hoće da preda zahtev ne zna u kom je sektoru, i to ne treba ni da zna. Veb-dizajn za institucije počinje od zadataka korisnika (šta građani, privreda i zaposleni dolaze da urade, sa telefona, često sa čitačem ekrana), nastavlja se informacionom arhitekturom koja te zadatke stavlja na vrh (najtraženije usluge, dokumenti koji se nalaze, pretraga, kontakt za dva klika), i završava se testiranjem sa stvarnim ljudima, pristupačnošću i brzinom, sa zapisnikom. Estetika dolazi posle toga i služi tome; institucija koja to obrne dobije lep sajt koji niko ne može da koristi.
Ukratko
- Tri publike, deset zadataka: građani, privreda i zaposleni; lista zadataka iz evidencije poziva i šaltera je osnova dizajna, ne organizaciona šema.
- Navigacija po uslugama, ne po sektorima; dokumenti po vrsti i godini sa pretragom; kontakt službe i informator za dva klika.
- Mobilni i pristupačni scenariji su podrazumevani: telefon na sporoj vezi, uvećan tekst, tastatura, čitač ekrana, ćirilica i latinica.
- Dizajn se testira zadacima, na prototipu i pre objave, sa stvarnim korisnicima i zapisnikom; ne odobrava se na prezentaciji.
Ovaj tekst je o dizajnu i strukturi. Propisi koji određuju obavezne sadržaje, pisma, domen i pristupačnost obrađeni su u tekstovima kako planirati sajt državne ustanove usklađen sa propisima i uredba o veb-prezentaciji organa: projektna lista; dizajn ih pretpostavlja.
Ko koristi sajt
Prvi dokument dizajna nije skica, već lista: ko dolazi, šta hoće da uradi, pod kojim uslovima. Iz nje proizlazi sve ostalo: šta je na početnoj, kako izgleda meni, koliko klikova do obrasca.
Građani, privreda i zaposleni
Građani su najbrojniji i najmanje strpljivi: dolaze sa telefona, u trenutku potrebe, i traže konkretno: kako da ostvarim uslugu (postupak, obrazac, prilozi, rok, taksa, gde se predaje), radno vreme i kontakt službe, status svog predmeta ili prijave, obaveštenje koje se tiče njihove ulice ili grupe (konkurs, javna rasprava, prekid), dokument (odluka, cenovnik, pravilnik) koji im neko pominje. Njihov zadatak retko traje duže od dva minuta i retko uključuje čitanje o misiji institucije. Privreda (firme, preduzetnici, njihovi knjigovođe i advokati) dolazi po postupke i obrasce za privredne subjekte, javne nabavke (plan, postupci, dokumentacija), javne pozive i konkurse, propise i tumačenja, takse i naknade, kontakte nadležnih; njima treba pretraga po dokumentima i preciznost (verzije, datumi, prilozi), i često rade sa računara, ali proveravaju sa telefona. Zaposleni institucije i drugi organi koriste sajt kao referencu (kontakti, akti, obrasci) i kao mesto koje sami pune (urednici); njihov zadatak je da nađu i da objave, pa dizajn panela (tipovi sadržaja, polja, radni tok) spada u dizajn sajta. Mediji i nadzor traže dokumente, informator, kontakte i datume; nisu brojni, ali su glasni kad ne nađu. Lista zadataka se pravi iz evidencije poziva i šaltera, pitanja e-poštom, pretrage na starom sajtu, i razgovora sa službenicima na šalteru (oni znaju šta ljudi pitaju); deset najčešćih zadataka po publici, sa učestalošću, postaje osnova strukture i test lista; kako se to radi za komunalno preduzeće, sa konkretnim funkcijama, u tekstu sajt javnog komunalnog preduzeća.
Mobilni i pristupačni scenariji
Institucija ne bira publiku, pa dizajn mora da radi za uslove koje dizajner nema na svom stolu. Mobilni scenario: telefon srednje klase, star nekoliko godina, mobilna veza sa slabim signalom (u zgradi institucije često najslabijim), jedna ruka, uvećan tekst u podešavanjima telefona, sunce na ekranu; dizajn: tekst pre slika, dugmad od najmanje 44 px sa razmakom, kontrast koji se vidi na suncu, bez slajdera i animacija, meni koji se otvara jednim dodirom, forma sa poljima koja otvaraju pravu tastaturu, PDF koji se otvara u pregledaču. Pristupačni scenario: korisnik sa čitačem ekrana (struktura naslova, alt tekstovi, oznake polja, redosled fokusa), korisnik samo sa tastaturom (vidljiv fokus, sve dostupno Tab-om, bez zamki), slabovid korisnik (uvećanje 200 % bez gubitka, kontrast 4,5:1, ne samo boja za značenje), korisnik sa kognitivnim teškoćama ili bez navike (jednostavan jezik, jedna glavna radnja po stranici, dosledan raspored, bez iznenađenja); standard je WCAG nivo AA, ali scenariji se testiraju sa ljudima, ne samo alatom; lista po kriterijumima u WCAG vodiču za organizacije. Pismo i jezik: ćirilica i latinica sa istim sadržajem i prebacivanjem na svakoj strani, jezici nacionalnih manjina gde su u službenoj upotrebi, jednostavan srpski bez birokratskog žargona (ili sa objašnjenjem pojma uz termin), engleski samo za sadržaj koji strancima zaista treba. Scenario „ne znam gde sam“: korisnik koji stiže iz pretrage na unutrašnju stranu mora odmah da vidi gde je (putanja, naslov, institucija), šta može da uradi i kako do kontakta; početna nije jedini ulaz, za većinu nije ni glavni. Ovi scenariji ulaze u specifikaciju kao stavke sa kriterijumom, pa izvođač zna šta se testira; kako se to piše, u tekstu kako izabrati izvođača za sajt javne ustanove.
Informaciona arhitektura
Arhitektura je odgovor na pitanje „gde je šta“ pre nego što se nacrta ijedan ekran. Za instituciju to znači: usluge na vrh, dokumenti u red, pretraga koja radi, kontakt uvek na dohvat.
Najtraženije usluge
Meni po zadacima: glavna navigacija ima pet do sedam stavki koje odgovaraju onome što ljudi rade, ne organizaciji: Usluge (za građane / za privredu), Dokumenti, Vesti i obaveštenja, O instituciji (tu je organizaciona šema, za one koji je traže), Kontakt; Informator i Javne nabavke kao izdvojeni ulazi jer ih traže određene publike; sektori i odeljenja postoje unutar „O instituciji“ i kao filter, ne kao meni. Početna strana je stranica zadataka: na vrhu polje pretrage ili pitanje „šta vam treba“ sa pet najčešćih zadataka kao dugmadima, ispod hitna obaveštenja sa datumom, zatim najtraženije usluge, aktuelno (konkursi, rasprave) i kontakt; poruka rukovodioca, grb i istorijat idu u „O instituciji“. Stranica usluge uvek ima istu strukturu (šta je, ko može, šta treba, gde i kako, rok, taksa, kontakt, česta pitanja), jer korisnik koji je jednom naučio raspored nalazi sve i na drugoj usluzi; obrasci se preuzimaju sa te stranice, ne iz zasebne „Obrasci“ zbirke bez konteksta (zbirka može da postoji kao dodatni ulaz). Grupisanje usluga po životnim situacijama i publici („rođenje deteta“, „otvaranje firme“, „gradnja“), ne po propisu koji ih uređuje; nazivi kako ih ljudi zovu, sa sinonimima u pretrazi. Za dva klika: pravilo koje se meri: od početne do obrasca, kontakta službe, informatora i najnovijeg obaveštenja u najviše dva-tri klika, i sa telefona. Tipovi sadržaja u sistemu (usluga, dokument, obaveštenje, kontakt, nabavka) sa poljima omogućavaju da se ista informacija prikaže na više mesta bez prepisivanja i da se strukture (tabele po godinama, filteri, pretraga) grade same; šta te celine sadrže za javno preduzeće, u tekstu šta treba da sadrži sajt javnog preduzeća.
Dokumenti, pretraga i kontakt
Dokumenti: svaki sa vrstom, godinom, datumom, organom, verzijom i naslovom koji čovek razume; lista sa filterima (vrsta, godina, organ) i tabela po godinama za planove i izveštaje; PDF sa tekstualnim slojem, veličina vidljiva pre preuzimanja, stalne adrese; arhiva bez brisanja; dokument koji se pominje u usluzi ili vesti linkovan je iz nje. Pretraga: vidljiva na svakoj strani (na telefonu ikona koja otvara polje), po naslovu i sadržaju stranica i dokumenata, na oba pisma i sa tolerancijom na dijakritike i greške u kucanju, sa predlozima dok se kuca, sa rezultatima koji pokazuju vrstu i datum i sa filterima; posebna pretraga za usluge („šta vam treba“) sa sinonimima. Pretraga je za instituciju često glavna navigacija: većina korisnika koji ne nađu za dva klika kuca. Kontakt: jedna stranica sa svim kanalima (telefoni po službama, e-pošta, adrese, radno vreme, pisarnica, mapa), a na svakoj usluzi i dokumentu kontakt nadležne službe; „kome da se obratim“ koja preslikava problem na službu; kontakt za pristup informacijama, za zaštitu podataka i za pristupačnost posebno navedeni. Vesti i obaveštenja sa vrstom, datumom, prilozima i arhivom; hitna na vrhu početne; mogućnost pretplate po vrsti ili temi. Podnožje kao sigurnosna mreža: mapa sajta, informator, politike, izjava o pristupačnosti, pisma, kontakt. Ono što ne ide u arhitekturu: sekcije koje nemaju vlasnika i sadržaj (galerije bez svrhe, „korisni linkovi“, prazne stranice sektora), jer svaka prazna ili zastarela stranica smanjuje poverenje u sve ostale.
| Element | Po organizaciji (kako se najčešće radi) | Po zadacima korisnika (kako treba) | Kako se proverava |
|---|---|---|---|
| Glavni meni | Sektori, odeljenja, „O nama“ prvo | Usluge (građani / privreda), Dokumenti, Obaveštenja, O instituciji, Kontakt | 5 zadataka za ≤ 3 klika sa telefona |
| Početna | Poruka direktora, grb, vesti | „Šta vam treba“ + 5 zadataka, hitna obaveštenja, najtraženije usluge, kontakt | Test sa korisnicima: prvi klik pogađa |
| Usluge | Opis nadležnosti sektora | Stranica po usluzi: šta, ko, šta treba, gde, rok, taksa, kontakt, FAQ; po životnim situacijama | Obrazac i kontakt na stranici usluge |
| Dokumenti | „Dokumenta“ sa 300 fajlova | Vrsta, godina, organ, verzija; filteri; tabela po godinama; PDF sa tekstom; stalne adrese | 10 stvarnih upita nalaze dokument |
| Pretraga | Nema je ili ne radi na ćirilici | Sadržaj + dokumenti, oba pisma, dijakritici, predlozi, filteri, sinonimi usluga | Rezultat u prva 3 za 10 upita |
| Kontakt | Jedna centrala | Po službama + na svakoj usluzi; „kome da se obratim“; informacije, podaci, pristupačnost | Kontakt službe za 2 klika |
| Pismo i jezik | Jedno pismo, birokratski žargon | Ćirilica/latinica sa istim sadržajem, jezici manjina gde treba, jednostavan jezik | 5 strana upoređeno; test razumljivosti |
Testiranje
Dizajn institucije se ne odobrava na prezentaciji, već na testu: mogu li stvarni ljudi da obave zadatke, radi li za tastaturu i čitač ekrana, koliko traje na telefonu. Test se radi dva puta, na prototipu i pre objave, i oba puta ima zapisnik.
Zadaci sa stvarnim korisnicima
Kad: prvi put na prototipu (klikabilna skica strukture i ključnih strana, pre dizajna i razvoja, kad je promena jeftina), drugi put na probnom serveru pre objave (sa stvarnim sadržajem), treći put posle objave na uzorku (kvartalno, sa održavanjem). Ko: pet ljudi po publici je dovoljno da se vide glavni problemi: građani različitih godina (uključujući starije), predstavnik privrede (knjigovođa, preduzetnik), zaposleni koji ne rade na projektu, i bar jedna osoba koja koristi čitač ekrana ili uvećanje; regrutuju se na šalteru, preko udruženja, među poznanicima zaposlenih; nagrada je simbolična. Kako: pet zadataka iz liste najčešćih („nađite obrazac za X i kontakt službe“, „proverite kad je javna rasprava“, „nađite cenovnik i koliko košta Y“), bez pomoći, na sopstvenom telefonu ili na računaru sa čitačem ekrana; posmatrač beleži: da li je zadatak obavljen, za koliko klikova i vremena, gde je zastao, šta je rekao naglas; ne objašnjava i ne brani dizajn. Šta se meri: udeo obavljenih zadataka (cilj: svih pet obavi bar četvoro od petoro), prvi klik (da li pogađa pravu granu), vreme, mesta zastoja; rezultati po zadatku u zapisnik, sa prioritetom popravki (zadatak koji niko nije obavio se rešava pre objave, ne posle). Šta se popravlja: nazivi u meniju (najčešći problem: birokratski nazivi), redosled na početnoj, nedostajući link ka obrascu ili kontaktu na stranici usluge, pretraga koja ne razume kako ljudi kucaju, dužina i jezik teksta. Test razumljivosti: stranicu usluge da pročita neko van struke i prepriča postupak; ako ne može, tekst se piše ponovo.
Pristupačnost i brzina
Pristupačnost se testira tri puta: automatskim alatom (WAVE, axe) na svakom šablonu (nula grešaka je preduslov), ručno tastaturom i čitačem ekrana na tri ključna zadatka (posmatrač beleži gde se fokus gubi, šta čitač ne pročita, gde je red pogrešan), i sa korisnikom sa invaliditetom u testu zadataka; dokumenti (PDF) se proveravaju posebno (tekstualni sloj, naslovi, oznake tabela). Rezultat je i osnova za izjavu o pristupačnosti (šta je ispunjeno, šta nije i do kad, kontakt za prijavu). Brzina: laboratorijski test po šablonu (mobilni profil: LCP ispod 2,5 s, INP ispod 200 ms, CLS ispod 0,1), test na stvarnom telefonu sa sporom vezom za pet zadataka, i test prekinute veze (tekst i kontakt vidljivi); posle objave, Search Console i nezavisan nadzor; šta konkretno i kako, u tekstu brzina i mobilna verzija sajta ustanove. Zapisnik za oba testa: zadatak/stavka, ko, rezultat, problem, prioritet, rok, ko ispravlja, potvrda posle ispravke; deo primopredaje i dosijea sajta koji se pokazuje nadzoru. Dizajn sistema, ne stranica: boje, tipografija (čitljiv font, veličina najmanje 16 px, ćirilični rez), razmaci, komponente (dugme, kartica usluge, tabela, obaveštenje) definisani jednom, sa proverenim kontrastom i ponašanjem na telefonu, pa svaka nova stranica koju urednik napravi iz obrasca nasleđuje sve; estetika institucije (grb, boje, ozbiljnost) ulazi u taj sistem, a ne u svaku stranicu posebno. Posle objave: kvartalni test pet zadataka na uzorku, praćenje pretrage bez rezultata i pitanja telefonom koja su već na sajtu, i ispravke u okviru održavanja; dizajn institucije je gotov kad građanin obavi zadatak, a ne kad je odobren na sastanku. Ovako pristupamo sajtovima ustanova: lista zadataka, prototip sa testom, sistem dizajna, test pre objave i kvartalno; opis na stranici rešenja za javni sektor.
Najčešća pitanja o veb-dizajnu za javne institucije
Zašto meni sajta institucije ne treba da prati organizacionu šemu?
Jer građanin ne zna u kom je sektoru njegov zahtev i ne treba da zna; on traži uslugu, dokument, obaveštenje ili kontakt. Meni po zadacima (Usluge za građane i privredu, Dokumenti, Obaveštenja, O instituciji, Kontakt) vodi do cilja za dva-tri klika, a organizaciona šema ostaje u „O instituciji“ i kao filter.
Šta treba da bude na početnoj strani sajta institucije?
Polje pretrage ili pitanje „šta vam treba“ sa pet najčešćih zadataka kao dugmadima, hitna obaveštenja sa datumom, najtraženije usluge, aktuelni konkursi i rasprave, i kontakt. Poruka rukovodioca, grb i istorijat idu u „O instituciji“; početna nije jedini ulaz, jer većina korisnika stiže iz pretrage na unutrašnje strane.
Kako da testiramo dizajn pre objave bez velikog budžeta?
Pet ljudi po publici (građani različitih godina, neko iz privrede, zaposleni van projekta, jedna osoba sa čitačem ekrana), pet zadataka iz liste najčešćih, bez pomoći, na sopstvenom telefonu; posmatrač beleži uspeh, klikove, vreme i zastoje. Dva sata na prototipu i dva sata pre objave otkriju većinu problema; nagrada je simbolična.
Da li sajt institucije mora da bude na ćirilici i latinici?
Ćirilica je službeno pismo za organe i ustanove sa javnim ovlašćenjima, pa se planira kao osnovna; latinica i jezici nacionalnih manjina dodaju se gde su u službenoj upotrebi, sa istim sadržajem i prebacivanjem na svakoj strani. Obim proverava pravna služba; dizajn pretpostavlja oba pisma i pretragu koja ih razume.
Kako da sajt ostane upotrebljiv posle objave?
Sistem dizajna sa obrascima koje urednici koriste (nova stranica nasleđuje raspored i kontrast), tipovi sadržaja sa poljima umesto slobodnog unosa, kvartalni test pet zadataka na uzorku, praćenje pretrage bez rezultata i pitanja telefonom koja su već na sajtu, i ispravke kroz održavanje sa zapisnikom.
Planirate sajt institucije koji građani mogu da koriste?
Počinjemo listom zadataka po publici, gradimo prototip i testiramo ga sa stvarnim ljudima pre dizajna, pa sajt sa sistemom dizajna, tipovima sadržaja i pretragom koja razume oba pisma; test pre objave i kvartalno, sa zapisnikom.
