Ce este un design web responsiv?

Cuprins:

Anonim

Te-ai intrebat: "Ce este un design web receptiv?" Responsabilitatea web design-ului este o abordare prin care un designer creeaza o pagina web care "raspunde" sau se redimensioneaza in functie de tipul de dispozitiv pe care il vedeti. Acesta ar putea fi un monitor desktop de dimensiuni mari, un laptop sau dispozitive cu ecrane mici, cum ar fi smartphone-uri și tablete.

Responsabilitatea web design-ului a devenit un instrument esențial pentru oricine care are o prezență digitală. Odată cu creșterea numărului de telefoane inteligente, tablete și alte dispozitive mobile de calcul, mai mulți utilizatori folosesc ecrane mai mici pentru a vizualiza paginile web.

$config[code] not found

Aceste site-uri web trebuie să ia în considerare și primul index mobil, anunțat de Google în aprilie 2018. Întrucât mai multe companii mici își sporesc prezența mobilă, site-ul lor web, eCommerce, paginile de afaceri Google, paginile social media și alte active trebuie să fie ușor accesibile dispozitive.

Ce este un design web responsiv?

Scopul designului receptiv este acela de a avea un singur site, dar cu elemente diferite care răspund diferit atunci când sunt văzute pe dispozitive de dimensiuni diferite.

Să luăm un site tradițional "fix". Atunci când este vizualizat pe un computer desktop, de exemplu, site-ul web ar putea afișa trei coloane. Dar când vizualizați acel același aspect pe o tabletă mai mică, s-ar putea să vă forțați să derulați orizontal, ceva ce nu vă place utilizatorii. Sau elementele ar putea fi ascunse din vedere sau arata distorsionate. Impactul este, de asemenea, complicat de faptul că multe tablete pot fi văzute fie în orientare portretă, fie în partea laterală pentru vizualizarea peisajului.

Pe un ecran mic telefon inteligent, site-urile web pot fi chiar mai dificile pentru a vedea. Imaginile mari pot "sparge" aspectul. Site-urile pot fi încărcate lent pe smartphone-uri dacă sunt grafice grafice.

Cu toate acestea, dacă un site utilizează un design receptiv, versiunea tabletei se poate ajusta automat pentru a afișa doar două coloane. În acest fel, conținutul este ușor de citit și ușor de navigat. Pe un telefon inteligent, conținutul poate apărea ca o singură coloană, probabil stivuită vertical. Sau, eventual, utilizatorul ar avea posibilitatea de a trece prin glisare pentru a vedea alte coloane. Imaginile vor fi redimensionate în loc să distorsioneze aspectul sau să se întrerupă.

Ideea este: cu un design receptiv, site-ul se adaptează automat pe baza dispozitivului pe care îl vede spectatorul.

Cum functioneaza Responsabil Web Design?

Site-urile responsabile utilizează grile fluide.Toate elementele de pagină sunt dimensionate proporțional, mai degrabă decât pixeli. Deci, dacă aveți trei coloane, nu ați spune exact cât de mare ar trebui să fie fiecare, ci mai degrabă cât de largi ar trebui să fie în raport cu celelalte coloane. Coloana 1 ar trebui să ia jumătate din pagină, coloana 2 ar trebui să fie de 30%, iar coloana 3 ar trebui să ia 20%, de exemplu.

De asemenea, media, cum ar fi imaginile, este redimensionată relativ. Astfel, o imagine poate rămâne în interiorul coloanei sale sau al unui element relativ de design.

Probleme similare

Mouse la atingere: Proiectarea pentru dispozitive mobile aduce și problema mouse-ului versus atingere. Pe computerele desktop, utilizatorul are în mod obișnuit un mouse pentru a naviga și a selecta elemente. Pe un smartphone sau pe o tabletă, utilizatorul utilizează mai ales degetele și atinge ecranul. Ceea ce poate părea ușor să selectați cu un mouse, poate fi dificil de selectat cu un deget pe un loc mic pe un ecran. Designerul Web trebuie să ia în considerare "atingerea".

Grafica și viteza de descărcare: De asemenea, există problema de grafică, anunțuri și viteză de descărcare. Pe dispozitivele mobile, ar putea fi înțelept să se afișeze mai puține grafică decât pentru vizualizările desktop, astfel încât un site să nu fie luat pentru totdeauna de încărcat pe un smartphone. Este posibil ca dimensiunile anunțurilor mai mari să fie schimbate pentru anunțurile mai mici.

Aplicații și "versiuni mobile": În trecut, s-ar fi putut gândi la crearea unei aplicații pentru site-ul dvs. - de exemplu, o aplicație iPad sau o aplicație Android. Sau ai avea o versiune mobilă special pentru BlackBerry.

Dar, cu atât de multe dispozitive diferite astăzi, devine din ce în ce mai greu să creezi aplicații și versiuni diferite pentru fiecare dispozitiv și platformă de operare.

De ce întreprinderile mici trebuie să treacă la un design web receptiv

Mai multe persoane folosesc dispozitive mobile. Un studiu Pew recent, 77% dintre americani dețin acum smartphone-uri în 2018, ceea ce se ridică la doar 35% în primul studiu Pew Research Center, care a avut loc în 2011.

Verificați traficul și este posibil să fiți șocați de numărul de vizitatori care ajung pe site-ul dvs. prin intermediul dispozitivelor mobile. (În Google Analytics, selectați "Audiența" din partea stângă, apoi "Mobil" pentru a vedea ce proporție de trafic este de pe dispozitivele mobile. Puteți chiar să căutați pentru a vedea care sunt dispozitivele care trimit traficul.)

Șabloanele de design responsabile sunt peste tot, pentru cumpărare. Dacă, de exemplu, aveți un site WordPress, puteți vizita o gamă reputațională de șabloane, cum ar fi ThemeForest și căutați "teme responsabile pentru WordPress". Cumpărați unul pentru sub 50 USD. Dezvoltatorul dvs. de Web vă poate personaliza apoi pentru logo-ul și marca dvs.

Nota Editorului: Aici, la Tendințe de afaceri mici, lucrăm la un nou design receptiv. Nu ar trebui?

Fotografie prin Shutterstock

Mai multe în: Content Marketing, Ce este 95 de comentarii ▼