Sumar articol web design: Utilizarea și utilitatea, nu designul vizual, determină succesul sau eșecul unui site web. Deoarece vizitatorul paginii este singura persoană care face clic pe mouse și deci decide totul, designul centrat pe utilizator s-a stabilit ca o abordare standard pentru proiectarea web de succes și orientată spre profit. La urma urmei, dacă utilizatorii nu pot utiliza o caracteristică, ar putea să nu existe.

Nu vom discuta detaliile de implementare a proiectării (de exemplu, unde ar trebui să fie plasată caseta de căutare), așa cum am facut deja în mai multe articole; în schimb, ne concentrăm pe principalele principii, euristică și abordări pentru un design web eficient – abordări care, utilizate corect, pot duce la decizii de proiectare mai sofisticate și simplifica procesul de percepere a informațiilor prezentate.

Principiile unei bune concepții de site-uri web și ghiduri eficiente de proiectare a paginilor web

Pentru a utiliza principiile în mod corespunzător, trebuie mai întâi să înțelegem modul în care utilizatorii interacționează cu site-urile web, cum gândesc și care sunt tiparele de bază ale comportamentului utilizatorilor.

Cum gândesc utilizatorii?

hotjar track web design user experience

hotjar track web design user experience

Practic, obiceiurile utilizatorilor de pe web nu sunt atât de diferite de obiceiurile clienților dintr-un magazin. Vizitatorii se uită la fiecare pagină nouă, scanează o parte din text și fac clic pe primul link care le atrage interesul sau care seamănă vag cu ceea ce caută. De fapt, există părți mari ale paginii pe care nici măcar nu le privesc.

Majoritatea utilizatorilor caută ceva interesant (sau util) și pe care poate face clic; de îndată ce sunt găsiți câțiva candidați promițători, utilizatorii fac clic. Dacă noua pagină nu corespunde așteptărilor utilizatorilor, se face clic pe butonul Înapoi și se continuă procesul de căutare.

    1. Utilizatorii apreciază calitatea și credibilitatea. Dacă o pagină oferă utilizatorilor conținut de înaltă calitate, ei sunt dispuși să compromită conținutul cu reclame și designul site-ului. Acesta este motivul pentru care site-urile web nu atât de bine concepute, cu conținut de înaltă calitate, câștigă mult trafic de-a lungul anilor. Conținutul este mai important decât designul care îl susține.
    2. Utilizatorii nu citesc, scanează. Analizând o pagină web, utilizatorii caută câteva puncte fixe sau ancore care să-i ghideze prin conținutul paginii.
    3. Utilizatorii își urmează intuiția. În majoritatea cazurilor, utilizatorii se amestecă în loc să citească informațiile furnizate de un designer. Potrivit lui Steve Krug, motivul de bază al acestui fapt este că utilizatorilor nu le pasă. „Dacă găsim ceva care funcționează, ne ținem de el. Nu contează pentru noi dacă înțelegem cum funcționează lucrurile, atât timp cât le putem folosi. Dacă publicul dvs. va acționa ca și cum ați proiecta panoul publicitar, atunci proiectați panouri publicitare grozave. ”
    4. Utilizatorii vor să dețină controlul. Utilizatorii doresc să își poată controla browserul și să se bazeze pe prezentarea consecventă a datelor pe tot site-ul. De exemplu. nu vor ca ferestrele noi să apară în mod neașteptat și doresc să poată reveni cu un buton „Înapoi” la site-ul pe care l-au fost înainte: prin urmare, este o practică bună să nu deschideți niciodată linkuri în ferestrele noi ale browserului.
  • Nu-i face pe utilizatori să se gândească

Conform primei legi de utilizare a lui Krug, pagina web ar trebui să fie evidentă și să se explice de la sine. Când creați un site, sarcina dvs. este să scăpați de semnele de întrebare – deciziile pe care utilizatorii trebuie să le ia în mod conștient, luând în considerare argumentele pro, contra și alternativele.

