Responsive așa cum trebuie

Iată câteva dintre nemulțumirile des întâlnite la proprietarii de site-uri devenite responsive, după ce o firmă sau un freelancer le adaptează site-ul pentru dispozitivele mobile:

Ați schimbat interfața grafică! Mi-ați făcut versiunea mobilă a site-ului și lipsesc elemente!

Dacă nu ați făcut o versiune specială pentru mobil (n.r. de tipul m.numelesite-ului.ro) atunci site-ul trebuie să păstreze aspectul și funcționalitatea pe care le are pe laptop/desktop.

Dar de ce a dispărut slider-ul din pagină?

Din fericire, nu am avut astfel de probeme cu Clienții Webgrow, dar avem prieteni în breaslă și auzim adesea de la ei tot felul de povești de acest gen. Din păcate, cei care lucrează în domeniu se confruntă cu astfel de situații destul de des, poate și pentru că sunt genul care preferă să lucreze în liniște și să nu dea multe explicații, dar și pentru că meseria de web designer pare că poate fi făcută (și înțeleasă) de oricine, deși nu este deloc așa.

Așadar, dacă intenționezi să-ți faci site-ul responsive, ca să nu fii tentat/ă să-ți construiești alte așteptări decât cele pe care le implică o astfel de lucrare, astăzi vom scrie despre ce înseamnă adaptarea responsive, ce presupune, ce nu presupune și la ce să te aștepți.

Ce înseamnă adaptarea responsive?

Întâi să clarificăm ceva. Un site care se vede bine pe mobil și tabletă nu este neapărat responsive. Acesta poate fi liquid, adaptive sau responsive sau o combinație între acestea (nu intrăm în detalii, dar un exemplu excelent este un site construit special pentru a ilustra diferențele, Liquidapsive.com). Totuși, a devenit un loc comun expresia „adaptare responsive a site-ului” sau „site responsive” (ca în fraza: „cât mă costă să-mi faceți site-ul responsive„).

Adaptarea responsive este suma operațiunilor necesare pentru ca un website să poată fi văzut pe dispozitive mobile fără să fie nevoie de efort din partea utilizatorului (scroll lateral, încercări succesive de a „nimeri” un buton mititel, eforturi de a mări pentru a citi un text prea mic).

Ce presupune adaptarea responsive?

Adaptarea responsive presupune editarea specifică, în general în fișierele CSS (dar există și alte tipuri de fișiere care se pot modifica și alte limbaje care se pot folosi) a mai multor instanțe vizuale pentru website-ul pentru care se lucrează. Practic, web designerul mai lcrează două, chiar trei variante de aspect grafic pentru site, păstrând conceptul general.

Ce NU presupune adaptarea responsive?

Adaptarea responsive nu presupune păstrarea identică a tuturor elementelor site-ului și nici micromanagement din partea Clientului – în cursul lucrului, din diverse motive care țin de aspect, viteza de încărcare a anumitor elemente grafice, precum și limitările tehnice existente, web designerul poate decide să nu afișeze anumite elemente sau să le modifice cu totul. Este, în general, cazul sliderelor, a meniurilor, dar și al altor elemente ale site-ului. Deciziile web designerului sunt luate după cântărirea plusurilor și minusurilor fiecărei opțiuni și este posibil ca, atunci când chestionezi aceste decizii și formulezi anumite constrângeri / cerințe obligatorii legate de aceste aspecte, să faci mai mult rău decât bine site-ului pe care îl ai. Așadar, ai încredere în deciziile web designerului – este meseria lui și știe să facă ce este mai bine pentru website-uri.

La ce să te aștepți atunci când comanzi adaptarea responsive a site-ului tău?

Așteaptă-te ca site-ul să se vadă coerent pe mobile și pe tablete. Asta înseamnă că ceea ce se vede la accesarea site-ului de pe un mobil sau de pe o tabletă trebuie să fie armonios. Să nu iasă elemente grafice din ecran. Să nu fie poziționate elementele grafice în locuri ciudate (de exemplu, un logo în josul ecranului și conținutul tot deasupra).

Așteaptă-te ca site-ul tău să nu arate chiar la fel ca cel destinat laptopurilor și desktopurilor. De exemplu, este posibil ca fundalul site-ului să nu se mai vadă la accesarea de pe mobil, ceea ce poate lua puțin din farmecul site-ului, dar este, în general, o decizie corectă de adaptare responsive.

Așteaptă-te la (și cere) un scor mai mare de 95% la user experience după efectuarea unui test cu instrumentul de verificare pus la dispoziție de Google. Mai există unul mai drăguț formatat, dar noi îl folosim pe acesta. Așteaptă-te și să fii nevoit să ignori unele sugestii de îmbunătățire legate de viteză (de exemplu, sunt situații în care nu poți micșora imaginile decât cu costuri suplimentare mai mari decât merită sau în care nu poți elimina „render-blocking JavaScript and CSS in above-the-fold content„) și uneori, choar și de aspect (pentru că uneori chiar vrei să păstrezi intact un astfel de element, din motive estetice).

Așteaptă-te și să nu vezi imediat modificările. Există mai multe tipuri de cache (adică, mai simplu spus, informație stocată local, livrată așa cum este stocată, fără a verifica dacă la sursă este ceva schimbat sau nu), printre care: cache-ul browserului folosit, cache-ul Internet Service Providerului (ISP), cache-ul serverului. Toate aceste locuri unde informația poate fi stocată și livrată economic către utilizator pot influența viteza cu care vei putea observa schimbările lucrate. Așadar, dă-i timp.

Așteaptă-te să existe device-uri pe care site-ul nu se vede excepțional sau se vede cu mici „defecte” de aspect. Caz în care, este bine să semnalezi acest fapt cu un print-screen web designerului (care va căuta și va găsi soluția ca site-ul tău să se vadă bine și pe acele dispozitive).

Așteaptă-te ca anumite pagini pe care le-ai editat chiar tu din aplicația de administrare a site-ului să se vadă eronat (cu scroll lateral – aceasta este problema principală, de obicei), mai ales dacă ai pus poze și tabele. Aceste pagini vor trebui refăcute fie de către tine, cu atenție la lățimea maximă (pe care ți-o comunică web designerul) și la alți parametri (pe care tot web designerul ți-i explică).

Așteaptă-te la lucruri care nu sunt trecute aici – adică la surprize! Pentru că niciun website nu este la fel cu altul, problemele care apar sunt diverse și important e să fie rezolvate. Sunt situații în care web designerul le va putea rezolva fără taxe suplimentare, dar sunt și situați în care trebuie să achiți ceva în plus, în funcție de situația apărută și de specificul site-ului tău.

Succes cu adaptarea responsive!

 

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *

Te rugăm să citești politica de confidențialitate și cookies, iar dacă ești de acord și accepți să primești comunicări pe e-mail de la WEBGROW, inclusiv comunicări comerciale, te rugăm bifează mai jos: