Site-uri responsive. Sau pur și simplu site-uri ajustate la dispozitivele mobile

Site-urile repsonsive, nu mai sunt un trend. Au fost un trend vreo 5 ani în urmă, … ok 3 ani în urmă. În ziua de azi, dacă voi înscrie acum în Google ”AD2018” și unul din site-uri nu se va afișa bine pe dispozitivele mobile, va fi o tragedie. Pur și simplu așa sunt standardele de azi.

Ce este un site repsonsiv?

Termenul site responsiv provine de la termenul englez Responsive Web Design ceea ce înseamnă proiectare responsivă a site-ului. Aceasta înseamnă că site-ul include câteva versiuni de lățimi diferite, cu aranjări diferite ale elementelor – de exemplu o versiune pentru desktop, alta pentru tabletă, pentru smartphone.

În dependență de lățimea ecranului folosit pentru accesarea site-ului, utilizatorul primește versiunea de site corespunzătoare.

Important este ca elementele de pe site să fie bine ajustate iar conținutul să fie același în fiece versiune.

Multe persoane întâlnesc aici greutăți. Mulți proprietari de site-uri au de a face cu această decizie complicată: să lase baltă sistemul care ar ajusta site-ul pentru un număr mai larg de utilizatori, sau să facă întreprindă ceva în această direcție.

Este un subiect destul de complicat, pentru că există mai multe opțiuni: să creezi un site nou de la zero, sau să transformi site-ul existent într-un site responsiv. În cazul opțiunii 2 de multe ori apare o problemă importantă – platformele mai vechi, (în special cele care nu se mai dezvoltă) pot să nu permită așa ceva.

Și atunci trebuie să creezi un site responsiv, de la zero. Și aici apar platformele de tip sitebuilder. 🙂


Site mobil sau responsiv?

Până nu demult platformele de acest gen permiteau crearea site-urilor pentru desktop, în exclusivitate. Apoi au apărut site-urile mobile, care într-adevăr se creează foarte ușor pe platforme drag-and-drop (tragi elementele și le lași acolo unde ai nevoie). Doar că site-urile mobile au deseori o altă adresă (cu un ”m.” la început) și mai au o mulțime de constrângeri.

În schimb site-urile resposnive se afișează foarte bine pe orice lățime de ecran. În special atunci când sunt bine proiectate. Nu implică limitări de genu ”ecran îngust”, pur și simplu se afișează bine chiar și pe ecrane foarte înguste.

Aceasta este important, pentru că mulți utilizatori deschid pe desktop 2 ferestre una lângă alta și lucrează cu ambele ferestre concomitent. În această situație este foarte important ca site-urile accesate să fie responsive, adică să se afișeze corect, independent de lățimea ferestrei.


Vezi cele mai bune platforme de tip site-builder unde vei crea un site ajustat pentru smarphone-uri


Site-uri responsive – este ceva complicat?

Însă crearea unui site responsiv nu este simplă. E bine când un template, să presupunem în WordPress funcționează bine și este ajustat pentru toate dispozitivele ;). E mai greu atunci când la editarea site-ului, șablonul se deteriorează. Și așa se mai întâmplă. Atunci nu ai altă ieșire din situație de cât să editezi direct codul site-ului, iar numărul de corectări poate fi atât de mare încât să ajungi la concluzia că alegerea șablonului dat nu a fost cea mai reușită decizie din viața ta.

În cazul platformelor sitebuilder situația arată puțin mai diferit, pentru că poți edita mai multe moduri RWD. Pur și simplu. Majoritatea platformelor include 3 moduri standard: Desktop, Tabletă și Telefon. Însă de multe ori diferențele dintre aceste moduri standarde sunt destul de mari. Lățimile standarde ale modurilor site-urilor responsive sunt următoarele:

  • Desktop – 1200 pixeli
  • Tabeltă – 800 pixeli
  • Telefon – 350 – 400 pixeli

Ceva asemănător vei întâlni la WIX. Practic vorbind aici vei lucra cu template-uri predefinite. Deci dacă template-ul nu include erori, atunci nu trebuie să ai probleme cu ajustarea la dispozitivele mobile.

Lățimea modurilor standarte, de obicei sunt suficiente. Însă uneori apare problema diferenței dintre modul Tabletă (800px) și modul telefon (400px). Când folosim un smartphone mai măricel și nimerim pe versiunea de tabletă, iar elementele acestea sunt atât de mici încât site-ul devine neciteț. Sună ca un detaliu, dar în ziua de azi avem de a face cu un trend stabil a producătorilor de smartphone-uri care creează smartphone-uri din ce în ce mai mari.


Constrângerile platformelor drag-and-drop în crearea site-urilor resposnive

Suplimentar poți întâlni opțiunea de a edita lățimea modurilor RWD. Din nou, deși sună ca un detaliu, această opțiune oferă un plus de control.  Dina ceastă cauză să nu vă mirați atunci când anumiți utilizatori critică acest ”detaliu”, ca o limitare importantă a platformelor darg-and-drop. Uneori aceste limitări există, uneori nu – din fericire.

Din această cauză cel de al 4-lea mod RWD și posibilitatea de a seta lățimea acestor moduri sunt niște aspecte foarte importante în crearea site-urilor RWD. De fapt, am observat acest posibilități, doar în WebWave – și trebuie să menționez că sunt foarte utile.

Setarea lățimii modurilor este importantă pentru site-urile care necesită o aranjarea mai specifică a elementelor pe diferite dispozitive. Plus la toate, cel de-al 4-lea mod (modul intermediar, dintre tabletă și smartphone) permite o ajustare mai exactă a elementelor la dispozitivele mobile. În ziua de azi traficul de utilizatori provine de pe telefoanele mobile. Respectiv, controlul modului în care arată site-ul pe smartphone-uri este foarte important.


Crearea site-urilor responsive

Crearea site-urilor repsonsive pe platformele site-builder este o plăcere ;). Poți ajusta site-ul la smartphone-uri și tablete fără mari probleme. Aranjezi elementele cu cursorul și gata.

Dar merită să ne amintim de lucrul cu straturile. Care devine foarte important în ajustarea site-ului. Din noul, observăm platforme care oferă această opțiune și platforme care nu prea …. Oricum, cele mai bune platforme din ranking-ul nostru permit acest lucru.


Deci trage cu ochiul la clasamentul nostru celor mai bune platforme pentru crearea site-urilor. Alege platformă cea mai avansată.