Dacă navigarea și arhitectura site-ului nu sunt intuitive, numărul semnelor de întrebare crește și face mai greu pentru utilizatori să înțeleagă modul în care funcționează sistemul și cum să ajungă de la punctul A la punctul B. O structură clară, indicii vizuale moderate și ușor de recunoscut linkurile pot ajuta utilizatorii să-și găsească drumul către scopul lor.

Să aruncăm o privire la un exemplu. Unii analisti susțin că este „dincolo de canale, dincolo de produse, dincolo de distribuție”. Ce înseamnă? Întrucât utilizatorii au tendința de a explora site-uri web în conformitate cu modelul „F”, aceste trei afirmații ar fi primele elemente pe care utilizatorii le vor vedea pe pagină odată încărcată.

Deși designul în sine este simplu și intuitiv, pentru a înțelege despre ce este pagina, utilizatorul trebuie să caute răspunsul. Iată ce este un semn de întrebare inutil. Sarcina proiectantului este de a vă asigura că numărul semnelor de întrebare este aproape de 0.

ExpressionEngine folosește aceeași structură ca Beyondis, dar evită semne de întrebare inutile. În plus, sloganul devine funcțional pe măsură ce utilizatorilor li se oferă opțiuni pentru a încerca serviciul și a descărca versiunea gratuită.

Reducând încărcătura cognitivă, faceți mai ușor vizitatorii să înțeleagă ideea din spatele sistemului. După ce ați realizat acest lucru, puteți comunica de ce sistemul este util și modul în care utilizatorii pot beneficia de acesta. Oamenii nu vor folosi site-ul dvs. web dacă nu își găsesc utilitatea în jurul acestuia.

  • Nu pune la incercare rabdarea utilizatorului

design web simplu pentru inscriere

form cu design web simplu pentru inscriere

În fiecare proiect în care veți oferi vizitatorilor un serviciu sau un instrument, încercați să păstrați cerințele utilizatorului la nivel minim. Cu cât este nevoie de mai puține acțiuni din partea utilizatorilor pentru a testa un serviciu, cu atât este mai probabil ca un vizitator aleatoriu să îl încerce efectiv. Vizitatorii pentru prima dată sunt dispuși să se joace cu serviciul, nu completează formulare web lungi pentru un cont pe care s-ar putea să nu-l folosească în viitor. Permiteți utilizatorilor să exploreze site-ul și să vă descopere serviciile fără a le forța să partajeze date private. Nu este rezonabil să forțezi utilizatorii să introducă o adresă de e-mail pentru a testa funcția.

După cum afirmă Ryan Singer – dezvoltatorul echipei 37Signals -, utilizatorii ar fi probabil dornici să furnizeze o adresă de e-mail dacă li s-ar cere după ce vor vedea funcționarea funcțională, așa incat sa aiba idee despre ce aveau să obțină în schimb.

Stikkit este un exemplu perfect pentru un serviciu ușor de utilizat, care nu necesită aproape nimic de la vizitator, care să fie discret și reconfortant. Și asta doriți să simtă utilizatorii dvs. pe site-ul dvs. web.

Aparent, Mite necesită mai mult. Cu toate acestea, înregistrarea se poate face în mai puțin de 30 de secunde – deoarece formularul are orientare orizontală, utilizatorul nici măcar nu trebuie să deruleze pagina.

În mod ideal, eliminați toate barierele, nu solicitați mai întâi abonamente sau înregistrări. Numai o înregistrare a utilizatorului este un impediment suficient pentru navigarea utilizatorului si pentru a reduce traficul de intrare.

  • Administrati inteligent focusul utilizatorului

Deoarece site-urile web oferă atât conținut static, cât și dinamic, unele aspecte ale interfeței cu utilizatorul atrag atenția mai mult decât alții. Evident, imaginile sunt mai atrăgătoare decât textul – la fel cum propozițiile marcate cu caractere aldine sunt mai atractive decât textul simplu.

