Încărcare...
Te afli aici:  Prima pagină  >  Studii de caz  >  Analize și sugestii  >  Pagina de mai jos...

16 ministere – recomandări generale de uzabilitate pentru paginile web

Scris, tradus sau adaptat de la 11 iunie 2012 și nu are nici un comentariu

Există intenția de a unifica sub același șablon vizual comun toate paginile web ale Ministerelor Republicii Moldova. Am fost invitați de către Centrul de Guvernare Electronică să venim cu sugestii și recomandări. Asta și urmează să facem în acest articol.

Să vedem întâi lista cu toate paginile web a ministerelor:

  1. Ministerul Economiei
  2. Ministerul Finantelor
  3. Ministerul Justitiei
  4. Ministerul Afacerilor Interne
  5. Ministerul Afacerilor Externe si Integrarii Europene
  6. Ministerul Apararii
  7. Ministerul Dezvoltării Regionale si Construcţiilor
  8. Ministerul Agriculturii si Industriei Alimentare
  9. Ministerul Transporturilor şi Infrastructurii Drumurilor
  10. Ministerul Mediului
  11. Ministerul Educatiei
  12. Ministerul Culturii
  13. Ministerul Muncii, Protectiei Sociale şi Familiei
  14. Ministerul Sanatatii
  15. Ministerul Tehnologiei Informatiei şi Comunicaţiilor
  16. Ministerul Tineretului şi Sportului

Ar dura prea mult să facem o analiză detaliată pentru fiecare în parte, așa că vom veni cu o listă generală de sugestii pentru a avea un punct de pornire pentru șablonul comun care se dorește a fi realizat.

Întâi vezi paginile web pe baza cărora vom scrie recomandările.

               

Deci, să începem.

Layout

Observăm că există și designuri cu lățime fixă (fixed width) și cu lățime variabilă în funcție de rezoluția ecranului (liquid design):

Design cu lățime fixă

Lățime fixă în funcție de rezoluția ecranului

Exemplu de design cu lățime fixă în funcție de rezoluția ecranului

Design cu lățime fixă

Plusurile pentru designurile cu lățime fixă ar fi:

  • sunt mai simplu de folosit și de lucrat cu, în termeni de design
  • păstrează aceleași dimensiuni a elementelor și nu schimbă forma acestora în funcție de rezoluție – deci există un control mai mare asupra elementelor din punct de vedere vizual. Amplasarea elementelor e aceeași indiferent de rezoluție sau browser.
  • compatibilitate mai mare cu browserele

Minusuri pentru designurile cu lățime fixă:

  • lateral poate rămâne mult spațiu nefolosit dacă ecranul are o rezoluție mare
  • sau pot să nu încapă pe ecranele cu rezoluții mai mici apărând derularea orizontală

Design cu lățime variabilă în funcție de rezoluția ecranului

Exemplu de design cu lățime variabilă în funcție de rezoluția ecranului

Design cu lățime variabilă în funcție de rezoluția ecranului

Plusuri:

  • dacă este bine realizat, poate elimina derularea orizontală la ecranele cu rezoluție mare

Minusuri:

  • arată diferit la diferite rezoluții
  • elementele și spațierea dintre acestea se schimbă și sunt mai greu de controlat

Recomandăm folosirea unui layout cu lățime fixă care are la bază grila de 960 de pixeli. Aceasta ar permite pe viitor să fie implementată și compatibilitatea paginilor web cu diverse dispozitive mobile (telefoane, tablete – vezi exemplu). Plus ar da mai multă regularitate șablonului care va fi și așa personalizat pentru fiecare minister în parte.

Grila de 960 de pixeli ar permite ulterior implementarea designului adaptiv pentru dispozitivele mobile.

Coloanele

Înafară de coloana centrală de conținut, există coloane laterale, care conțin diferite elemente, fie meniuri, fie bannere, fie alte elemente. Au însă dimensiuni diferite și nu respectă grila de 960 de pixeli.

Identitate vizuală

Logo-ul fiecărui minister, cu toate că aproape peste tot este amplasat în partea din stânga sus al paginii, are diferite mărimi (cu toate că majoritatea conțin stema și denumirea ministerului respectiv) și apare pe diferite fundaluri (mai închise sau mai deschise ca și culoare față de logo). Plus corpul caracterelor cu care sunt scrise denumirile ministerelor sunt de diferite mărimi, stiluri și culori.

