Redirecționați dispozitivele mobile către conținut sau desene mobile
De ani de zile, experții spun că traficul către site-uri web de la vizitatori pe dispozitive mobile a crescut dramatic. Din acest motiv, multe companii au început să adopte inteligent o strategie mobilă pentru prezența lor online, creând experiențe adecvate pentru telefon și alte dispozitive mobile.
Odată ce ați petrecut timpul învățând cum să proiectați pagini web pentru telefoane mobile și să implementați strategia dvs., veți dori, de asemenea, să vă asigurați că vizitatorii site-ului dvs. pot vedea aceste modele. Există multe modalități prin care puteți face acest lucru și unii funcționează mai bine decât alții. Iată o privire asupra metodei pe care o puteți utiliza pentru a implementa suportul mobil pe site-urile dvs. Web - împreună cu o recomandare aproape de sfârșit, pentru ce este cea mai bună metodă de a realiza acest lucru pe Web-ul de astăzi!
Furnizați o legătură cu o altă versiune de site
Aceasta este, de departe, cea mai ușoară metodă de a gestiona utilizatorii de telefoane mobile. În loc să vă faceți griji dacă pot sau nu vă pot vedea paginile, pur și simplu puneți un link undeva în partea de sus a paginii, care indică o versiune mobilă separată a site-ului dvs. Apoi, cititorii se pot auto-selecta dacă doresc să vadă versiunea mobilă sau să continue cu versiunea "normală".
Beneficiul acestei soluții este că este ușor de implementat. Este necesar să creați o versiune optimizată pentru mobil și apoi să adăugați un link undeva în partea de sus a paginilor normale ale site-ului.
Dezavantajele sunt:
- Trebuie să păstrați o versiune separată a site-ului pentru utilizatorii mobili. Pe măsură ce site-ul dvs. devine mai mare, puteți uita să păstrați cea de-a doua versiune și site-urile dvs. ar putea să nu se sincronizeze.
- Crezi, de asemenea, oa treia versiune pentru tablete? Ce zici de oa patra versiune pentru purtare? Acest concept de versiuni specifice dispozitivului poate fi spiralat foarte rapid.
- Trebuie să puneți o legătură urâtă în partea de sus a paginii pe care le pot vedea cititorii non-mobili (și, eventual, faceți clic pe).
În cele din urmă, această abordare este una depășită, care este puțin probabil să facă parte dintr-o strategie mobilă modernă. Acesta este uneori folosit ca o opțiune fix-gap-ul în timp ce o soluție mai bună este în curs de dezvoltare, dar este într-adevăr un ajutor de bandă pe termen scurt în acest moment.
Utilizați JavaScript
Într-o variantă a abordării menționate mai sus, unii dezvoltatori utilizează un anumit tip de script de detectare a browserului pentru a detecta dacă clientul se află pe un dispozitiv mobil și apoi să îl redirecționeze către respectivul site mobil separat. Problema detectării browserului și a dispozitivelor mobile este că există mii de dispozitive mobile acolo. Pentru a încerca să le detectezi pe toate cu un cod JavaScript, poți transforma toate paginile într-un coșmar de descărcare - și încă mai ai multe dezavantaje ca abordarea de mai sus.
Utilizați handheld media CSS & # 64;
CSS comandă @media handheld pare că ar fi un mod ideal de a afișa stilurile CSS doar pentru dispozitive portabile - cum ar fi telefoanele mobile. Aceasta pare a fi o soluție ideală pentru afișarea paginilor pentru dispozitivele mobile. Puteți scrie o pagină Web și apoi creați două foi de stil. Primul pentru tipul de suport "ecran" stiluriază pagina dvs. pentru monitoare și ecrane de calculator. Cel de-al doilea pentru "handheld" stiluri pagina dvs. pentru dispozitive mici, cum ar fi aceste telefoane mobile. Sună ușor, dar nu funcționează cu adevărat în practică.
Cel mai mare avantaj al acestei metode este că nu trebuie să păstrați două versiuni ale site-ului dvs. Web. Pur și simplu o mențineți, iar foaia de stil definește modul în care ar trebui să arate - care se apropie, de fapt, de soluția finală pe care o dorim.
O problemă cu această metodă este că multe telefoane nu acceptă tipul media portabil - în schimb își afișează paginile cu tipul de suport de ecran. Și multe telefoane celulare mai vechi și handheld-uri nu acceptă deloc CSS. În final, această metodă nu este fiabilă și, prin urmare, este rareori folosită pentru a furniza versiuni mobile ale unui site Web.
Utilizați PHP, JSP, ASP pentru a detecta User-Agent
Aceasta este o modalitate mult mai bună de a redirecționa utilizatorii mobili către o versiune mobilă a site-ului, deoarece nu se bazează pe limbajul de scripting sau pe CSS pe care dispozitivul mobil nu îl folosește. În schimb, utilizează o limbă de pe server (PHP, ASP, JSP, ColdFusion etc.) pentru a examina agentul utilizator și apoi a schimba solicitarea HTTP pentru a indica o pagină mobilă dacă este un dispozitiv mobil.
Un simplu cod PHP care să facă acest lucru ar arăta astfel:
stristr ($ ua, "Windows CE") sau
stristr ($ ua, "AvantGo") sau
stristr ($ ua, "Mazingo") sau
stristr ($ ua, "Mobile") sau
stristr ($ ua, "T68") sau
stristr ($ ua, "Syncalot") sau
stristr ($ ua, "Blazer")) {
$ DEVICE_TYPE = "mobil";
}
dacă (isset ($ DEVICE_TYPE) și $ DEVICE_TYPE == "MOBILE") {
$ locație = 'mobil / index.php';
antet ("Locație:". $ locație);
Ieșire;
}
?>
Problema aici este că există o mulțime și alți potențiali agenți utilizator care sunt utilizați de dispozitivele mobile. Acest script va prinde și va redirecționa o mulțime de ele, dar nu toate prin orice mijloace. Și mai multe sunt adăugate tot timpul.
În plus, ca și în cazul celorlalte soluții de mai sus, va trebui să aveți în continuare un site mobil separat pentru acești cititori! Acest dezavantaj de a avea de a gestiona două (sau mai multe!) Site-uri web este un motiv suficient pentru a căuta o soluție mai bună.
Utilizați WURFL
Dacă sunteți încă hotărât să redirecționați utilizatorii dvs. de telefonie mobilă la un site separat, atunci WURFL (Wireless Universal Resource File) este o soluție bună. Acesta este un fișier XML (și acum un fișier DB) și diferite biblioteci DBI care nu conțin doar date wireless ale utilizatorilor fără fir, dar și ce caracteristici și capabilități suportă acești agenți utilizator.
Pentru a utiliza WURFL, descărcați fișierul de configurare XML, apoi alegeți limba și implementați API-ul pe site-ul dvs. Web. Există instrumente pentru utilizarea WURFL cu Java, PHP, Perl, Ruby, Python, Net, XSLT și C ++.
Beneficiul utilizării WURFL este că există o mulțime de oameni care se actualizează și adaugă în fișierul de configurare tot timpul. Deci, în timp ce fișierul pe care îl utilizați este deja învechit înainte de a-l descărca, este posibil ca dacă îl descărcați o dată pe lună, veți avea toate browserele mobile pe care cititorii dvs. le folosesc în mod obișnuit fără Probleme. Dezavantajul, desigur, este că trebuie să descărcați și să actualizați în permanență acest lucru - astfel încât să puteți direcționa utilizatorii către un al doilea site și dezavantajele pe care le creează.
Cea mai bună soluție este designul receptiv
Deci, dacă menținerea diferitelor site-uri pentru diferite dispozitive nu este răspunsul, ce este? Responsabil design web .
Designul receptiv este locul unde utilizați interogările media CSS pentru a defini stiluri pentru dispozitive de diferite lățimi. Designul receptiv vă permite să creați o pagină Web atât pentru utilizatorii mobili, cât și pentru utilizatorii nemobilari. Apoi, nu trebuie să vă faceți griji cu privire la conținutul pe care îl afișați pe site-ul mobil sau să rețineți că ați transferat cele mai recente modificări pe site-ul dvs. mobil. În plus, odată ce ai scris CSS, nu trebuie să descarci nimic nou.
Designul receptiv poate să nu funcționeze perfect pe dispozitive și browsere extrem de vechi (cele mai multe dintre acestea fiind astăzi foarte puține și nu ar trebui să vă îngrijoreze prea mult), ci pentru că este aditiv (adăugând stiluri în conținut, departe), acești cititori vor putea citi în continuare site-ul dvs., pur și simplu nu vor arăta ideal pe vechiul lor dispozitiv sau browser.