Greșeli pe care cel mai probabil le-ați făcut deja în calitate de web designer

Publicat: 2016-06-07

Toți designerii web își doresc perfecțiunea. Cu toate acestea, sunt doar oameni și pot apărea întotdeauna greșeli. Este atât de ușor să treci cu vederea câteva detalii. Nu există designer în lume care să nu fi făcut greșeli și evitarea lor este ceva ce se întâmplă în mod normal după ceva timp.

Vom vorbi acum despre unele dintre cele mai comune dintre greșelile pe care web designerii le fac în mod constant, cele pe care cel mai probabil le-ați făcut deja măcar o dată. Corectează-ți obiceiurile proaste și depășește obstacolele de care ești vinovată în prezent, astfel încât munca ta să fie mai bună ca niciodată.

Utilizarea Flash-ului

În designul modern al site-urilor web, vedem rar folosit Flash, chiar dacă este destul de uimitor la ceea ce poate face. Ne confruntăm cu posibilitatea de a oferi vizitatorului o experiență animată care este impresionantă, dar există un bagaj asociat.

Există diferite probleme care apar cu utilizarea Flash în design web. Ai un timp de încărcare mai lung, probleme cu utilizatorii de telefonie mobilă din cauza lipsei de suport și a limbajului de programare diferit folosit. Numărul de dispozitive care acceptă în prezent Flash este foarte scăzut. De asemenea, în viitor nu ne așteptăm la un sprijin sporit. Bibliotecile noi apar mai puternice și mai populare, în special cele care se bazează pe JavaScript, cum ar fi AngularJS și jQuary.

Folosind imagini cu adevărat mari

Tendința modernă în design web este de a folosi imagini mari pe tot site-ul. Acest lucru va face cu siguranță experiența mai plăcută și utilizatorul va avea ceva grozav la care să se uite, dar există unele complicații de care designerul și dezvoltatorul trebuie să fie conștienți.

Încărcarea paginii crește automat ori de câte ori sunt utilizate imagini mai mari. Acest lucru poate duce la un scenariu foarte rău pentru vizitatorul site-ului. Vestea bună este că avem acces la diverse instrumente diferite care ajută foarte mult la optimizarea imaginilor. Cele pe care poate doriți să le luați în considerare includ:

  • GruntJS-ImageMin
  • ImageOptim

Aplicațiile precum PrePros pot ajuta la optimizarea automată a imaginilor în timpul aplicațiilor. Problema este că instrumentele vor ajuta fluxurile de lucru, dar nu vor rezolva problema uriașă asociată cu timpul de încărcare, cel puțin nu complet.

Mulți designeri folosesc acum SVG. Ei folosesc coduri pentru a anima și a desena elemente grafice într-un mediu de browser. Ajungem astfel cu o încărcare accelerată a paginii și diverse elemente care atrag atenția.

De asemenea, ar trebui să subliniem faptul că imaginile mai mari vor complica designul web din cauza factorului non-responsive. Vorbim despre un element de design care are setate înălțimea și lățimea. Browserele vor scala imaginile, dar avem aceeași dimensiune a fișierului.

W3C lucrează acum la utilizarea „ <picture> ” ca element HTML5. Acest lucru ar permite apelarea imaginilor de diferite dimensiuni în funcție de lățimea ecranului de vizualizare. Când se întâmplă acest lucru, experiența ar fi mult mai bună pentru spectator, dar până la implementare, ar trebui să evitați imaginile mai mari.

Utilizarea lățimii și înălțimii fixe

Adaptarea este restrânsă automat pentru utilizatori atunci când dimensiunile fixe sunt codificate. Avem soluții, dar trebuie să ne gândim mereu la crearea unui model de design web care să fie 100% receptiv. Înălțimea fixă ​​care este setată în CSS poate limita zona vizibilă pentru utilizator. Trecerea peste aceasta este posibilă prin ajustări de interogare media, dar codul suplimentar care este adăugat va duce la probleme de performanță. Nu prea ai nevoie de asta. În cele mai multe cazuri, nu ar trebui să utilizați dimensiuni fixe. Acestea trebuie evitate pe cât posibil în mediul modern de web design.

Facerea de ipoteze despre potrivirile de design

Designerii web lucrează în mod normal cu software precum Adobe Photoshop sau Sketch. Când munca este terminată, presupunerea obișnuită este existența unui punct de întrerupere specific în fluxul de lucru receptiv. Lățimile ecranului care sunt văzute ca standard vor acoperi multe dimensiuni diferite de ecran, dar acoperirea acestora nu este o certitudine. Avem mii de dispozitive mobile care sunt disponibile pe piață. Crearea unui design care să funcționeze pentru orice este foarte dificilă.

