11 tendințe de design site-uri despre care trebuie să știți

Site-ul web al companiei dvs. este baza pentru tot ceea ce faceți online. Toate activitățile tale pe rețelele sociale, marketingul prin e-mail, postarea invitaților – toate ar trebui să revină pe site-ul tău.

Deoarece site-ul dvs. este atât de esențial pentru succesul dvs. de marketing, este logic să țineți pasul cu tendințele care îl afectează. Vorbim mult despre tendințele de optimizare a motoarelor de căutare și despre cele mai bune practici. Acestea sunt cu siguranță importante, dar și modul în care arată site-ul dvs. pentru vizitatori este important. Cât de ușor este navigarea și utilizarea site-ului dvs. este și mai important.

Cele mai bune practici de proiectare a site-urilor web se schimbă din când în când, iar modul în care oamenii se așteaptă ca site-ul tău să arate și să se comporte, de asemenea, se schimbă. Chiar dacă nu plănuiești o reproiectare chiar acum, este bine să cunoști tendințele actuale. În acest fel, veți putea spune când site-ul dvs. a trecut de la „suficient de bun” la a avea nevoie într-adevăr de o reproiectare.

Aceste 11 tendințe variază de la abordări ample de design la caracteristici de design mai mici. Multe dintre ele se suprapun sau se completează. Nu trebuie – și poate chiar nu ar trebui – să le implementați pe toate, dar este bine să le recunoașteți când le vedeți.

1. Mobil

Aceasta este o tendință de design atât de mare încât afectează toate celelalte tendințe pe care le voi menționa aici. Căutarea pe mobil a depășit acum căutarea pe desktop. Acest lucru are implicații majore nu doar pentru design, ci și pentru conținut și chiar pentru tipurile de software care definesc designul și conținutul.

2. Minimalism

Există multe motive pentru care acest lucru este mai mult decât un mod de design. În primul rând, vizitatorii tăi sunt copleșiți și distrași. Reducerea opțiunilor lor cu un design super-curat le concentrează atenția. Și îi face mai probabil să ia măsuri.

Minimalismul funcționează bine și cu mobil. Ajută interfața să se potrivească mai ușor într-un ecran mic. De asemenea, ar trebui să vă descarce site-ul mai rapid.

Nielsen Norman Group a efectuat recent un sondaj grozav asupra a 112 site-uri web minimaliste. Ei au descoperit că caracteristicile definitorii sunt:

• design plat
• scheme de culori limitate
• câteva elemente ale UI
• utilizarea spațiului negativ
• tipografie dramatică
• layout-uri de grilă

Acest site de mai jos implementează multe dintre aceste elemente minimaliste. De asemenea, rețineți că săgeata din partea stângă – acesta este un element de design care apare pe multe site-uri nou proiectate.

3. Design responsive și conținut adaptiv

Cred că toți am auzit cel puțin de design responsive. Dacă nu sunteți sigur ce este, designul responsive este modul de codificare și aspect al unei pagini web, astfel încât să arate bine pe toate dispozitivele. Dacă site-ul dvs. nu folosește un design responsive până acum, ar trebui să fie.

Dar există și un lucru numit conținut adaptiv. Practic, acest lucru face ca textul și imaginile și alte elemente de conținut să se adapteze la diferite dispozitive. Asta înseamnă de obicei lungimea textului și dimensiunea imaginii, dar există și alte opțiuni.

Cu toții am vorbit și am scris multe despre designul responsive, dar cred că abia începem să creăm conținut adaptiv. Una dintre cele mai mari idei în designul web actual este să nu mai creați mai întâi un design și apoi să faceți conținutul să se potrivească în el. În schimb, iei conținutul pe care îl ai și creezi un design care îl completează.

4. Design plat

Aproape toți ar trebui să știți ce este designul plat. Dacă nu, este timpul să înveți. Iată un exemplu:

Observați cum imaginile, pictogramele și elementele de navigare nu încearcă să arate tridimensional? Și cum nu există umbre și foarte puține gradații de culoare sau gri? Toate acestea sunt semnele distinctive ale designului plat.

Dar asta nu înseamnă că nu poți avea o fotografie. Iată un alt exemplu de site despre care se consideră că are un design plat.

5. Design grilă

