Documente Academic
Documente Profesional
Documente Cultură
Website-ul ergonomic
Indrumător:
Prof. univ. dr. ing. NEDEFF VALENTIN
Student:
SIMION DUMITRU
Grupa: 342 B
-2011-
1. Introducere
2. Pagina web
O pagină web este o resursă aflată în spațiul web (WWW) din Internet,
de obicei în format HTML sau XHTML (extensia numelui fișierului fiind de
cele mai multe ori .html sau .htm) și având hiperlink-uri (hiperlegături) pentru
navigarea simplă (cu un singur clic de maus) de la o pagină sau secțiune de
pagină la alta. Pagina web se numește astfel deoarece ea se poate afișa pe un
monitor sau ecran de calculator și se aseamănă într-o oarecare măsură cu o
pagină de ziar. Lățimea paginii web este de obicei astfel făcută ca ea să încapă
în întregime pe lățimea ecranului disponibil. În schimb înălțimea ei poate
depăși cu mult pe cea a ecranului. În aceste cazuri browserul și mausul permit
de obicei vizionarea simplă și rapidă a întregii pagini, și anume prin
"tragerea" ei în sus și în jos, după dorință. (2)
O pagină web poate conține :
texte în cele mai diferite formate (forme, mărimi, culori, poziții etc.)
imagini (fișiere cu formatele .gif, .jpeg, .png ș.a.)
audio (fișiere în formatele .mid, .wav ș.a.)
conținut multimedial interactiv care, pentru a fi văzut și utilizat,
necesită de obicei un plugin ca de ex. cu formatul Adobe Flash sau
Adobe Shockwave
miniaplicații (așa-numite "applets") – subprograme care rulează la
chemarea paginii și care deseori oferă filme, imagini, interacțiune și
sunete. (3)
3
Paginile web mai pot conține și elemente care nu sunt făcute pentru a fi
afișate de browser, cum ar fi (3) :
scripturi (de obicei în formatul JavaScript), care adaugă paginii
funcționalitate suplimentară (de exemplu creează efecte vizuale sau
verifică datele introduse intr-un formular web),
meta-etichete – furnizează informații despre pagină, instrucțiuni pentru
roboții motoarelor de căutare, etc. Cuvintele cheie și celelalte descrieri
din meta-etichete ajută motoarele de căutare să catalogheze pagina
corect și, în cazul acțiunilor de căutare, să ofere rapid informații și
rezultate.
foi de stil (așa-numite "Cascading Style Sheets" sau "CSS"), care
stabilesc modul cum este formatată pagina
comentarii
Paginile web mai pot conține și așa-numiți viruși informatici precum și
alte funcțiuni dăunătoare (malițioase) dar greu de văzut/recunoscut.
3. Website-ul şi ergonomia
5
3.2. Obiectivele unui website
Crearea unui site este motivată de următoarele:
Nevoia de vizibilitate : un site web, în cazul în care este un mijloc de
promovare buna, poate fi o modalitate de creştere a vizibilităţii unei
instituţii sau unei organizaţii;
Îmbunătăţire a cunoştinţelor : prin intermediul unui site instituţional sau
al unui minisite, un profesor, de exemplu, îşi poate creşte popularitatea;
Culegerea de date : Internet poate deveni pentru întreprinderi o mare
oportunitate de a colecta date despre clienţii lor sau de a solicita noi
perspective;
Vânzări online : timizi la începuturile Internetului, utilizatorii au înteles
repede interesul Internet pentru achiziţionarea produselor de consum . Un
site web poate fi o oportunitate pentru unele companii, în termeni de
marketing;
Înlocuirea suportului pentru utilizatori : din ce în ce mai mult, companiile
utilizează Internetul ca pe un suport privilegiat pentru servicii pre-vânzare
şi post-vânzare. Prin intermediul unui site Internetul poate oferi
importante informaţii tehnice şi comerciale, cu un cost minim. (6)
3.3. Etapele de creare a unui site
Orice website are mai multe faze prin care trece pentru a ajunge într-o
formă finală cât mai atractivă şi ergonomică:
Concretizarea ideilor
Schițarea elementelor vizuale și compunerea structurii sitului
Programarea paginilor web în (HTML, CSS, Javascript etc.)
Testarea sitului
Schimbarea părților care nu corespund țintei
Publicarea sitului pe Internet sau intranet
Modificarea ulterioară și relansarea pe Internet, după nevoile clienților sau
ale timpului. (4)
După stabilirea structurii sitului se intră în etapa conceperii unei
interfețe grafice care, pe lângă scopul pur estetic, trebuie să faciliteze accesul
vizitatorilor la toate secțiunile publice ale sitului, să fie comprehensivă și, nu
în ultimul rând, să asigure și încărcarea rapidă a paginilor, prin modul în care
vor fi realizate diversele elemente grafice. (4)
Din punctul de vedere al designului, siturile sunt în mare parte alcătuite
din tabele cu linii invizibile în care se inserează imagini (siglă, imagini-
simbol, butoane etc.) și texte, în așa fel încât aspectul să fie unitar și să nu se
sesizeze vizual organizarea tabelară. Celulele tabelelor pot avea fundaluri
colorate, pot fi alcătuite din imagini și desene care se repetă pe orizontală sau
6
pe verticală, pot fi umplute cu texturi mai mult sau mai puțin neregulate (ca
pietrișul, frunzișul etc.) sau pot rămâne și albe. (4)
Este de notat că actualmente locul tabelelor a fost luat de popularul
mod de formatare CSS, care reprezintă o soluție mai "curată" din punctul de
vedere al programării decât utilizarea tabelelor. (4)
3.4. Definirea conceptului de website ergonomic
Referindu-ne la ergonomie putem spune că aceasta are ca obiectiv
adaptarea website-ului la pretenţiile vizitatorilor săi, astfel încât să fie uşor şi
confortabil de utilizat şi să creeze dorinţa de revenire. (7)
Ergonomia este o disciplină, deci regulile depind de context şi variază
în funcţie de site-ul studiat, de obiectivele sale strategice şi de vizitatori.
Există câteva principii pe care trebuie să le respectăm atunci când construim
un website:
Fiecare proiect este unic: Acestea trebuie să fie citite şi utilizate în
funcţie de specificul fiecărui proiect, cel mai important fiind
cunoaşterea vizitatorilor lor. De aceea trebuiesc efectuate studii de
cercetare a vizitatorilor, ale căror rezultate trebuiesc luate în
considerare când ne construim website-ul. (7)
Site-ul meu este ergonomic dacă poate fi utilizat şi de bunica.
Un site ergonomic, nu este neapărat un site utilizabil de către toţi
începătorii, ci un site adaptat la pretenţiile vizitatorilor. (7)
3.5. Organizarea corespunzătoare a paginilor web
Pentru ca un website să răspundă cerinţelor ergonomice, paginile pe
care le va încorpora vor trebui să îndeplinească unele cerinţe ca:
Stergerea a tot ce este inutil: cu cât o pagină conţine mai multe obiecte, cu
atât este mai dificil de integrat mental.
Limitarea încărcării paginilor: banda largă nu a rezolvat problema de
aşteptare la încărcarea anumitor pagini web. Optimizaţi fiecare obiect al
paginii, în special imaginile şi animaţiile.
Crearea unei ierarhii de lectură clar: trebuie să se distingă cel mai
important mesaj pe care doreşti să-l transmiţi. Acest mesaj trebuie să se
distingă vizual de restul paginii.
Prevederea unor template-uri care să creeze "un aer familial", comun
tuturor paginilor sitului. Această coerenţă facilitează înţelegerea sitului.
Adaptarea la rezoluţia de ecran utilizată de majoritatea vizitatorilor site-
ului, care în general nu sunt aceleaşi ca cea folosită de către proiectant.
7
Evitarea scroll-ului orizontal. Acesta poate fi rezervat pentru blocuri prea
restrânse în pagina. Acesta ar trebui să sugereze, atunci prezenţa de
conţinut ascuns, şi a facilita utilizarea de butoanele de defilare.
Scroll-ul vertical este permis pe scară largă, dar nu trebuie să
obstrucţioneze vizibilitatea elementele critice ale paginii, pentru ca le plasa
deasupra pragului de parcurgere.
Evitarea "stop scroll-ului". Cu alte cuvinte, nu daţi impresia că pagina s-a
terminat când nu este gata încă. Acest lucru se poate întâmpla, în prezenţa
unui mare gol, mai ales dacă el se întinde pe toată lăţimea paginii.
Utilizarea unui design semi-elastic în locul unuia pe deplin elastic.
Întinderea doar a coloanelor de conţinut, setând lăţimea maximă
acceptabilă. Elasticitatea poate creşte confortul (profitând de spaţiul
disponibil pe ecran), dar, de asemenea, poate scade confortul în cazul în
care nu este limitat.
Utilizarea culorii albe pentru aerarea paginii şi a permite vizitatorilor să
înţeleagă mai uşor, dar nu excesiv: limitarea albului facilitează activitatea
de scanare vizuală şi mentală a unei pagini web.
Distingerea clară a diferitelor zone ale paginii (barele de navigare,
coloanele de conţinut, informaţii suplimentare, etc.) variind formatul de
prezentare şi delimitează în mod clar zonele. (8)
3.6. Textele lizibile şi clare
Prezenţa textelor trebuie să faciliteze lecturarea ecranului. Ele trebuie
să fie cât mai lizibile posibil, de aceea e preferat XHTML-ul pentru imagini
de prezentare a textului sau informaţii importante. (9)
Este bine să se renunţe la imaginile de fundal, mai ales dacă informaţia
e valoroasă. Informaţia este importantă şi pentru clasamentul website-ului.
3.6.1. Tipografia şi culorile
Mărimea fontului suficient de mare: niciodată sub un Arial de 10 puncte
sau Verdana 9 puncte pentru corpul paginii.
Niveluri de contrast pozitive, de preferinţă caractere închise pe fond
deschis.
Niveluri de contrast, culoare şi luminozitate suficiente pentru a distinge
caracterele. Aceste reguli se aplică la toate elementele ce conţin text:
titluri, link-uri, meniuri, butoane sau imagini.
Limitarea numărului de culori diferite. Acest lucru poate ajuta la
construirea ierarhică a conţinutului.
Evitarea mono-cazurilor (toate majuscule sau toate cu litere mici) şi
utilizarea cazurilor mixte.
Utilizarea majusculelor numai pentru a atrage atenţia.
8
Limitarea utilizării majusculelor pentru fraze foarte scurte. Majusculele
sunt mai dificil de citit din cauza modelelor mentale (suntem mai
obişnuiţi să vedem acelaşi cuvânt scris cu minuscule decât cu majuscule)
şi a formelor caracterelor scrise cu majuscule: e mai dificil de distins
fiecare literă când au aceeaşi înălţime.
Evitarea formatului italic, dificil de citit pe ecran. Utilizarea acestuia se
va face în cazul citărilor.
Textul ne-clickabil trebuie să se diferenţieze de cel clickabil.
Evitarea sublinierii textului pentru a scoate în evidenţă o idee poate să
inducă în eroare cititorul care va crede că textul subliniat este un link. (9)
3.6.2. Managementul paragrafelor şi liniilor de text
Pentru paragrafe este recomandată utilizarea unui font sans-serif sau
baton, fără gravare, mai uşor de citit.
Evitarea explicaţiilor în cazul liniilor scurte.
Este de preferat alinierea stânga, mai ales pentru paragrafele lungi.
Alinierea dreapta sau centrat complică lecturarea ţi compararea.
Liniile de text să nu fie nici prea lungi, nici prea scurte.
Lungimea ideală pare a fi între 60 şi 100 de caractere pe linie. Atentie
la template-urile elastice, care pot crea linii ilizibile din cauza lungimii.
(9)
3.6.3. Scrisul pe web trebuie să faciliteze scanarea
Trebuie reţinut faptul că vizitatorii scanează paginile.
Majoritatea paginilor nu sunt citite cu adevărat ci sunt scanate sau
măturate vizual. Vizitatorul caută ceea ce îl interesează, de aceea trebuie
ajutat să citească pe diagonală.
Utilizarea limbajului familiar cititorilor, evitând discursurile sau
limbajul tehnic, cu excepţia cazurilor în care aceasta se face în mod
deliberat.
Un paragraf trebuie să conţină o singură idee.
Frazele să fie scurte.
Evidenţierea cuvintelor cheie, prin îngroşare, însă este exclus abuzul
pentru anu îngreuia citirea pe diagonală.
Utilizarea căt mai des a divizării ideilor în liste cu marcatori.
Utilizarea diatezei active în locul celei pasive.
În Internet conţinutul este rege, deci el poate face diferenţierea.
Pentru textele lungi trebuie să se facă posibilă imprimarea – din care să
lipsească însă bara de navigare.
Un concept înseamnă un cuvânt. Fiecare element al paginii trebuie să
primească o denumire. (9)
9
3.6.4. Titlurile şi etichetarea
Crearea unei dimensionări ierarhice a textului titlurilor în funcţie de
importanţa conceptuală, însă un titlu îngroşat va fi mai mic decât unul de
talie mijlocie.
Limitarea lungimii titlurilor şi etichetelor – vizitatorii le citesc adesea.
Începereaa titlului cu acele cuvinte cheie.
Conferirea unor titluri explicite pentru fiecare pagină, care să poată fi
utilizate şi ca etichete. (9)
3.7. Hipertextele –cheia unei navigări reuşite
3.7.1. Link sau buton
Linkul se utilizează mai ales pentru navigare (trecerea de la o
informaţie la alta) iar butoanele pentru lansarea acţiunilor (acceptarea unor
schimbări, trimiterela...). Butoanele sunt rezervate pentru acţiunile
principale. Link-uri au în acest caz, avantajul că încarcă mai puţin interfaţa.
(10)
10
Integrarea legăturilor propriului conţinut în paragrafe. Nu trebuie
rezervată navigarea pentru bara de meniu.
Dimensionarea link-ului. O legătură mai lungă este mai vizibilă şi mai
uşor de accesat.
Atunci când link-ul este compus dintr-un simbol sau pictogramă şi text,
zona clickabilă ar trebui să cuprindă toate elementele.
Evitarea ca linkul să depăşească o linie. (10)
3.7.5. Distingerea diferitelor tipuri de link-uri
Link-uri interne/externe. Diferenţierea se poate face într-un mod cât mai
convenţional prin reprezentarea link-urilor externe printr-o icoană cu o
fereastră nouă sau o săgeată spre exterior.
Este necesar ca utilizatorul să ştie din timp spre ce se îndreaptă, de
aceea se pot utiliza pictograme sau indicaţii textuale (PDF, WORD),
precum şi dimensiunea documentului. Acestea îi cresc încrederea
vizitatorului.
Linkurile intra-pagină îi conferă mai multă încredere vizitatorului decât
cele inter-pagină.
Link-urile de tip ancoră trebuie să fie prezentate în aşa fel încât să
sugereze că ele conduc la o zonă mai jos pe pagina (de exemplu, săgeata
în jos). (10)
3.7.6. Legături (link-uri) explicite
Un link trebuie să declare cât mai precis posibil ceea ce subliniază
această (atenţie la sindromul click aici), de exemplu vom folosi „Vezi
fotografii” în locul „Pentru poze click aici”.
Link-urile de tipul: „Citeşte mai mult”, „a se vedea articolul”, „Detalii”,
încarcă inutil pagina.
Trebuie să se ţină cont de limbajul Web şi de limbajul utilizatorilor.
Link-uri coerente: link-urile către acelaşi loc trebuie să aibă aceeaşi
etichetă. (10)
3.8. Template-uri simple şi eficiente
3.8.1. Elementele template-ului adaptate sarcinii
Elementele utilizate în template trebuie să se potrivească tipului de date
pe care utilizatorii le cer de exemplu: caseta radio cu mai multe opţiuni,
ascunde, bandă derulantă ... (11)
Dimensiunea câmpului trebuie să fie adaptată la numărul de caractere
aşteptat.
11
3.8.2. Formulare uşor de completat
Reglarea vizibilitatea de campuri în funcţie de importanţa lor.
Pentru a evidenţia un câmp de intrare, aceasta trebuie să fie de culoare
albă pe un fond colorat, şi gol. Un câmp gol este mai vizibil decât unul
prea plin.
Indicarea de la început a unei legende în care să se specifice importanţa
unor domenii.
Ştergerea":" de la sfârşitul etichetei.
Dacă formularul conţine multe domenii, acestea trebuiesc grupate pe
teme.
Alinierea etichetelor în partea stânga, în cazul în care etichetele nu
depăşesc 6-8 caractere. În caz contrar, aliniat dreapta.
În cadrul constrângerilor de aliniere, distanţa dintre etichetă şi câmp nu
trebuie să fie prea mare. (11)
3.8.3. Ajuta utilizatorul să evite şi să corecteze greşelile
Indica formatul de informaţii de aşteptat în cazul în care aceasta ar
genera erori (de exemplu, zz / ll / aaaa).
Ajutarea internautului să completeze formularul prin oferirea unor
indicaţii.
Salvarea datelor pe parcursul completării, pentru a se evita reluarea
scrierii tuturor datelor în cazul unei greşeli.
Nu ştergeţi informaţiile greşite pentru a facilita munca de corecţie.
Mai presus de toate, trebuiesc păstrate intrările valide. (11)
3.8.4. Semnalarea erorilor
Mesajul ce anunţă eroarea trebuie să apară deasupra formularului.
Trebuie să atragă atenţia prin formă culoare şi sunet şi să indice
greşeala/eroarea.
Atragerea atenţie poate fi sporită şi prin schimbarea culorii de fundal sau
prin introducerea unor pictograme de pericol.
Mesajele trebuie să explice de eroarea şi să ofere soluţii de rezolvare.
(11)
3.9. Meniul – navigarea fără a pierde Nordul
Se recomandă utilizarea funcţiei „Pagina precedentă”. Este foarte utilă
punerea elementelor care îndeplinesc această funcţie în calea mouse-ului
atunci când merge la bara de instrumente a browser-ului, deoarece acest lucru
va creşte probabilitatea lor de utilizare. (12)
12
3.9.1. Arhitectura uni meniu
Există multe moduri de a organiza conţinutul unui site web şi inclusiv a
meniului său:
Organizare tematică
Organizarea pe activităţi
Organizarea în funcţie de ţinta utilizatorului
Organizare în ordine alfabetică
Organizarea cronologică
Organizare bazată pe popularitatea paginilor (12)
În construirea arhitecturii website-ului trebuie să ne folosim de
principiul lăţime în profunzime, adică puţine niveluri cu multe opţiuni.
Aceasta are ca avantaj o privire de ansamblu rapidă. Utilizatorul poate selecta
cu uşurinţă elementul de interes la fiecare nivel. (12)
Termenii ce definesc obiectele ce apartin aceluiaşi nivel al unui meniu
trebuie să fie:
Semnificanţi (am inteles termenii pe care le acoperă)
complementari (toate elementele acoperă toate posibilităţile de
navigare)
exclusivi (nici o ambiguitate între elemente). (12)
Elementele din mijloc sunt mai puţin vizibile decât cele de la începutul
sau la sfârşitul meniului, mai ales într-un drop jos vertical. Se evită
elementelor generice într-un meniu. Se oferă un mijloc explicit pentru a
reveni la prima pagina. (12)
3.9.2. Prezentarea unui meniu
Meniul de navigare ar trebui să iasă în evidenţă faţă de restul paginii
(nota, fără a deveni un "site-off").
Meniurile sunt de obicei plasate pe "marginile" site-ului. Navigarea
principală este adesea plasată în partea de sus sau din stânga, locaţia este
mai puţin convenţională.
Nu schimba locaţia sau aparenţa unei navigări de la o pagină la alta.
Vizitatorul trebuie să ştie în permanenţă unde se află în interiorul
website-ului.
Nu se subliniază link-urile într-un meniu în cazul în care numărul de
articole este mare, deoarece apropierea de elementele asociate cu textul
subliniat generează prea mult „zgomot” vizual. Este suficient doar
formatul tip meniu pentru evidenţiere. (12)
13
3.9.3. Funcţionarea unui meniu
Utilizarea meniurilur derulante care apar la folosirea mouse-ului, dacă
utilizatorii trebuie să găsească rapid pagina care îi interesează.
Evitarea meniurilot de tip cascadă (mai multe niveluri succesive) listă de
operare.
Nu trebuie să i se ceară utilizatorului să manipuleze mouse-ul pentru a
ajunge la verticală şi orizontală pentru un element dintr-un submeniu.
Nu se schimbă ordinea rubricilor meniului în funcţie de pagina accesată
de către utilizator.
Evitarea plasării într-un meniu de navigare a unui link către un site
extern care conţine de asemenea rubrici interne. (12)
3.9.4. Butoane de acţionare
Butoanele ar trebui să apară şi să se comporte identic în interiorul site-
ului.
Butoanele de acţiune trebuie să fie vizibile: într-un format clar şi detaşat
de fundal deasupra benzii de scroll dacă este posibil.
Trebuie prevăzut un format specific de butoane la trecerea cu mouse-ul.
Un buton de acţiune ar trebui să sugereze să faceţi clic pe el: ar trebui să
arate "acţiune". Să aibă un format clickabil şi un text consolidat va fi
regizat de acţiune (verb la infinitiv sau imperativ).
Butoanele trebuie să fie uşor de clickabil, să fie destul de mare, iar
suprafaţa clickabilă să fie extinsă dincolo de textul etichetei.
Limbajul butoanelor de acţiune trebuie să fie alcătuit din verbe, trebuie
să se evite etichetele, iar aceeaşi acţiune trebuie să aibă întotdeauna
aceeaşi formulare, aceeaşi etichetă..
Evitarea butoanelor alcătuite doar din imagini, cu excepţia cazului în
care este extrem de convenţională şi dacă aveţi nevoie de spaţiu pe ecran.
(12)
3.10. Organizarea listelor şi a tabelelor
Evidenţierea datelor în locul tipurilor de date.
Afişarea doar a coloanelelor care conţin informaţiile necesare
utilizatorilor în etapa paginii de listare. Detaliile vor apărea pe o pagină
nouă, odată ce aţi selectat un element.
În mod ideal, se plasează elementele de acţiune cât mai aproape posibil
de elementele la care se referă.
Pentru a facilita conectarea mentală, trebuie să se prevadă o schimbare a
culorii liniei peste care trece mouse-ul.
Poate fi utilă prevederea unei funcţii "Totul pe aceeaşi pagină" dacă
numărul de elemente din listă nu depăşeşte o sută.
În lista extinsă, se afişează clar pagina accesată la momentul respectiv
printr-un format specific, iar celelalte pagini ca link-uri. (13)
14
Nu se aliniază datele centrat:
• textul aliniat la stânga - pentru a da o impresie de coerenţă şi uşurinţă
la citirea verticală.
• cifrele aliniate la dreapta - pentru a sprijini activitatea de comparaţie
mintale. (13)
3.11. Feedback: Mesajele de informare pentru vizitatorii website-ului
Este imperios necesară furnizarea de feedback pentru orice acţiune a
utilizatorului.
Reglarea vizibilităţii paginilor de informare în funcţie de importanţa
lor. Pentru a mări vizibilitatea unui mesaj, poţi să „te joci” cu mai multi
parametri:
Folosiţi culori (pentru fundal şi / sau pentru caractere) care se rup de cele
utilizate în pagina.
Însoţiţi mesajul de imagini.
Modificarea dimensiunii casetei mesajului: cu cât va acoperi mai mult
ecranul cu atât va fi mai vizibil.
Animarea mesajului sau conferirea uniu aspect temporar pentru a atrage
atenţia utilizatorilor. (14)
Mesajele confirmă cererile vizitatorilor acţiunile distructive (ştergerea
contului, non-înregistrare de date, etc). Mesajele importante se scriu cu roşu.
Se oferă asistenţă exact acolo unde are nevoie utilizatorul. În cazul în
care timpul de încărcare este relativ lung de aşteptat, se avertizează
utilizatorul şi i se oferă o indicaţie a progresului de încărcare. (14)
Personalizarea paginii 404:
Evitaţi discurs tehnic, astfel încât utilizatorul să înţeleagă ceea ce se
întâmplă.
Oferiţi oportunităţi pentru navigare pentru a evita transformarea acesteia
într-o pagină moatră. (14)
4. Concluzii
5. Bibliografie
1. ***http://ro.wikipedia.org/wiki/Comunicare.
2. ***http://ro.wikipedia.org/wiki/Internet.
3. ***http://ro.wikipedia.org/wiki/Pagin%C4%83_web.
4. ***http://ro.wikipedia.org/wiki/Web_design.
5. ***http://ro.wikipedia.org/wiki/Sit_web.
6. ***http://www.commentcamarche.net/contents/web/webintro.php3.
7. ***http://www.creation-site-vitrine.fr/ergonomie-definition.
8. ***http://www.creation-site-vitrine.fr/ergonomie-page.
9. ***http://www.creation-site-vitrine.fr/ergonomie-texte.
10. ***http://www.creation-site-vitrine.fr/ergonomie-liens.
11. ***http://www.creation-site-vitrine.fr/ergonomie-formulaire.
12. ***http://www.creation-site-vitrine.fr/ergonomie-menus.
13. ***http://www.creation-site-vitrine.fr/ergonomie-listes-tableaux.
14. ***http://www.creation-site-vitrine.fr/ergonomie-feedback.
16
Cuprins
1. Introducere ..................................................................................................................... 2
2. Pagina web ..................................................................................................................... 3
3. Website-ul şi ergonomia................................................................................................. 4
3.1. Website-ul – definire .............................................................................................. 5
3.2. Obiectivele unui website ......................................................................................... 6
3.3. Etapele de creare a unui site ................................................................................... 6
3.4. Definirea conceptului de website ergonomic .......................................................... 7
3.5. Organizarea corespunzătoare a paginilor web ........................................................ 7
3.6. Textele lizibile şi clare ............................................................................................ 8
3.6.1. Tipografia şi culorile ....................................................................................... 8
3.6.2. Managementul paragrafelor şi liniilor de text ................................................. 9
3.6.3. Scrisul pe web trebuie să faciliteze scanarea ................................................... 9
3.6.4. Titlurile şi etichetarea .................................................................................... 10
3.7. Hipertextele –cheia unei navigări reuşite .............................................................. 10
3.7.1. Link sau buton ............................................................................................... 10
3.7.2. Link-uri vizibile şi folosite cu înţelepciune ................................................... 10
3.7.3. Nu este obligatoriu albastrul subliniat ........................................................... 10
3.7.4. Formatul şi dimensionarea link-ului .............................................................. 10
3.7.5. Distingerea diferitelor tipuri de link-uri ........................................................ 11
3.7.6. Legături (link-uri) explicite ........................................................................... 11
3.8. Template-uri simple şi eficiente ........................................................................... 11
3.8.1. Elementele template-ului adaptate sarcinii .................................................... 11
3.8.2. Formulare uşor de completat ......................................................................... 12
3.8.3. Ajuta utilizatorul să evite şi să corecteze greşelile ........................................ 12
3.8.4. Semnalarea erorilor........................................................................................ 12
3.9. Meniul – navigarea fără a pierde Nordul .............................................................. 12
3.9.1. Arhitectura uni meniu .................................................................................... 13
3.9.2. Prezentarea unui meniu ................................................................................. 13
3.9.3. Funcţionarea unui meniu ............................................................................... 14
3.9.4. Butoane de acţionare ..................................................................................... 14
3.10. Organizarea listelor şi a tabelelor ......................................................................... 14
3.11. Feedback: Mesajele de informare pentru vizitatorii website-ului......................... 15
4. Concluzii ...................................................................................................................... 15
5. Bibliografie................................................................................................................... 16
17