Kako zaznati mobilne naprave na spletnih straneh

click fraud protection

Strokovnjaki že leta govorijo, da se promet na spletna mesta obiskovalcev v mobilnih napravah dramatično povečuje. Iz tega razloga so številna podjetja pametno začela sprejemati mobilno strategijo za svojo spletno prisotnost in ustvarjati izkušnje, ki so primerne za telefon in druge mobilne naprave.

Ko enkrat porabite čas za učenje oblikovanje spletnih strani za mobilne telefone, in pri izvajanju svoje strategije boste želeli zagotoviti, da bodo obiskovalci vašega spletnega mesta videli te modele. To lahko storite na veliko načinov, nekateri pa delujejo bolje kot drugi. Tukaj je pogled na metodo, ki jo lahko uporabite za uvedbo mobilne podpore na svojih spletnih mestih - skupaj s priporočilom ob koncu, kateri najboljši način je to doseči na današnjem spletu.

Navedite povezavo do druge različice spletnega mesta

To je daleč najlažji način za ravnanje z uporabniki mobilnih telefonov. Namesto da bi vas skrbelo, ali lahko vaše strani vidijo ali ne, preprosto postavite povezavo nekam na vrh strani, ki kaže na ločeno različico vašega spletnega mesta. Nato lahko bralci sami izberejo, ali želijo videti mobilno različico, ali nadaljujejo z "običajno" različico.

instagram viewer

Prednost te rešitve je, da jo je enostavno uporabiti. Zahteva, da ustvarite optimizirano različico za mobilne naprave in nato dodate povezavo nekje na vrhu običajnih strani spletnega mesta.

Pomanjkljivosti so:

  • Za mobilne uporabnike morate vzdrževati ločeno različico spletnega mesta. Ko se vaše spletno mesto poveča, boste morda pozabili vzdrževati to drugo različico in morda ne bodo sinhronizirane.
  • Ali ustvarite tudi tretjo različico za tablične računalnike? Kaj pa četrta različica za nosljivi? Ta koncept različic za posamezne naprave lahko zelo hitro uide nadzoru.
  • Na vrh strani morate postaviti grdo povezavo, ki jo lahko vidijo bralci, ki niso mobilni (in morda kliknejo).

Konec koncev je ta pristop zastarel in verjetno ne bo del sodobne mobilne strategije. Včasih se uporablja kot popravek zaustavitve, medtem ko se razvija boljša rešitev, vendar je v tem trenutku res kratkoročni obliž.

Uporabite JavaScript

V različici zgoraj omenjenega pristopa nekateri razvijalci uporabljajo določeno vrsto zaznavanja brskalnika skript, da zazna, ali je stranka na mobilni napravi, in jo nato preusmeri na ta ločeni mobilni telefon spletnem mestu. Težava z brskalnik zaznavanje in mobilne naprave je, da obstaja na tisoče mobilnih naprav. Če jih poskušate zaznati z enim JavaScriptom, bi lahko vse vaše strani spremenile v nočno moro, ki se prenaša - in še vedno imate številne enake pomanjkljivosti kot zgoraj omenjeni pristop.

Uporabite CSS @media Handheld

Zdi se, da bi bil ukaz CSS @media handheld idealen način za prikaz CSS slogi samo za ročne naprave - kot so mobilni telefoni. To se zdi idealna rešitev za prikaz strani za mobilne naprave. Napišete eno spletno stran in nato ustvarite dva slogovna lista. Prva za vrsto medija "zaslon" oblikuje vašo stran za monitorje in računalniške zaslone. Drugi za "ročni" oblikuje vašo stran za majhne naprave, kot so tisti mobilni telefoni. Sliši se enostavno, vendar v resnici ne deluje.

Največja prednost te metode je, da vam ni treba vzdrževati dveh različic svojega spletnega mesta. Samo ohraniš eno in slogovni list opredeljuje, kako mora biti videti - kar se dejansko približuje končni rešitvi, ki jo želimo.

