El disseny de llocs web per a mòbils és complicat, ja que pot ser que una versió per a mòbils d'un lloc no sigui compatible amb tots els dispositius. Els dissenyadors han de ser conscients de les millors pràctiques de disseny per tal que la vostra presència en el mòbil sigui útil i valgui la pena.
Hi ha un debat continu entre els desenvolupadors web sobre quina manera de crear un lloc web optimitzat per a mòbils és el millor. Hi ha tres mètodes principals per desenvolupar un lloc web per a mòbils.
Aquests són:
- Disseny web responsable.
- Llocs web dedicats per a mòbils.
- RESS: la programació del costat del servidor representa CSS i HTML, depenent del tipus de dispositiu.
Cada mètode té els seus avantatges i inconvenients. Un desenvolupador web ha de ser conscient de cada tècnica per implementar el millor per a la situació.
3 maneres de dissenyar un lloc web per a mòbils
Disseny web responsable (RWD)
RWD es basa en consultes de mitjans CSS3 per alinear el disseny d'una pàgina web amb la mida de l'àrea de visualització d'un dispositiu. El mateix codi HTML s'utilitza per presentar diferents dissenys de pàgines web per a tauletes, dispositius mòbils, ordinadors de sobretaula i altres gadgets.
Beneficis:
- El vostre lloc web tindrà contingut similar i un marcador HTML, de manera que els visitants de mòbil tindran la mateixa experiència, independentment del tipus de dispositiu que utilitzin.
- Un URL únic fa que els usuaris puguin enllaçar i compartir contingut amb més facilitat. (Si la pàgina web està disponible en més d'una adreça URL, els usuaris poden confondre's.)
Inconvenients:
No és possible optimitzar per separat el contingut mòbil. Per tant, un dissenyador que utilitza RWD no pot adaptar el contingut per separat per als usuaris mòbils.
Segons les dades de l'arxiu HTTP de gener de 2013, una pàgina web mitjana és d'uns 1.3 MB. No obstant això, la majoria de llocs RWD són relativament més grans. Aquesta mida més gran disminueix el rendiment dels llocs mòbils, fent-los més lents.
Els usuaris mòbils s'adapten millor als patrons de disseny d'interfícies d'usuari específiques per a mòbils. D'altra banda, els usuaris mòbils estan acostumats a tasques múltiples. A menys que l'estructura de navegació estigui personalitzada per a dispositius específics, els usuaris poden afrontar problemes quan intenten realitzar diverses tasques simultàniament.
Llocs Mòbils Dedicats
Aquest mètode millora l'experiència dels usuaris mòbils creant un lloc web totalment diferent.
Beneficis:
- Simplicitat de gestió: calen canvis separats per a llocs de mòbils i d'escriptori. Els canvis realitzats es limiten a cada versió respectiva. Això significa que els canvis destinats a la plataforma mòbil no es poden accedir des de l'escriptori.
- A mesura que esteu desenvolupant un lloc web específic per a mòbils, es fa més senzill racionalitzar-lo i optimitzar-lo específicament per a aquest públic.
- L'estructura de contingut i navegació es pot personalitzar per a usuaris mòbils.
Inconvenients:
Compartir una pàgina web a través de les xarxes socials es fa més difícil, ja que amb llocs mòbils dedicats hi ha diverses URL per a pàgines. Quan els usuaris d'escriptori facin clic a URL mòbils compartits a les plataformes de xarxes socials, poden rebre inadvertidament la versió mòbil del lloc en comptes de la versió d'escriptori.
Per evitar problemes de contingut duplicats, el desenvolupador web ha d'utilitzar meta tags rel = "alternative" i rel = "canonical". Si un usuari mòbil fa cerques a Google i fa clic a un URL d'escriptori, l'usuari visualitzarà la versió d'escriptori o serà redirigit a la versió mòbil de la pàgina web. Si la versió per a mòbils no existeix, l'usuari rebrà un missatge d'error.
La creació d'un lloc web totalment diferent per als usuaris mòbils implica que el lloc es dissenyarà específicament per als usuaris mòbils. Tanmateix, per complir aquest propòsit, els desenvolupadors web han de retallar la funcionalitat i el contingut, que resulta ser una malson per a ells.
Disseny web responsable+ Components del costat del servidor (RESS)
Aquest mètode depèn de la programació del servidor per proporcionar HTML personalitzat i CSS per a diferents dispositius. El codi dels usuaris mòbils serà diferent del dels usuaris d'escriptori.
L'objectiu principal d'aquesta implementació és millorar el rendiment del lloc web. Aquest mètode funciona bé quan es combina amb un disseny web sensible. Per tant, aquesta implementació es pot denominar com a components responsables del disseny web + component del servidor (RESS).
Beneficis:
- L'estructura de navegació es pot personalitzar per a diferents tasques realitzades pels usuaris d'ordinadors i mòbils.
- Els desenvolupadors poden eliminar elements de pàgina d'HTML i CSS per aconseguir la visualització desitjada.
- És possible eliminar JavaScript innecessari des d'HTML, que allibera els recursos de la CPU, la memòria i la memòria cau dels dispositius mòbils.
Inconvenients:
- L'HTML dinàmic augmenta la càrrega al servidor.
- No es pot confiar en la detecció del dispositiu.
- HTML i CSS estan optimitzats per al rendiment mòbil. La versió d'escriptori utilitza més sol · licituds HTTP i scripts de Java.
Quin mètode triar?
La decisió de dissenyar un lloc optimitzat per a mòbils depèn dels productes que veneu, del públic objectiu, de la inversió requerida, de la competència, de les taxes de conversió, etc. El mètode de disseny que funcionarà millor depèn en gran mesura de formats de pantalla, sistemes operatius, navegadors i resolucions.
Els llocs de disseny web més responsables no s'implementen de manera òptima i, com a resultat, aquests llocs triguen més a carregar-se. Com que la competència és ferotge, podeu perdre clients si el vostre lloc funciona més lentament. Un usuari simplement canviarà a un altre lloc web que trigui menys temps a obrir. Encara que és possible crear llocs web amb temps de càrrega més curts amb llocs mòbils dedicats, també hi ha diversos inconvenients associats a aquesta implementació.
RESS proporciona beneficis de RWD per superar els seus dos principals inconvenients. El desavantatge principal de RESS és que la detecció de dispositius no és fiable. Heu de provar amb freqüència per a dispositius nous per garantir que el procés continuï funcionant correctament.
Hi ha serveis com DeviceAtlas, WURFL i altres que poden detectar nous dispositius. Serà una gran ajuda per actualitzar nous dispositius a la vostra base de dades.
El disseny web mòbil només té èxit quan el lloc web es mostra correctament en un dispositiu mòbil. Tot i que és una tasca difícil per als dissenyadors representar totes les parts essencials d'un lloc d'escriptori en una finestra petita i mòbil, cada dia sorgeixen noves tècniques per fer que els llocs web per a mòbils siguin millors, més ràpids i més complets.
Foto del lloc web mòbil a través de Shutterstock
15 Comentaris ▼