Ochiul uman este un dispozitiv extrem de neliniar, iar utilizatorii web pot recunoaște instantaneu marginile, modelele și mișcările. Acesta este motivul pentru care reclamele video sunt extrem de enervante și distrag atenția, dar din perspectiva marketingului fac perfect treaba de a atrage atenția utilizatorilor.

Umanizat folosește perfect principiul focalizării. Singurul element care este vizibil direct utilizatorilor este cuvântul „gratuit” care funcționează atractiv și atrăgător, dar totuși calm și pur informativ. Indiciile subtile oferă utilizatorilor suficiente informații despre cum să afle mai multe despre produsul „gratuit”.

Concentrarea atenției utilizatorilor asupra anumitor zone ale site-ului cu o utilizare moderată a elementelor vizuale vă poate ajuta vizitatorii să ajungă de la punctul A la punctul B fără să vă gândiți la modul în care ar trebui să fie realizat. Cu cât vizitatorii au mai puține semne de întrebare, cu atât au un sentiment mai bun de orientare și cu atât mai multă încredere pot dezvolta față de compania pe care o reprezintă site-ul. Cu alte cuvinte: cu cât trebuie să se întâmple mai puțin gândirea în culise, cu atât este mai bună experiența utilizatorului, care este în primul rând scopul utilizării.

  • Străduiți-vă pentru expunerea caracteristicilor

Design-urile web moderne sunt de obicei criticate datorită abordării lor de a ghida utilizatorii cu pași atrăgători din punct de vedere vizual 1-2-3, butoane mari cu efecte vizuale etc. Dar, din perspectiva designului, aceste elemente nu sunt de fapt un lucru rău. Dimpotrivă, astfel de linii directoare sunt extrem de eficiente, deoarece conduc vizitatorii prin conținutul site-ului într-un mod foarte simplu și ușor de utilizat.

Dibusoft combină atracția vizuală cu structura clară a site-ului. Site-ul are 9 opțiuni principale de navigare, care sunt vizibile la prima vedere. Alegerea culorilor ar putea fi însă prea deschisă.

Lăsați utilizatorul să vadă clar ce funcții sunt disponibile este un principiu fundamental al designului de interfață cu succes al utilizatorului. Nu contează cu adevărat cum se realizează acest lucru. Ceea ce contează este că conținutul este bine înțeles și vizitatorii se simt confortabil cu modul în care interacționează cu sistemul.

  • Folosiți o scriere eficientă

Deoarece Web-ul diferă de tipărire, este necesar să ajustați stilul de scriere la preferințele și obiceiurile de navigare ale utilizatorilor. Scrierea promoțională nu va fi citită. Blocurile de text lungi fără imagini și cuvinte cheie marcate cu caractere aldine sau cursive vor fi omise. Limbajul exagerat va fi ignorat.

Vorbeste despre afaceri. Evitați numele drăguțe sau inteligente, numele induse de marketing, numele specifice companiei și numele tehnice necunoscute. De exemplu, dacă descrieți un serviciu și doriți ca utilizatorii să își creeze un cont, „înscrieți-vă” este mai bine decât „începeți acum!” ceea ce este din nou mai bun decât „explorați serviciile noastre”.

Eleven2.com ajunge direct la subiect. Fără cuvinte drăguțe, fără afirmații exagerate. În schimb, un preț: exact ceea ce caută vizitatorii.

O soluție optimă pentru o scriere eficientă este să
  • utilizați fraze scurte și concise (ajungeți la subiect cât mai repede posibil),
  • utilizați aspect scanabil (clasificați conținutul, utilizați mai multe niveluri de titlu, utilizați elemente vizuale și liste cu marcatori care rup fluxul de blocuri de text uniforme),
  • utilizați un limbaj simplu și obiectiv (o promoție nu trebuie să sune ca o reclamă; oferiți utilizatorilor un motiv rezonabil și obiectiv pentru care ar trebui să vă utilizeze serviciul sau să rămână pe site-ul dvs.)
  • Străduiți-vă cat puteti de mult pentru a mentine lucrurile simple

