Avui, la majoria de la gent es connecta a través de dispositius mòbils: tauletes, telèfons, en aquest sentit, l'optimització del lloc web també està arribant a un nou nivell. Si un usuari entra i veu que el lloc no està optimitzat per a dispositius mòbils: la imatge no es pot visualitzar, els botons s'han mogut, els tipus de lletra són petits i il·legibles, el disseny està esbiaixat - 99 del 100% que sortirà i comença a buscar-ne un altre més convenient. I el robot de cerca marcarà la casella que el recurs és irrellevant, és a dir, no coincideix amb la consulta de cerca. Per tant, el disseny de la pàgina s'ha d'adaptar a diversos dispositius mòbils. Què és una versió mòbil del lloc, com fer-la i quina és la millor manera d'aplicar-la? Llegiu-ne més en aquest article.
Així que hi ha quatre maneres clau de fer que el vostre lloc sigui amigable per a mòbils.
Mètode 1: disseny responsive
Les plantilles responsives canvien la imatge del lloc en funció de la mida de la pantalla. Com a regla general, s'estableixen en 1600, 1500, 1280, 1100, 1024 i 980 píxels estàndard. Per a la implementació, s'utilitzen CSS3 Media Queries. El disseny del lloc en si no canvia.
Els avantatges d'aquest mètode inclouen:
- desenvolupament convenient,com que la pròpia estructura s'adapta als paràmetres de la pantalla i qualsevol actualització no requereix desenvolupament de disseny des de zero, n'hi ha prou amb ajustar el CSS i l'HTML;
- un URL: l'usuari no necessita recordar diversos noms, no cal una redirecció (redirecció d'una adreça a una altra), cosa que pot complicar la feina d'un administrador web i és més fàcil fer una cerca motor per ordenar i classificar un recurs amb una única adreça.
Per descomptat, les plantilles adaptatives tenen els seus inconvenients, que, per cert, són més que avantatges. No obstant això, molts desenvolupadors s'adhereixen a aquest concepte, per exemple, Google Corporation, la versió mòbil del lloc té un disseny adaptatiu. Per tant, desavantatges:
- El disseny responsive no admet les mateixes tasques al mòbil que a l'ordinador. Si es tracta, per exemple, d'una versió mòbil del lloc web d'un banc, on és més probable que la informació sobre el tipus de canvi o els caixers automàtics més propers siguin importants per a l'usuari, llavors aquest disseny és suficient. Però si es tracta d'un recurs estructurat complex amb moltes seccions i subseccions, als visitants difícilment els agradarà el disseny adaptatiu.
- La càrrega lenta converteix un lloc preferit en un d'odiós. Això és especialment cert per als recursos on hi ha animacions, vídeos, finestres emergents i altres elements actius. A causa del gran pes, la pàgina simplement "alentirà", l'usuari s'enfadarà i marxarà, i les posicions de cerca del lloc cauran.
- La impossibilitat de desactivar la versió mòbil és un altre inconvenient important. Si algun element s'amaga amb aquest disseny, vostèno pots fer res per obrir-lo, a diferència dels llocs on pots desactivar-lo i canviar a un domini normal.
No obstant això, aquesta versió mòbil del lloc ràpidament, sense habilitats ni costos especials, us permet adaptar el recurs a qualsevol gadget. Però, ateses les mancances enumerades, s'adaptarà a recursos petits i senzills amb un mínim d'informació i multimèdia, sense navegació i animació complexes. Per a un lloc complex, s'adapten dos mètodes més.
Segon mètode: una versió independent del lloc
Aquest mètode és molt comú i sovint té èxit per fer que el lloc sigui més llegible en un dispositiu mòbil. La seva essència és crear una versió independent de la pàgina, dibuixada per a l'aplicació i situada en un URL o subdomini independent, per exemple, m.vk.com. Al mateix temps, es conserva la funcionalitat principal, el disseny del lloc només sembla diferent. Els avantatges d'aquest mètode són evidents:
- interfície fàcil d'utilitzar;
- fàcil de canviar i editar, ja que la versió existeix per separat del recurs principal;
- a causa del baix pes, una versió independent del lloc funciona molt més ràpid que una plantilla adaptativa;
- la majoria de vegades és possible anar a la versió principal de la pàgina des del mòbil.
Però aquí també hi havia alguns inconvenients:
- Múltiples adreces: versió per a ordinadors i mòbils del lloc. Com fer que l'usuari recordi dues opcions? Els administradors web sovint prescriuen una redirecció (redirecció) de la versió d'escriptori a la versió mòbil, però al mateix temps, si aquesta pàgina es troba al mòbilversió no existeix, l'usuari rebrà un error. Aquí sorgeixen dificultats amb els motors de cerca, als quals els costa classificar 2 recursos idèntics, i això afecta directament la promoció.
- La versió mòbil del lloc des d'un ordinador, si l'usuari la visita per error, semblarà ridícul, cosa que també pot afectar el trànsit.
- Aquesta versió sovint està molt reduïda, d'escriptori, de manera que l'usuari tindrà una funcionalitat molt limitada. Però al mateix temps, si f alta alguna cosa, el visitant pot anar a la versió completa de la pàgina.
En general, un lloc mòbil independent es justifica i és la forma més habitual d'adaptar un recurs per a dispositius mòbils. És popular entre les grans botigues en línia com Amazon.
Tercera via: disseny RESS
El motor de cerca de Google admet activament aquesta direcció del disseny mòbil. Aquest és el mètode més complex, costós, però eficaç per adaptar el lloc a un telèfon o tauleta. Es diu RESS. Es tracta d'orientar un recurs a una aplicació mòbil que es pot descarregar per a cada dispositiu per separat. Per a Android, amb GooglePlay, i per a Apple, amb iTunes.
Aquestes aplicacions són ràpides, gratuïtes, còmodes, tenen la capacitat d'acollir diversos tipus d'informació, mentre que la memòria del telèfon i el trànsit d'Internet no es consumeixen com quan es visita un lloc a través d'un navegador. S'hi pot accedir fàcilment, ja que l'enllaç sempre estarà a la pantalla i no cal que introduïu un nom complex a la barra d'adreces del navegador.
N'hi ha, per descomptat, aquí iles seves deficiències, com ara la complexitat en el desenvolupament, l' alt cost de mà d'obra d'un gran nombre de programadors, la necessitat de fer diverses opcions de disseny. De vegades, l'aplicació no reconeix el dispositiu mòbil. Suport tècnic regular, la correcció de les deficiències és necessària. No obstant això, aquesta opció es considera la millor de les tres proposades pel seu funcionament productiu i ininterromput.
La forma més barata de fer un lloc web per a mòbils
Tots els mètodes anteriors impliquen, encara que no sempre llarg i difícil, el treball remunerat d'un administrador web. Si no veieu una necessitat urgent d'aquest desenvolupament, us convindrà una versió mòbil senzilla i gratuïta del lloc. Quina és la manera més fàcil de fer-ho?
Baixeu plantilles especials (connectors) per al disseny responsive. Per exemple, WP Mobile Detector, WordPress Mobile Pack, WPSmart Mobile i altres. T'ajudaran a mostrar el lloc més correctament al telèfon, mentre que rebràs alguns consells sobre què s'ha de corregir per adaptar millor la pàgina a la versió mòbil.
Per descomptat, aquest mètode no és adequat per a recursos seriosos. Més aviat, aquesta funció gratuïta està pensada per a llocs petits i senzills, blocs, canals de notícies. No oblideu que el motor de cerca de Google, així com Yandex, avui exigeix seriosament les versions mòbils, de manera que hi ha una gran possibilitat de reduir les vostres posicions amb aquest mètode.
Amb aquest mètode, molt probablement, es tallaran els anuncis i les finestres emergentsbàners, però la pàgina es carregarà ràpidament i sense "retards".
Principis per crear versions per a mòbils
No importa si la versió mòbil del lloc s'ha creat de forma gratuïta o amb l'ajuda d'un equip d'administradors web, s'ha fet amb el sistema RESS o amb una plantilla adaptativa. El més important és que, per al seu funcionament efectiu, cal que s'adhereixin a diversos principis extremadament importants. Aleshores, quina hauria de ser la versió mòbil del lloc? Com fer que sigui productiu, eficient i productiu?
Elimina tot el que no sigui necessari
El minimalisme és el que hauria de procurar el desenvolupador de la versió mòbil del lloc. Imagineu-vos el difícil que és percebre informació plena de colors, botons, pancartes i per la qual heu de desplaçar-vos sense parar a la recerca del material adequat. El disseny mòbil ha de ser senzill i net. Trieu 2-3 colors per dividir l'espai (per exemple, de marca). Millor si un d'ells és blanc. Dividiu l'espai d'una petita pantalla en zones comprensibles i llegibles. Les claus virtuals han de ser visibles perquè l'usuari sàpiga clarament on ha de prémer i veure'l: aquí teniu el producte, aquí teniu el formulari per omplir les dades, aquí teniu la informació sobre el lliurament i el pagament.
Totes les opcions addicionals que serien útils a la versió d'escriptori i facilitaran la vida a l'usuari només comportaran dificultats aquí. Deixeu només els elements més importants. L'animació, els bàners publicitaris, el multimèdia, molt probablement, només alentiran el treball del lloc o l'aplicació i distreuen deprincipal.
Alineació
El problema de l'alineació no és menys greu, perquè si es fa de manera incorrecta, l'usuari només obtindrà les terminacions de les paraules importants. Generalment s'accepta l'alineació a l'esquerra i l'alineació vertical. Imagineu-vos desplaçant-vos pel canal de notícies del vostre telèfon. Ho fas de d alt a baix, no cap a l'esquerra o la dreta.
Unificació
Quan no hi ha possibilitat d'una llarga cadena de transicions, intenteu combinar diversos passos en un sol. Per exemple, el lloc requereix l'entrada de dades en diverses etapes: un nom, després una adreça, on a cada cel·la individual hi ha una casa, un carrer, un apartament separat, etc. Per no obligar l'usuari a intentar colpejar moltes cel·les petites., demaneu-li que n'ompli només 2: nom i adreça.
I desconnexió
De vegades, per contra, cal separar massa informació. Per exemple, al menú desplegable teniu una llista de més de 80 ciutats on es fa el lliurament. Agrupeu-los per regió perquè l'usuari no hagi de desplaçar-se per aquesta enorme llista. Quan passi el cursor per sobre del centre regional o regió, una altra llista de ciutats s'abandonarà.
Llistes
Per cert, sobre les llistes. N'hi ha dos: fixats per ordre alfabètic o altre i amb substitució. La seva elecció depèn del que apareixerà a la llista.
Fixed és útil si l'usuari sap exactament què està buscant. Per exemple, ciutat, número o data. La segona opció és adequada per a noms llargs i complexos o per als casos en què hi ha moltes variacions d'un mateixel mateix nom i cada llista desplegable acosta l'usuari un pas més a l'objectiu. L'opció de substitució automàtica s'utilitza més sovint quan un visitant necessita ajuda. Per exemple, un lloc de teixir ofereix comprar agulles de teixir. L'usuari introdueix la consulta de cerca "Agulles de teixir de metall" i a la informació sobre eines veu "Agulles de teixir 5 mm", "Agulles de teixir 4,5 mm", etc.
Emplenament automàtic
Aquest article és especialment rellevant per als llocs que venen alguna cosa en línia, i heu d'omplir formularis estàndard de pagament, lliurament, etc. Si una persona fa una compra des d'un telèfon, és probable que no tingui temps. per arribar a un ordinador, el que significa que el procés de compra s'ha de fer el més ràpid i còmode possible.
Per a això, els formularis poden contenir dades ja omplertes, podeu recórrer a les respostes més populars. Per exemple, inseriu la data d'avui, el mètode de pagament en efectiu, la ciutat si treballeu a la mateixa regió. Es poden canviar, però si arribes a l'objectiu, s'estalviarà el temps de l'usuari.
Tot es llegeix, tot es veu
Quan dissenyeu la versió mòbil del lloc, recordeu que els telèfons de cadascú són diferents, i la seva vista també. Potser el vostre lloc es veurà des d'una pantalla petita, de manera que els tipus de lletra haurien de ser senzills i llegibles, els botons haurien de ser prou grans perquè es pugui fer clic sense ser portats a una altra pàgina, i les imatges haurien d'obrir-se per separat, grans, especialment quan arriba a Internet. botiga.
Algunes estadístiques
Parlant de l'adaptació del lloc als dispositius mòbils, no es pot evitar recórrer a les estadístiques per entendre la importància d'aquest procés per apromoció en línia.
Els números són els següents. Actualment, els aparells són utilitzats pel 87% de la població, pel que sembla, excepte els nens més petits i algunes persones grans. Els economistes prediuen que el comerç mòbil creixerà 100 vegades durant els propers 5 anys. Al mateix temps, només el 21% dels llocs estan adaptats per funcionar amb dispositius mòbils. Això vol dir que només s'ocupa una petita cinquena part del trànsit d'Internet i del mercat de comerç electrònic.
Pensa en aquests números. Té sentit adaptar el vostre recurs? Per descomptat que sí. A més, tot i que hi ha tant d'espai en aquest mercat, podeu crear-hi el vostre propi segment.
On necessiteu una versió per a mòbils
L'ús de la versió mòbil té sentit per a qualsevol plataforma que tingui com a objectiu aconseguir un rànquing alt. Al cap i a la fi, això té un impacte directe sobre l'usuari, creant condicions còmodes perquè es quedi al vostre lloc.
No pot existir sense la versió mòbil:
- portals de notícies, perquè la majoria es veuen des del telèfon de camí a la feina o a l'escola;
- xarxes socials: per la mateixa raó, a més hi ha un factor de comunicació en línia, el que significa que s'hauria de crear un xat còmode i entenedor per a això;
- referència, llocs de navegació, etc., on la gent va quan busca alguna cosa;
- botigues en línia: una oportunitat per atraure clients que no perden el temps comprant, sinó que ho compren tot a través d'Internet mòbil.
En lloc d'una conclusió
Avui, les tecnologies mòbils estan al mercatcreixement i desenvolupament actius, per tant, lluitant pel lideratge en el mercat, qualsevol empresa ha d'assegurar-se que el seu recurs d'Internet compleix els requisits. A causa de les demandes creixents de l'usuari, els llocs s'han d'actualitzar constantment i adaptar-se als diferents dispositius. Està clar que si una persona no té inconvenients per estar en un recurs determinat, no pot obtenir informació sobre un producte o preu allà, fer una comanda, informar-se sobre el lliurament, aleshores trobarà el lloc on tot això serà possible. Per tant, per guanyar el concurs, és important disposar d'un recurs flexible, còmode, funcional i interessant.
La versió mòbil del lloc web d'Android o d'Ios ajudarà a fer-ho. Per fer-ho, heu de triar un dels mètodes de redisseny anteriors: una plantilla adaptativa, crear un lloc nou en un subdomini i redirigir-lo, utilitzar plantilles gratuïtes o crear una aplicació mòbil que faciliti l'entrada de l'usuari. i estar a la pàgina.
Aquest enfocament no només ajudarà a mantenir la fidelitat dels clients existents, sinó que també oferirà una oportunitat per atraure nous visitants.