Când lucrați pe lățimi specifice, trebuie să planificați și gândirea anticipată devine o abilitate importantă pentru designerul web. Trebuie să vă asigurați că nu sunt făcute presupuneri și că veți lucra de fapt în interiorul browserului după ce munca obișnuită a editorului grafic se va termina.

Folosind prea multe efecte și animații

Puteți vedea această problemă chiar și pe unele dintre cele mai populare site-uri din lume. Atât de multe site-uri web oferă o experiență uluitoare, multe oferind ceva cu adevărat unic și uimitor. Totuși, acest lucru nu înseamnă să adăugați cât mai multe efecte și animații. Este foarte important să combinați principiile designului web cu scopul de a găsi mixul potrivit între funcționalitate și impactul grafic.

Există două mari probleme care sunt asociate cu exagerarea cu animații și efecte:

  • Timpul de încărcare a paginii este crescut
  • Efectele și animația vor fi problematice pentru computerele mai vechi

Hack-urile și animațiile populare în acest moment sunt cele care adaugă elemente de fade in, sus sau jos. Ele pot arăta grozav și vor face site-urile să arate grozav, dar asta nu înseamnă că ar trebui să le folosiți întotdeauna. Vedeți dacă încărcarea generală a paginii ar fi prea mare pentru dispozitivele pe care majoritatea vizitatorilor le vor folosi și nu uitați niciodată de viteza de încărcare a paginii. Acestea sunt foarte importante și trebuie să ofere întotdeauna experiențe grozave vizitatorilor.

Stilarea necorespunzătoare a link-urilor

Aceasta este o greșeală care este mult mai comună decât ceea ce ați putea crede în acest moment. Linkurile trebuie să facă întotdeauna ceea ce fac. Aceasta înseamnă că atunci când un link are un stil nepotrivit, oamenii nu își vor da seama că sunt linkuri. Trebuie să ne gândim mereu la vizitatori, astfel încât linkurile trebuie să arate întotdeauna ca linkuri. Puteți experimenta și nu rămâneți la sublinierea albastră standard, dar nu ar trebui să exagerați niciodată.

Nu se utilizează DRY în CSS

În cazul în care nu știți acest lucru, DRY înseamnă „Nu vă repetați”. Este o metodă în design web și practic înseamnă că designerul este ajutat să păstreze codul concis și să cloneze. Doar utilizarea codului necesar este recomandată în orice moment pentru stilul site-ului.

Când utilizați CSS tradițional, este necesară multă repetare cu elemente specifice care sunt utilizate în interiorul altor elemente. Selectorii ajung să fie foarte mari și vor dura mult timp pentru a scrie efectiv. Când folosiți clase în design în loc să stilați fiecare element din pagina HTML, totul devine mult mai simplu.

O idee foarte bună în acest moment este să utilizați limbaje de preprocesare precum Sass. Sunt destul de utile în ceea ce privește tehnologia CSS necesară. Limbile care sunt folosite vor accelera dezvoltarea și proiectarea datorită faptului că includ caracteristici precum variabile, funcții, mixuri, imbricare și multe altele. Codul care este produs va fi apoi compilat în codul CSS. Dezvoltatorii web și designerii web pot folosi acum mai puține linii de cod și repetarea poate fi evitată cu ușurință datorită limbilor.

Degradare grațioasă

Putem defini Graceful Degradation ca o practică de construire a funcționalităților web capabile să ofere un anumit nivel de experiență utilizator într-un browser modern, în timp ce se degradează la niveluri inferioare de experiență a utilizatorului în browserele mai vechi. Acest lucru sună puțin complex, dar ca exemplu, putem discuta despre suportul pentru Internet Explorer 8 și 7. Ai fi surprins să afli că majoritatea utilizatorilor pur și simplu nu vor actualiza browserele pentru perioade lungi de timp. Din acest motiv, trebuie să adăugați o degradare grațioasă, astfel încât să existe suport adecvat pentru ambele versiuni de browser.

Site-urile web moderne sunt ușor de dezvoltat, dar într-un moment ulterior în timp puteți ajunge să observați faptul că într-un browser mai vechi, paginile arată foarte rău din cauza dependențelor specifice.

Îmbunătățire progresivă