web design simplu si intuitiv

web design simplu si intuitiv

Principiul „păstrați-l simplu” (KIS) ar trebui să fie obiectivul principal al proiectării site-ului. Utilizatorii sunt rareori pe un site pentru a se bucura de design; în plus, în majoritatea cazurilor, ei caută informații în ciuda designului. Luptați pentru simplitate în loc de complexitate.

Din punctul de vedere al vizitatorilor, cel mai bun design al site-ului este un text pur, fără reclame sau alte blocuri de conținut care să se potrivească exact cu interogarea utilizată de vizitatori sau conținutul pe care l-au căutat. Acesta este unul dintre motivele pentru care o versiune tipărită ușor de utilizat a paginilor web este esențială pentru o bună experiență a utilizatorului.

Finch prezintă în mod clar informațiile despre site și oferă vizitatorilor o gamă de opțiuni fără a le aglomera cu conținut inutil.

  • Nu vă fie frică de spațiul alb

spatiile albe comparatie pentru design web

spatiile albe comparatie pentru design web

De fapt, este foarte greu să supraestimezi importanța spațiului alb. Nu numai că ajută la reducerea încărcării cognitive pentru vizitatori, dar face posibilă percepția informațiilor prezentate pe ecran. Când un vizitator nou abordează un aspect de proiectare, primul lucru pe care încearcă să-l facă este să scaneze pagina și să împartă zona de conținut în informații digestibile.

Structurile complexe sunt mai greu de citit, scanat, analizat și lucrat. Dacă aveți de ales între a separa două segmente de proiectare printr-o linie vizibilă sau de un spațiu alb, de obicei este mai bine să utilizați soluția spațiu alb. Structurile ierarhice reduc complexitatea (Legea lui Simon): cu cât reușiți să oferiți utilizatorilor un sentiment de ierarhie vizuală, cu atât conținutul dvs. va fi mai ușor de perceput.

Spațiul alb este bun. Cameron.io folosește spațiul alb ca element principal de proiectare. Rezultatul este un aspect bine scanabil, care oferă conținutului o poziție dominantă pe care o merită.

  • Comunicați eficient cu un „limbaj vizibil”

În lucrările sale despre comunicarea vizuală eficientă, Aaron Marcus afirmă trei principii fundamentale implicate în utilizarea așa-numitului „limbaj vizibil” – conținutul pe care îl văd utilizatorii pe un ecran.

Organizați: oferiți utilizatorului o structură conceptuală clară și consecventă. Coerența, aspectul ecranului, relațiile și navigabilitatea sunt concepte importante de organizare. Aceleași convenții și reguli ar trebui aplicate tuturor elementelor.
Economisiți: faceți cel mai mult cu cea mai mică cantitate de indicii și elemente vizuale. Patru puncte majore care trebuie luate în considerare: simplitatea, claritatea, caracterul distinctiv și accentul. Simplitatea include doar elementele care sunt cele mai importante pentru comunicare. Claritate: toate componentele ar trebui proiectate astfel încât semnificația lor să nu fie ambiguă. Caracterul distinctiv: proprietățile importante ale elementelor necesare ar trebui să se distingă. Accent: cele mai importante elemente trebuie percepute cu ușurință.Comunicare: potriviți prezentarea cu capacitățile utilizatorului. Interfața utilizatorului trebuie să mențină echilibrul lizibilității, lizibilității, tipografiei, simbolismului, vizualizărilor multiple și culorii sau texturii pentru a comunica cu succes. Folosiți max. 3 tipuri de caractere în maximum 3 dimensiuni de puncte – maximum 18 cuvinte sau 50-80 de caractere pe fiecare rând de text.

  • Convențiile sunt prietenii noștri