Težava te metode je, da številni telefoni ne podpirajo vrste predstavnosti - svoje strani prikazujejo z zaslonsko vrsto medija. Številni starejši mobilni telefoni in dlančniki sploh ne podpirajo CSS. Na koncu je ta metoda nezanesljiva in se zato redko uporablja za zagotavljanje mobilnih različic spletnega mesta.

Za zaznavanje uporabniškega agenta uporabite PHP, JSP, ASP

To je veliko boljši način za preusmeritev mobilnih uporabnikov na mobilna različica spletnega mesta, ker se ne zanaša na skriptni jezik ali CSS, ki ga mobilna naprava ne uporablja. Namesto tega uporablja jezik na strani strežnika (PHP, ASP, JSP, ColdFusion itd.), Da pogleda uporabniškega agenta in nato spremeni Zahteva HTTP da kaže na mobilno stran, če gre za mobilno napravo.

Preprosta koda PHP za to bi izgledala takole:

Težava je v tem, da obstaja veliko in veliko drugih potencialnih uporabniških agentov, ki jih uporabljajo mobilne naprave. Ta skript jih bo ujel in preusmeril, vendar nikakor ne vseh. In ves čas se doda več.

Poleg tega boste morali, tako kot pri drugih zgornjih rešitvah, še vedno vzdrževati ločeno spletno mesto za te bralce! Ta pomanjkljivost upravljanja dveh (ali več!) Spletnih mest je zadosten razlog za iskanje boljše rešitve.

Uporabite WURFL

Če ste še vedno odločeni, da boste mobilne uporabnike preusmerili na ločeno spletno mesto, potem WURFL (Wireless Universal Resource File) je dobra rešitev. To je datoteka XML (in zdaj datoteka DB) in različne knjižnice DBI, ki vsebujejo ne samo posodobljene podatke o brezžičnem uporabniškem agentu, temveč tudi funkcije in zmogljivosti, ki jih ti uporabniški agenti podpirajo.

Če želite uporabiti WURFL, prenesite konfiguracijsko datoteko XML, nato izberite jezik in na svojem spletnem mestu implementirajte API. Obstajajo orodja za uporabo WURFL z Java, PHP, Perl, Ruby, Python, Net, XSLTin C ++.

Prednost uporabe WURFL je v tem, da veliko ljudi ves čas posodablja in dodaja konfiguracijsko datoteko. Torej, čeprav je datoteka, ki jo uporabljate, zastarela skoraj preden ste jo končali s prenosom, obstaja verjetnost, da če jo Če ga naložite enkrat na mesec, boste imeli na voljo vse mobilne brskalnike, ki jih vaši bralci običajno uporabljajo težave. Slaba stran je seveda ta, da jo morate nenehno prenašati in posodabljati - vse tako, da lahko uporabnike usmerjate na drugo spletno mesto in pomanjkljivosti, ki jih ustvarjajo.

Najboljša rešitev je odziven dizajn

Torej, če vzdrževanje različnih spletnih mest za različne naprave ni odgovor, kaj je? Odzivno spletno oblikovanje.

Odzivno oblikovanje je, če z medijskimi poizvedbami CSS definirate sloge za naprave različnih širin. Odzivna zasnova vam omogoča, da ustvarite eno spletno stran tako za mobilne kot tudi za mobilne naprave. Potem vam ni treba skrbeti, kakšno vsebino naj bodo prikazane na spletnem mestu za mobilne naprave, ali pa ne pozabite prenesti najnovejših sprememb na svoje spletno mesto za mobilne naprave. Ko je CSS napisan, vam ni treba prenesti nič novega.

Odzivna zasnova morda ne bo delovala popolnoma na izjemno starih napravah in brskalnikih (ki so danes v zelo majhni uporabi in vas ne bi morali skrbeti), ampak ker je dodatek (dodajanje slogov v vsebino, namesto da bi vsebino odvzeli) bodo ti bralci še vedno lahko brali vaše spletno mesto, le ne bo videti idealno na njihovi stari napravi ali brskalnik.

instagram story viewer