Acesta este ceva similar cu degradarea grațioasă menționată mai sus. Diferența este că procesul este gestionat invers, începând cu nivelul de experiență de bază care este acceptat în fiecare browser web. Apoi, designerul/dezvoltatorul adaugă o funcționalitate sporită care este disponibilă pentru browserele care l-ar putea folosi.

Atât această opțiune, cât și cea de mai sus sunt complicate. În mod normal, sunt folosite doar de designeri cu adevărat buni. Cu toate acestea, cu multe browsere care sunt disponibile acum, trebuie să luăm în considerare cu seriozitate opțiunile. În mod normal, designerii web vor cere clienților să decidă exact ce va fi susținut. Trebuie să încercați totuși să utilizați aceste abordări pentru a oferi o experiență cu adevărat grozavă pentru utilizatorii care sunt deosebit de activi și chiar în interiorul publicului țintă.

Probleme de navigare – Nu este ușor de utilizat

Una dintre cele mai importante părți ale oricărui site web este navigarea. Designerul trebuie să fie capabil să facă experiența vizitatorului naturală. Scopul este de a face navigarea cu adevărat simplă și intuitivă. Un utilizator va înțelege automat că experiența este una adecvată atunci când designul a luat în considerare acest element.

Ori de câte ori experiența utilizatorului este slabă, vedem vizitatorii frustrați. Pur și simplu nu vizitează din nou un anumit site și se vor uita pe alte pagini pentru soluții la problemele lor. Utilizabilitatea trebuie să fie întotdeauna luată în considerare de către designer. Designul trebuie să arate grozav, dar nu trebuie să uitați niciodată de funcționalitate. Este nevoie de ușurință în utilizare și lipsa acesteia ar face întregul design inutil.

O lipsă de concentrare asupra conținutului

„Form Follows Function” este un principiu de arhitectură cu adevărat comun care a apărut în secolul XX, chiar în faza de design industrial al arhitecturii moderne. Acesta este un principiu pe care trebuie să-l rețineți în orice moment în design web.

Web și designul grafic sunt într-adevăr similare cu arhitectura modernă în ceea ce privește funcționalitatea necesară. Forma obiectului trebuie să se bazeze mai întâi pe scopul sau funcția dorită. În ceea ce privește site-urile web, le putem vedea ca baze de date de informații care sunt răspândite pe tot internetul. Utilizatorul va vizita un site web pentru a obține date specifice. Aici intervine conținutul pentru a oferi acele date. Pe măsură ce vizitatorul ajunge pe un site și nu găsește datele, le va căuta în altă parte, fără să se uite măcar la design. În același timp, în cazul în care designul face foarte dificilă localizarea sau digerarea datelor, se întâmplă același rezultat.

Utilizatorii de internet doresc acum acces la informații și doresc ca acest acces să fie rapid. Form Over Function ajunge să fie cu adevărat important în design web. Nea lua în considerare acest principiu înseamnă că se pune accent pe aspect în loc de conținutul oferit. Drept urmare, site-urile web nu vor fi cu adevărat populare. Conținutul trebuie să iasă în evidență în orice moment.

Concluzii

La rădăcinile lor, cele mai frecvente greșeli de design web sunt legate de încercarea de a veni cu ceva cu adevărat frumos și unic fără a ține cont de motivul pentru care vizitatorii merg efectiv pe un site. Din acest motiv, doriți să aveți întotdeauna răbdarea necesară pentru a combina un design cu adevărat bun cu funcționalitatea completă.

Creați întotdeauna site-uri web funcționale și continuați să învățați noi tehnologii pe măsură ce trece timpul. Cei mai buni designeri web din lume continuă să învețe și rămân mereu la curent cu tot ce se poate și nu se poate face. Doriți să vă creați designul web, să discutați cu clientul și apoi să vă asigurați că vizitatorii vor aprecia ceea ce este oferit. Acest lucru este mult mai ușor de spus decât de făcut, dar în timp, totul devine mult mai ușor.

Asigurați-vă că vă ocupați întotdeauna atât de mult timp cât este necesar pentru a crea ceva cu adevărat grozav. O altă greșeală nemenționată în designul web este să nu vă acordați timpul necesar pentru a crea cu adevărat acel design perfect pentru site-ul web. Acest lucru se întâmplă în mod normal, deoarece clienții au nevoie de muncă în cel mai scurt timp. Asigurați-vă că aveți întotdeauna suficient timp pentru a crea acel design web stelar pe care știți că puteți.