Recomandarea noastră în această privință ar fi următoarea: să se elaboreze un ghid care să specifice exact modul în care logoul să fie prezent pe pagina web a ministerului. Ideal ar fi un brandbook.

Eliminarea oricărui element grafic inutil

Observăm tendința de a decora în special partea de sus a paginii (header-ul). În momentul în care aceasta nu are o funcționalitate, mai degrabă ar putea face rău decât bine utilizatorilor. Recomandăm eliminarea imaginilor de fundal care îngreunează citirea, scad contrastul și încarcă inutil pagina web.

În rezultat, pe toate paginile site-ului se repetă aceste elemente grafice care nu au funcționalitate.

Navigarea

Modelele de navigare sunt diferite ca poziționare și ca compartimentare:

  • meniu de navigare orizontal cu submeniuri derulante
  • meniu de navigare orizontal plus meniu de navigare vertical
  • meniu de navigare vertical

Despre arhitectura informației și compartimentare probabil că vom vorbi în alt articol. Lucrurile însă nu stau bine la acest capitol acum.

Legăturile (link-urile)

Deci legăturile trebuie să arate ca legăturile. Un link nu e sugestiv dacă este de culoare neagră, sură sau verde.

Fiind de culoare albastră, data pare a fi un link în loc de titlul articolului, care de fapt este un link.

Aspectul vizual al conținutului

   

De ce să nu fie folosită aceeași garnitură? Recomandăm Arial din simplu motiv că este ușor de citit, plus e cel mai des folosit și utilizatorii sunt deprinși cu această garnitură pe paginile web.

E necesară și opțiunea de a mări și micșora textul.

Spațierea între rândurile paragrafelor de text trebuie să fie corect folosită, pentru a crește citibilitatea.

Titlurile trebuie să se vadă că sunt titluri, fără a folosi doar majuscule, care ar îngreuna citirea acestora.

Plus iată alte câteva recomandări.

Comunicarea

Probabil că este interesant conținutul noutăților și evenimentelor prezentate, însă ca și cetățean m-ar interesa mai degrabă să înțeleg cu ce se ocupă respectivul minister și în privința a ce probleme mă pot adresa. Și toate astea în termeni cât mai aproape de mine, cetățeanul, și nu în zeci de pagini cu hotărâri dintr-un document Word.

M-ar mai interesa și job-urile propuse de fiecare minister în parte. O idee ar fi să fie centralizate pe o singură pagină toate posturile de muncă vacante de la toate ministerele.

Ca și persoană juridică, achizițiile publice mi-ar fi interesante.

Deci. Ce recomandăm pentru noul șablon unic de pagini web a ministerelor:

  • Layout centrat cu lățime fixă, bazat pe grila de 960 de pixeli și adaptarea paginilor web pentru dispozitivele mobile. Respectarea acelorași rapoarte și mărimi la implementarea coloanelor laterale.
  • Elaborarea unui ghid de identitate vizuală
  • Eliminarea elementelor grafice inutile care au doar rol decorativ
  • Lucru asupra arhitecturii informației, compartimentării și navigației. Găsirea unui model unic optim.
  • Respectarea regulilor de uzabilitate în momentul execuției tehnice a designului și apoi implementării paginilor web
  • Comunicarea mai aproape de cetățean și mai pe înțelesul acestuia

Vom reveni cu actualizări a acestui articol.

Despre cine a scris sau tradus și adaptat acest articol

avatar

Fondator și Art Director @ RT Design Studio

De 10 ani "in the business". A dezvoltat, conceput și realizat mii de designuri, interfețe grafice și pagini web. Este fondatorul companiei RT Design Studio, care se ocupă și cu studiul, consultanța și realizarea de User Interface. Contribuie la dezvoltarea UX.MD scriind analize și studii de caz. Plus implică echipa RT Design Studio în dezvoltarea platformei tehnice și interfeței grafice a acestei pagini web.

Citește în continuare...

rt-contacts-android

Sugestii de îmbunătățire pentru interfața aplicației Contacte a telefonului Samsung Galaxy S3

Citește →