Proiectarea convențională a elementelor site-ului nu are ca rezultat un site web plictisitor. De fapt, convențiile sunt foarte utile deoarece reduc curba de învățare, nevoia de a afla cum funcționează lucrurile. De exemplu, ar fi un coșmar de utilizare dacă toate site-urile web ar avea o prezentare vizuală diferită a fluxurilor RSS. Acest lucru nu este atât de diferit de viața noastră obișnuită, unde avem tendința de a ne obișnui cu principiile de bază ale modului în care organizăm date (foldere) sau cum facem cumpărături (plasarea produselor).

Cu convențiile puteți câștiga încrederea, încrederea, fiabilitatea utilizatorilor și vă puteți dovedi credibilitatea. Urmați așteptările utilizatorilor – înțelegeți ce așteptă de la navigarea pe site, structura textului, plasarea în căutare etc.

Un exemplu tipic din sesiunile de utilizare este să traduceți pagina în japoneză (presupunând că utilizatorii dvs. web nu știu japoneză, de exemplu, cu Babelfish) și să oferiți testerilor dvs. de utilizare o sarcină de a găsi ceva în pagina de altă limbă. Dacă convențiile sunt bine aplicate, utilizatorii vor putea atinge un obiectiv nu prea specific, chiar dacă nu pot înțelege niciun cuvânt.

Steve Krug sugerează că este mai bine să inovați numai atunci când știți că aveți cu adevărat o idee mai bună, dar profitați de convenții atunci când nu aveți.

  • Testați devreme, testați des

Acest așa-numit principiu TETO ar trebui să fie aplicat fiecărui proiect de design web deoarece testele de utilizare oferă adesea informații esențiale asupra problemelor și problemelor semnificative legate de un aspect dat.

Testează nu prea târziu, nu prea puțin și nu din motive greșite. În acest din urmă caz, este necesar să înțelegem că majoritatea deciziilor de proiectare sunt locale; asta înseamnă că nu puteți răspunde universal dacă un aspect este mai bun decât celălalt, deoarece trebuie să îl analizați dintr-un punct de vedere foarte specific (luând în considerare cerințele, părțile interesate, bugetul etc.).

  • Câteva puncte importante de reținut:

potrivit lui Steve Krug, testarea unui utilizator este cu 100% mai bună decât testarea unuia și testarea unui utilizator la începutul proiectului este mai bună decât testarea a 50 la sfârșit. În conformitate cu prima lege a lui Boehm, erorile sunt cele mai frecvente în timpul cerințelor și activităților de proiectare și sunt cu atât mai scumpe cu cât sunt eliminate mai târziu. testarea este un proces iterativ. Asta înseamnă că proiectezi ceva, îl testezi, îl repari și apoi îl testezi din nou.

S-ar putea să existe probleme care nu au fost găsite în timpul primei runde, deoarece utilizatorii au fost practic blocați de alte probleme. testele de utilizare produc întotdeauna rezultate utile. Fie veți fi direcționați către problemele pe care le aveți, fie veți fi direcționați spre absența unor defecte majore de proiectare, care este în ambele cazuri o perspectivă utilă pentru proiectul dvs. conform legii Weinberg, un dezvoltator nu este potrivit pentru a-și testa codul.

Acest lucru este valabil și pentru designeri. După ce ați lucrat pe un site timp de câteva săptămâni, nu îl mai puteți observa dintr-o perspectivă nouă. Știți cum este construit și, prin urmare, știți exact cum funcționează – aveți experți independenți, iar vizitatorii site-ului dvs. nu ar avea. In loc de concluzie: dacă doriți un site excelent, trebuie să testați.

Intrebari frecvente legate de web design

Ce inseamna web design?

Web Design reprezinta termenul folosit atunci cand vorbim despre realizarea web site-urilor precum si alte aplicatii web. In Romania termenul de web design este asimilat cu realizarea de pagini web, realizare web, programare web.

Ce inseamna Responsive Web Design?

Web Design responsive este partea de web design care are la baza scopul de a reprezenta intr-o forma optima designul paginilor web pe toate dispozitivele, mobil, tableta, desktop, display, tv sau alte tipuri de redari grafice si tine cont de rezolutia fiecarui dispozitiv pe care se afiseaza.