Web adaptada al mòbil: com comprovar en 10 minuts si la teva funciona

Gairebé totes les webs que es fan ara són «responsive», però això no garanteix tenir una web adaptada al mòbil que es faci servir amb comoditat. El disseny s'encongeix per cabre a la pantalla, i amb això no n'hi ha prou: algú amb el telèfon en una mà, dret al carrer, ha de poder trobar el teu número, llegir els teus serveis i enviar-te un missatge sense barallar-se amb la pàgina.

A més, Google mira sobretot la versió mòbil de la teva web per decidir com la posiciona, de manera que això afecta tant les visites que t'arriben com el que fan quan hi són. Les proves que segueixen les pots fer tu, sense coneixements tècnics, en uns deu minuts.

Com saber si tens una web adaptada al mòbil

Fes les proves amb el teu telèfon i, si pots, repeteix-les amb un altre de diferent. Un Android de gamma mitjana amb pantalla petita treu a la llum problemes que en un iPhone recent no es veuen. Desactiva el wifi i navega amb dades, que és com et visita bona part de la gent. I entra-hi buscant el teu nom a Google, com faria un client, en lloc de fer servir el marcador que tens desat.

Tingues a mà una nota per apuntar què falla en cada prova, amb captures de pantalla. Després et servirà per demanar que ho arreglin i per comprovar que s'ha fet.

Prova 1: el que es veu sense desplaçar-te

Obre la portada i no toquis res. A la primera pantalla hauries de veure qui ets, què fas i una manera de contactar, com un botó per trucar o per demanar hora. Si el primer que apareix és una foto enorme, un avís de galetes que tapa mitja pantalla i un eslògan, el visitant s'ha d'esforçar per saber si ha arribat al lloc correcte.

Fixa't també si algun element salta mentre es carrega. Quan estàs a punt de tocar un botó, es carrega una imatge a sobre, el botó es desplaça i acabes tocant una altra cosa. Google mesura aquests salts, i a l'usuari l'irriten força.

Prova 2: botons i enllaços que es poden tocar amb el dit

Intenta tocar cada botó amb el polze, sense fer zoom. Un botó còmode ha de tenir més o menys la mida del palpís del dit; com a referència, les guies de disseny de Google i d'Apple parlen d'uns 44 a 48 píxels. I hi ha d'haver espai entre l'un i l'altre: dos enllaços enganxats al peu de pàgina, com «Avís legal» i «Privacitat», fan que acabis al que no volies.

Comprova sobretot el telèfon. Quan el toques, s'ha d'obrir la trucada directament. Si no passa res, o si el número és dins d'una imatge, estàs perdent trucades. El mateix passa amb el botó de WhatsApp: hauria d'obrir la conversa amb un missatge inicial, i no la pàgina per descarregar l'aplicació. Tens més detalls a l'article sobre com posar WhatsApp a la web.

Prova 3: textos que es llegeixen sense ampliar

Llegeix un paràgraf sencer d'una pàgina de serveis amb el braç a la distància normal. Si has d'ampliar amb dos dits, la lletra és petita; per sota de 16 píxels al cos del text, la majoria comencem a forçar la vista. Mira també el contrast. El gris clar sobre blanc queda elegant a la pantalla del dissenyador, però al carrer, en ple sol, no es veu.

Una altra errada típica de les webs adaptades a correcuita són els paràgrafs llarguíssims. Un bloc que a l'ordinador ocupa quatre línies, al mòbil en són quinze. Gairebé sempre s'arregla amb paràgrafs curts i subtítols que diguin de què va cada part.

Prova 4: el menú

Obre el menú (la icona de les tres ratlles) i entra a cada secció. Comprova que s'obre i es tanca bé, que els submenús no desapareixen quan els intentes tocar i que pots tornar enrere sense perdre't. Mira també l'ordre: els serveis i el contacte haurien de ser a dalt, abans que «La nostra filosofia».

Si el menú té més de set o vuit opcions, al mòbil es fa llarg. Sol ser senyal que sobren pàgines o que caldria agrupar-les.

Prova 5: omplir el formulari

És la prova que destapa més problemes. Omple el teu propi formulari de contacte des del mòbil, de cap a cap, i envia'l. Mentre ho fas, fixa't en això:

• Quan toques el camp del telèfon, surt el teclat numèric? I el que té l'arrova al camp del correu electrònic?
• Els camps són prou grans perquè no toquis el del costat sense voler?
• Et demana dades que no calen per contestar, com l'adreça completa o el nom de l'empresa?
• Si t'equivoques, s'entén el missatge d'error i es manté el que ja havies escrit?
• Quan l'envies, apareix una confirmació clara? T'arriba el missatge al correu?

L'últim punt sembla obvi, però és habitual trobar formularis que fa mesos que no envien res perquè algú va canviar la contrasenya del correu o es va espatllar un connector. Revisa-ho de tant en tant. A l'article sobre com fer un formulari de contacte que funcioni hi trobaràs més idees.

Prova 6: velocitat amb dades mòbils

Amb el wifi apagat, compta mentalment quant triga la portada a veure's i a poder-se fer servir. Si passes més de tres o quatre segons mirant una pantalla en blanc, pensa que molts visitants se'n van abans de veure res. Després entra a PageSpeed Insights, l'eina gratuïta de Google, enganxa-hi l'adreça de la teva web i mira la pestanya de mòbil.

No t'obsessionis amb la nota. Fixa't en els avisos que costen més temps, que solen ser imatges massa pesants, massa scripts de tercers (xats, píxels de publicitat, mapes) o un allotjament lent. Si vols entendre les mètriques que hi surten, ho expliquem a l'article sobre la velocitat web i les Core Web Vitals.

Què has de fer si la teva web suspèn diverses proves

Un parell d'errades soltes, com un botó petit o un camp que sobra, s'arreglen amb retocs. Si falla gairebé tot, el més probable és que la web es pensés per a l'ordinador i s'adaptés després, i apedaçar-la surt car per al que millora. En aquest cas sol compensar plantejar-se una web nova, dissenyada des del principi per llegir-se al telèfon.

Amb la llista d'errades i les captures a la mà, podràs demanar pressupostos comparables i saber exactament què has de demanar que es corregeixi.

Si vols una web pensada per al mòbil

A Webmensual dissenyem cada web des de zero i la cobrem amb una quota mensual, amb el manteniment i l'atenció de persona a persona inclosos, així que si després de publicar-la alguna cosa no va bé al mòbil, ho dius a algú que coneix la teva web. Pots veure què inclou cada pla o enviar-nos l'adreça de la teva web actual i et preparem una proposta en menys de 24 hores.