Cele mai frecvente greșeli ale versiunii mobile a site-ului: butoane mici, formulare incomode, tabele, încărcare lentă și ferestre peste text. Cum vă verificați site-ul și ce să corectați mai întâi.
Despre noi
Cele mai frecvente greșeli ale versiunii mobile a site-ului: butoane mici și înghesuite, formulare incomode, tabele și text care ies din ecran, încărcare lentă, ferestre pop-up peste conținut și un număr de telefon care nu se deschide dintr-o singură atingere. Ele se văd la verificarea pe un smartphone real, după scenariile-cheie: găsirea unui produs, un apel, trimiterea unei solicitări, plata.
În multe nișe, o parte importantă a vizitatorilor vine de pe smartphone. Ponderea depinde de domeniu și de public, de aceea merită să o urmăriți în propria analitică, de exemplu în raportul după tipul de dispozitiv din Google Analytics.
Google aplică indexarea după versiunea mobilă (mobile-first indexing): pentru evaluarea paginii, motorul de căutare folosește în principal varianta ei mobilă. Dacă în versiunea mobilă lipsesc texte, imagini sau marcaje care există în versiunea pentru computer, aceste materiale pot pierde din greutate în căutare.
Pentru afacere, consecințele sunt simple: o pagină incomodă pe telefon reduce numărul de solicitări, poate crește costul unei solicitări din traficul plătit și poate slăbi pozițiile în căutare.
Contextul în care se folosește smartphone-ul diferă de cel al computerului: omul ține telefonul într-o mână, stă la coadă sau merge cu transportul public, privește ecranul în lumină puternică și are un semnal slab. De aceea pagina trebuie să răspundă rapid la întrebările principale: ce se oferă, cât costă, cum se poate lua legătura.
Degetul este mai puțin precis decât cursorul mouse-ului. Ghidurile Apple și Google pentru interfețele mobile recomandă pentru elementele interactive o dimensiune de aproximativ 44–48 de pixeli pe fiecare latură și spații vizibile între ele. Linkurile mărunte din text, punctele de meniu înghesuite și butoanele lipite unul de altul duc la atingeri accidentale și la iritare.
Meniul hamburger este potrivit pentru un site mare, dar acțiunile cele mai importante – apelul, mesajul, deschiderea coșului – e mai bine să fie scoase la vedere. Meniul trebuie să se deschidă dintr-o atingere, să se închidă cu un buton clar și să nu acopere ecranul fără nevoie.
Numărul de telefon se formatează ca link cu protocolul tel, iar atunci apelul începe dintr-o singură atingere. La fel funcționează linkurile către aplicațiile de mesagerie. Un buton fix de contact în partea de jos a ecranului scurtează drumul până la conversație, dacă nu acoperă textul și butoanele formularului.
Pe site-urile cu multe pagini ajută căutarea și firul de navigare (breadcrumbs), care arată unde se află omul. Câmpul de căutare trebuie să fie vizibil, iar rezultatele trebuie să rămână clare chiar și atunci când textul căutat conține greșeli.
Caruselele cu slide-uri care se schimbă doar cu săgețile sunt incomode pe smartphone. Listele derulante cu zeci de opțiuni e mai bine să fie înlocuite cu căutarea sau cu grupuri. Mai multe elemente fixe în același timp – antetul, chatul, bannerul de cookies, butonul de apel – lasă pe ecran foarte puțin loc pentru conținut.
Lizibilitatea pe un ecran mic o asigură câteva reguli de bază.
Verificați separat paginile cu tabele mari de prețuri sau de caracteristici: tocmai ele ies cel mai des din limitele ecranului.
Pe computer, pagina serviciului are textul în stânga și formularul în dreapta. Pe smartphone, blocurile se așază unul sub altul, iar formularul ajunge sub un text lung. Vizitatorul derulează câteva ecrane și nu vede cum să trimită o solicitare. Soluția: un bloc scurt cu avantajele, un buton de solicitare imediat după el și un formular la care duce butonul.
Formularul este locul unde se pierd solicitările. Un formular mobil bun este scurt, are etichete deasupra câmpurilor, care nu dispar în timpul introducerii, și arată erorile lângă câmpul respectiv.
Este util să oferiți mai multe modalități de contact: formularul, apelul și aplicația de mesagerie. Unora nu le place să vorbească la telefon, alții nu vor să completeze câmpuri, de aceea posibilitatea de a alege mărește șansa de a primi o solicitare.
Rețelele mobile sunt uneori instabile, iar dispozitivele diferă ca performanță. Imaginile mari, fonturile grele și scripturile terțe încetinesc pagina. În recomandările sale publice, Google evidențiază indicatorii Core Web Vitals: viteza afișării conținutului principal (LCP), reacția la acțiunile utilizatorului (INP) și stabilitatea machetei (CLS). Valorile lor se văd în PageSpeed Insights și în Search Console.
Bannerele de cookies, de abonare și ferestrele publicitare care acoperă ecranul împiedică citirea paginii până la capăt. În recomandările publice ale Google se menționează că ferestrele intruzive afișate după trecerea din căutare pot înrăutăți evaluarea paginii. Faceți bannerul compact, cu un buton de închidere ușor de apăsat, și nu afișați abonarea imediat după deschiderea paginii.
Rezultatele se notează comod într-o listă scurtă: pagina, problema, prioritatea. Mai întâi se corectează ce împiedică solicitarea sau plata, apoi paginile cele mai vizitate conform analiticii, după aceea erorile care strică aspectul paginii și, la final, îmbunătățirile mărunte ale textului și ale spațierii.
De obicei, nu. Abordarea modernă este designul adaptiv: o singură adresă și un singur set de conținut, care se rearanjează după dimensiunea ecranului. O versiune mobilă separată, pe altă adresă, complică întreținerea și SEO.
Deschideți paginile principale pe un telefon real și parcurgeți scenariile-cheie. Suplimentar, folosiți PageSpeed Insights, raportul Core Web Vitals din Search Console și inspecția URL-urilor. Setul de instrumente Google se schimbă, de aceea verificați informațiile în documentația actuală.
Pentru textul principal se potrivește de obicei în jur de 16 pixeli, pentru etichete și note – puțin mai puțin, dar cu un contrast suficient. Verificați lizibilitatea pe un dispozitiv real, în condiții diferite de iluminare.
Nu. Pentru un site mic, cu câteva secțiuni, se potrivește navigarea vizibilă. Meniul hamburger este potrivit atunci când punctele de meniu sunt multe; acțiunile cele mai importante se scot oricum la vedere.
Publicitatea plătită duce adesea către pagini pe care oamenii le deschid de pe smartphone. Dacă pagina este incomodă, plătiți pentru clic, iar formularul nu îl completează nimeni. Înainte de lansarea reclamei, verificați landing page-ul pe telefon.
Versiunea mobilă determină dacă omul va trimite o solicitare de pe telefon. Începeți cu scenariile principale: găsirea informației necesare, apelul, completarea formularului, plata – și corectați ceea ce încurcă cel mai mult. După modificări, verificați din nou site-ul pe telefon: actualizările șabloanelor și ale pluginurilor strică adesea aspectul mobil. Măsurați rezultatul prin conversia pe smartphone-uri. LightSEO este o agenție digitală din Mukachevo care din 2015 creează site-uri și magazine online și se ocupă de SEO, așa că vă poate ajuta să verificați versiunea mobilă. Problemele tehnice care influențează vizibilitatea le scoate la iveală un audit SEO al site-ului. Un site nou adaptiv poate fi comandat ca site corporativ la cheie.