Această tendință a fost generată în mare parte de Pinterest, deși o abordare grilă a designului în orice mediu există de zeci de ani. Denumită uneori „Pinteresty” sau „carduri”, abordarea de proiectare a grilei poate fi o modalitate elegantă de a oferi o gamă largă de opțiuni. Este bun pentru paginile cu lista de produse, paginile cu lista de cărți electronice și documentele albe și, adesea, chiar și ca design de pagină de pornire.

Iată cum ne gândim să folosim designul grilei pe pagina principală a blogului Act-On:

6. Imagini de fundal și videoclipuri

Sunt sigur că le-ai văzut. Sunt peste tot... sunt una dintre tendințele de design care îi fac pe unii designeri să spună că toate site-urile încep să semene. Dar acestea ar putea fi atât de omniprezente dintr-un motiv: îi fac pe oameni să arate mai mult decât ar fi putut altfel.

Dacă videoclipul se mișcă în mod corect sau imaginea este decupată exact, poate atrage privirea către o anumită zonă a paginii. Ca la o casetă de înscriere. Vedeți pagina de pornire a PeopleHr ca un exemplu de fundal video care vă atrage viziunea către formularul de înscriere.

Deci, este cel mai bine să folosiți o imagine sau un videoclip, sau o imagine mare și o grămadă de imagini mai mici? De fapt, nu pare să conteze prea mult, cel puțin conform unui test pe care l-a făcut Huge Inc. Au văzut rate de defilare suprimate numai atunci când a fost folosită o imagine animată:

Un lucru de remarcat despre imaginile de fundal... de multe ori folosesc suprapuneri de text cu caractere albe eliminate. În timp ce designerii iubesc tipul „revers” sau „knocked out”, specialiștilor în conversie și oamenilor cu răspuns direct nu le place.

Tipul invers care este mai mult decât un titlu scurt sau un slogan este greu de citit. De asemenea, suprimă prost înțelegerea citirii, așa cum a descoperit un editor australian când a susținut un test.

Acesta este cam atât de mult tip invers pe cât doriți să aveți:

7. Defilare infinită

Acesta este atât de utilizat pe scară largă încât abia mai este o tendință. Este convenția standard de web design. Nu este întotdeauna un lucru bun. Adevărul să fie spus, nu-mi place intens defilarea infinită. Se datorează faptului că pe măsură ce derulez, pagina sare – deci nu văd toate informațiile, văd doar segmente din ele. Când caut ceva pe o pagină care se derulează, trebuie să defilez în sus și în jos, puțin câte puțin, foarte atent. Este nevoie de mult efort pentru a mă asigura că nu am scăpat ceva atunci când scrollul infinit decide să omite.

În sfârșit, nu sunt singur în frustrarea mea. Nielsen Norman Group a publicat recent un articol care rezumă problema:

Defilarea fără sfârșit îi scutește pe oameni de a fi nevoiți să se ocupe de mecanismele de paginare în sarcinile de navigare, dar nu este o alegere bună pentru site-urile web care acceptă sarcini de găsire orientate către obiective.

Defilez ca o sarcină de găsire orientată spre obiective. Defilarea infinită face asta dificil.

8. Conținut interactiv

Am parcurs un drum lung de la „brochureware” de acum un deceniu, dar multe site-uri nu au ajuns atât de departe pe cât au putut.

Există motive de afaceri pentru a adopta conținut interactiv. În primul rând, crește timpul la fața locului. În cazul sondajelor și chestionarelor, vă poate oferi, de asemenea, informații valoroase despre publicul dvs.

Aceasta este o tendință care merită urmărită. Dacă este bine implementat, adăugarea de conținut interactiv vă poate aduce o creștere bună a veniturilor și a altor valori cheie.

Cel mai bun conținut interactiv pentru agenții de marketing B2B ar putea fi calculatoarele și instrumentele de autoevaluare. Acestea sunt ideale pentru etapele târzii ale procesului de cumpărare. Ele pot ajuta clienții potențiali să-și dea seama care serviciu este potrivit pentru ei și chiar le pot oferi o estimare aproximativă a costurilor.

Calculatorul ROI pentru optimizarea site-ului ClickZ este un exemplu minunat de conținut interactiv:

9. Mișcarea

Aceasta este tendința soră către conținutul interactiv. Mișcarea ia o mulțime de forme, cea mai evidentă fiind video. Un alt exemplu ar fi gif-urile animate pe care le vezi pe unele bloguri. În timp ce unele dintre acestea pot fi prea nervoase pentru un blog B2B, este bine să vă întindeți puțin din când în când. Mai ales dacă gif-ul animat aduce un punct acasă într-un mod în care cuvintele – sau chiar o imagine statică – nu ar putea niciodată. Folosește-le doar cu oarecare îndemânare. Vrei un efect la fel de elegant ca un cinemagraph, nu ceva de genul unui semn intermitent de neon pentru magazinul de băuturi alcoolice.

prin GIPHY

sau

prin GIPHY

10. Fotografie și ilustrații personalizate

Există o mulțime de voci în lumea designului care se opun fotografiilor de stoc. Nu sunt sigur că sunt la fel de rele pe cât spun unii, dar cu siguranță există riscuri în folosirea fotografiilor de stoc. În primul rând, alte persoane ar putea folosi aceleași fotografii pe care le-ați făcut dumneavoastră. Și în al doilea rând, fotografiile cu oameni reali s-au dovedit că obțin conversii mai mari. De ce? Pentru că sunt mai credibili.

O idee paralelă cu aceasta sunt ilustrațiile personalizate. Acestea pot face multe pentru ca site-ul dvs. să arate original. Una dintre marile probleme cu multe dintre aceste tendințe de design este că acestea au fost aproape prea larg acceptate. Multe site-uri încep să arate la fel, sau cel puțin ca și cum ar folosi același șablon, doar schimbând text și imagini. Site-urile desenate manual schimbă acest lucru. La fel și fonturile personalizate.

11. Navigare ascunsă

Acesta este un alt rezultat al influenței pe care mobilul o are asupra întregului design web. Aceste meniuri de navigare ascunse arată ca o mică pictogramă până când treceți cu mouse-ul peste ele sau faceți clic pe ele. Apoi apar și își arată conținutul.

Unele site-uri, cum ar fi Act-On, folosesc navigarea ascunsă într-un mod receptiv. Dacă cineva vede site-ul pe un dispozitiv mobil sau are o fereastră îngustă de browser pentru desktop, va vedea navigarea restrânsă:

Dacă fac clic pe cele trei bare, vor vedea navigarea așezată ca și cum ar fi într-o bară laterală:

Dacă fereastra browserului lor este suficient de largă, vor vedea navigarea completă:

Există o altă tendință legată de aceasta: Navigare ancorată. Aceasta se referă la o bară de navigare care vă urmărește pe măsură ce derulați în jos pe pagină. Suprapunerile sunt un exemplu de navigare ancorată. Acele butoane de rețele sociale care vă urmăresc în timp ce derulați în jos o postare de blog sunt, de asemenea, ancorate.

Inapoi la tine

Acestea sunt tendințele majore în design web de acum. Dar designul evoluează, iar designul web evoluează rapid. Dacă vă gândiți să vă reproiectați site-ul web sau doar colectați idei până când sunteți gata pentru o reproiectare, asigurați-vă că urmați tendințele de design web care susțin gradul de utilizare și conversii. Concentrați-vă întotdeauna pe utilizatorii dvs. - clienții și potențialii dvs. Doar pentru că un element de design este în stil nu îl face neapărat bun pentru afaceri.

Și așa cum spunea Steve Jobs: „ Designul nu este doar ceea ce arată. Designul este modul în care funcționează .”

Inca un lucru.

Designul evoluează, iar designul web evoluează rapid. Dacă vă gândiți să vă reproiectați site-ul web sau doar colectați idei până când sunteți gata pentru o reproiectare, asigurați-vă că urmați tendințele de design web care susțin utilizarea și conversiile și citiți cartea electronică Act-On, Transformați-vă site-ul web într-un prospect Generation Machine, pentru a vă asigura că nu pierdeți oportunități de a genera clienți potențiali pe măsură ce schimbați designul site-ului dvs.

Și, cel mai important, concentrați-vă întotdeauna pe utilizatorii dvs. - clienții și potențialii dvs. Doar pentru că un element de design este în stil nu îl face neapărat bun pentru afaceri.